피그마 AI 플러그인으로 디자인하기
Jul 15, 2023
AI 로 프로덕트 디자인하기
- 피그마의 AI기반 플러그인을 사용하여 프로덕트 디자인을 진행해보자.
요즘 핫한 챗 GPT에게 AI로 프로덕트 제작하기를 물었다.
Ai로 프로덕트 제작하기 챗 GPT 답변
그거 재미있겠는데요! 인공지능으로 제품을 만드는 것은 다양한 가능성과 잠재적인 이점을 제공할 수 있습니다. 시작하려면 AI로 제품을 만드는 데 관련된 단계에 대한 일반적인 개요가 다음과 같습니다:
문제 정의: 제품이 해결하고자 하는 문제 또는 필요성을 명확하게 식별합니다. AI가 솔루션을 제공하거나 제품의 기능을 향상시킬 수 있는 방법을 결정합니다.
연구 및 데이터 수집: AI 모델을 교육하는 데 사용할 관련 데이터를 수집합니다. AI 시스템의 성공을 위해서는 데이터의 품질과 다양성이 매우 중요합니다.
데이터 사전 처리: 수집된 데이터를 정리하고 사전 처리하여 교육에 적합한 형식을 갖추도록 합니다. 이 단계에는 특정 프로젝트에 따라 데이터 정리, 정규화, 피쳐 추출 및 기타 기술이 포함될 수 있습니다.
AI 접근법 선택: 제품에 사용할 AI 접근법 또는 알고리즘을 결정합니다. 여기에는 기계 학습, 딥 러닝, 자연어 처리, 컴퓨터 비전 또는 이러한 기술의 조합이 포함될 수 있습니다.
모델 개발 및 교육: 선택한 접근 방식을 사용하여 AI 모델을 구축합니다. 이 단계에서는 적절한 프레임워크 또는 도구를 선택하고 모델 아키텍처를 설계하며 사전 처리된 데이터를 사용하여 교육합니다.
테스트 및 검증: 검증 데이터 세트 또는 테스트 시나리오를 사용하여 AI 모델의 성능을 평가합니다. 정확도, 정밀도, 리콜 또는 기타 관련 메트릭을 평가하여 원하는 요구 사항을 충족하는지 확인합니다.
통합 및 배포: 훈련된 AI 모델을 제품 인프라에 통합합니다. 여기에는 API를 개발하거나 기존 소프트웨어 또는 하드웨어 솔루션에 AI 시스템을 통합하는 작업이 포함될 수 있습니다.
모니터링 및 개선: AI 시스템이 배포된 후 지속적으로 성능을 모니터링합니다. 피드백을 수집하고, 사용자 상호 작용을 분석하고, 이러한 정보를 사용하여 모델의 정확성과 사용자 경험을 개선할 수 있습니다.
반복 개발: 피드백 루프를 유지하여 사용자 요구사항을 해결하고 버그를 수정하며 AI 기반 제품에 새로운 기능을 추가합니다. 새로운 데이터를 사용할 수 있게 됨에 따라 AI 모델을 정기적으로 업데이트하고 개선합니다.
개인 정보 보호 및 윤리적 고려 사항: 제품이 관련 개인 정보 보호 규정 및 윤리적 지침을 준수하는지 확인합니다. 사용자 데이터를 보호하고 AI 사용과 관련된 잠재적 편견이나 윤리적 문제를 해결합니다.
AI로 제품을 만드는 것은 복잡한 과정이며, 제품의 특성과 해결하려는 문제에 따라 관련된 구체적인 단계와 기술이 달라집니다. 성공적인 결과를 얻으려면 도메인 전문가, 데이터 과학자, 엔지니어 및 UX 디자이너로 구성된 다학제 팀을 구성하는 것이 중요합니다.
유용한 답변을 줘서 고마워요! 챗 GPT! 하지만, 이번엔 챗 GPT와의 기대완 반대로 AI를 활용하여 프로덕트 디자인하기가 주제다. 미안, 챗 GPT 담번엔 꼭 너의 기대에 부응해 보도록 할게!
피그마 AI 플러그인을 활용하여 디자인하기
현재 다양한 종류의 피그마 AI 플러그인이 출시되고 있다. 재밌고 유용한 플러그인들이 많지만, 그중 가장 유명한 AI플러그인들을 활용하여 디자인을 해보려고 한다. 목표는 쇼핑몰 상세페이지 디자인하기! 가장 첫번째로 사용한 플러그인은 키워드를 입력하면 간편하게 와이어 프레임을 제작 해주는 Wireframe Designer 라는 플러그인이다.
ZERO에서 Wire frame을 제작해 준다니 너무 놀랍지 않은가! 두근거리는 마음으로 키워드를 입력 후 생성 버튼을 눌렀다.
아래는 플러그인에 Shoping Detail / Product Detail 이라는 간단한 키워드를 입력하여 출력된 와이어프레임 디자인이다. 재밌는 점은 두 와이어 프레임 모두 어느정도 쇼핑몰의 상세페이지를 표현하고 있지만, 단어에 따라 표현한 정보의 디테일이 다르다는 점이다. 콩글리쉬를 써도 큰 틀에서 쇼핑몰의 상세페이지를 표현해 내다니 놀라울 따름이다.
wire Frame
물론, 이 와이어프레임 그대로 활용하여 디자인 하거나 개발하는 데에는 무리가 있지만 짧은 시간 동안 와이어프레임으로 활용할 소스를 만들어 냈다는 것에 박수를 보내고 싶다. 무엇보다 제로에서 시작하는 것과 활용할 만한 소스가 있다는 건 디자이너 모두가 알겠지만 큰 차이점이 있는 법이다.
DALL-E Bro
위에 만든 와이어 프레임을 활용하여 자전거 판매 상세페이지를 만들어 보려고 한다. 자전거 이미지는 챗 GPT를 활용한 이미지 소스 제작툴 DALL-E Bro를 활용하려고 한다.
!앗! 그런데 유료다. 아쉽지만 대신 이번엔 AI 3D 이미지 생성 플러그인을 사용하기로 한다.
Magestic
Magestic은 3D 이미지 소스 생성 ai 이미지이다. 10번의 무료 소스 생성을 제공한다. 이 플러그인으로 Bycle 이미지를 생성했다. 생성한 이미지의 저작권은 놀랍게도 생성자가 가진다고 한다. 그런데.. 아직 핑크색 모델링만 제공한다.
본의 아니게 핑크 자전거를 팔게 되었다.
AI로 만든 상세페이지
위의 플러그인들을 기반으로 만든 소스를 가지고, 상세페이지의 대략적인 가안을 잡아 보았다.
Wire frmae을 처음 접해봤었을 때는 오, 그럴싸 한데? 였지만 실질적으로 작업에 들어가보니 음… 아직은 많이 부족하다. 라는게 솔직한 평이다.
wire frame을 통해 필요한 항목들을 볼 수 있었지만, 역시 클릭 한번으로 내가 원하는 기능을 모두 표현하는 건 무리였다. 결국 원하든 원치 않든 사람의 손이 들어가게 된다.(휴.. 다행이다! 아직 직업을 뺏기지 않았어!)
총평
피그마의 AI플러그인들은 입력→출력 식으로 바로 사용하긴 아직까진 무리이다. 서포트 도구라고 불리기에도 아직은 부족한 단계인듯 하다. wire frame을 바로 그려준다는 점에서 엄청난 매력을 느꼈으나.. 까고 보니 와이어프레임의 구성요소들을의 소스 제공에 그치는 수준이었다.
Magestic은 생각보다 훌륭했다. 우선 핑크색으로만 출력되기는 하나 다양한 각도의 3D 이미지를 만들어준다는 점이 훌륭했다. 그런데 무료 버전이라서 그런지 2가지의 각도만 출력이 되는 점이 조금 아쉬웠다.
특히 만들어진 소스의 저작권은 생성자에게 있다니 그 점이 매력 포인트로 다가왔다. 해당 이미지 소스를 가지고 색상 조합만 잘 한다면, 나름 쓸만한 이미지가 만들어지지 않을까 싶다.
피그마의 AI 플러그인들은 결론적으로 “아직은 실무엔 활용하긴 어렵다” 이다. 왜냐하면 Wireframe은 이미 피그마 커뮤니티에서 수많은 소스들을 제공해주기 때문이고, Magestic 도 마찬가지. 수많은 무료, 또는 유료의 퀄리티 좋은 3D 이미지가 있기 때문이다.
하지만 충분히 매력적이고, 발전 가능성이 있는 기술들이기에 앞으로의 업데이트가 기대된다.
Share article