brunch

You can make anything
by writing

C.S.Lewis

by 젠젠 May 13. 2024

새로운 UI 협업 툴, Creatie 훑어보기

또 또 또 새로운 툴이야? 아이고..

세 줄 요약

- 피그마와 인터페이스가 99.9% 동일하여 사용 시 진입장벽이 낮다(단축키도 동일한 걸로 보임). 그러나..
- AI로 조금 더 빠르게 아이디어를 시각화할 수 있다. 그러나..
- 디자이너가 없는 곳에서 유용할 수 있다. 그러나..




0. 머리글


바야흐로 대 피그마의 시대가 무르익고 있는 현 시대에 새로운 대항마가 등장했다는 소식을 전해들었다. 

대 피그마 시대에 선전포고를 한 용감무쌍한 주인공은 바로 Creatie라는 툴. AI를 기능단에서 적극적으로 활용한 툴이라고 한다.

아마도 사자가 피그마

새 툴이 또 나왔단 소식에 난 설렘 반, 피로감 반으로 머리가 지끈지끈했다. 한 평생 배워야 하는 디자이너로서 나의 숙명이 피부로 와 닿아 소름이 싹.. 


한 편으론 이렇게 피그마가 온 세상을 지배한 시점에서 피그마 유저들을 데려오기 위해서는 굉장한 킬러 기능이 있거나 아주 뛰어난 사용성(속도, 인터페이스, 작업 편리성 등)이 있어야 할텐데.. 무슨 자신감일까 궁금하기도 했다. 어도비에서 피그마로 넘어온 건, 그 사용성과 작업 편리성이 기존 어도비 제품 대비 특출나게 뛰어났기 때문인데, 분명 Creatie에도 이렇게 뭔가 있겠지 싶어 빠르게 사용해보고 싶어졌다.


Creatie는 https://creatie.ai/ 여기서 바로 사용할 수 있다. 피그마처럼 웹으로 사용할 수도 있고, 따로 프로그램을 받아서 사용할 수도 있다. 윈도우/맥(인텔, 애플) 모두 지원한다. 다소 불편한 점은, 아직 베타 버전이라 그럴 수도 있지만 컴퓨터에 저장된 폰트를 사용하기 위해서는 따로 "Mac/Windows Font Helper"라는 걸 받아줘야 한다는 것이다. (본 버전이 나오면 이런 기본적인 사항은 개선될 거라 생각한다.)




1. 전체적인 인터페이스 구경하기


Creatie를 열어보자마자 충격받았던 건, 피그마와 그 인터페이스가 아주 동일하다는 점이었다. 사실 홈페이지 자체도 굉장히 비슷한 톤을 띄고 있어서 흠칫 했는데 제품은 더 똑같았다..(동공지진...) 이렇게까지 똑같이 해도 고소 안 당하나 싶을 정도였다. Creatie에 대해 아무런 배경지식이 없는 내가 사용해도 여차저차 사용할 수 있을정도로 기존 피그마 멘탈모델을 벗어나지 않는데, 아마 대 피그마시대에 새로운 툴로 넘어오는 허들을 낮추기 위함이라고 해석되긴 한다. 그래도 그렇지 너무 똑같은 거 아닌가.. 데브모드 토글과 info버튼 마저 똑같다.. 후덜덜..

좌:Figma, 우: Creatie

일단 이렇게나 비슷하다 보니, 딱히 배경지식 없이도 이리저리 만져볼 수 있다. 툴 아이콘이 피그마는 왼쪽에 있고, Creatie는 중앙에 있다는 차이 외엔 그 구성 면에서는 큰 차이가 없다. 




2. 새로운 기능 구경하기


거의 모든 게 똑같은 모양새지만, 그래도 딱 세 가지 기능에서 차이가 있다. 정확히 말하자면 Creatie에 세 가지 기능이 더 추가돼 있다. 물론 이 기능들도 피그마에서 플러그인을 쓴다면 충분히 사용가능한 것들이지만, 인터페이스 내 기본 기능이라는 점에서 주목할 만 하다.

보라색 테두리가 피그마와 두드러지는 차이점

바로 툴바에 있는 이 세 아이콘으로, Comment(말풍선 아이콘) 옆 세 개다. 왼쪽에서부터 Audit, Creatie Wizard, Magicon이며 모두 아직 베타 기능이다. 하나씩 간단히 기능을 살펴보자.



Audit(Beta)

직역하자면 "심사"라는 뜻으로, 디자인 산출물 중에 오류가 있는지 자동으로 점검해주는 기능이다. 예컨대 산출물 중에 r값이 다른 건 없는지, 마진이 다른 건 없는지 등 디자이너가 놓치기 쉬운 부분들에 대해 자동으로 점검을 해 주는 거다.

Customized/Basic

기본적인 디자인 시스템을 따르거나, 본인 만의 디자인 시스템(Customized)를 따라 점검할 수 있다. 나는 생성해 둔 디자인 시스템이 없으니 그냥 Basic으로 체험해 봤다. 일부러 "다음"버튼 r값만 안 준 채로!

Audit 기능 체험

Audit 버튼을 눌렀더니 두둥.. 이렇게 나왔다. 딱 한 가지만 변수를 뒀는데 왜 4가지나 나온 걸까..? 의아.. 뭔가 제안을 해 주기는 해 주는데 썩 도움이 되진 않는다. 내가 의도한 바 대로 동작하지 않으니 당혹스럽다. 베타 버전이니 그러려니.. 해 본다. 

그래도 일단 이 기능을 플러그인이 아니라 기본 기능으로 두고자 한 접근은 굉장히 마음에 든다. 이런 사소한 부분은 한 찰나에 놓치게 되는데, 기술의 도움을 받을 수 있다면야 쌍수 들고 환영! 



Creatie Wizard(Beta)

창작 마법사! 이게 좀 진짜 신박한 기능이었다. 피그마 컨피그에서 보여주던 그 세계가 creatie로 조금 더 빨리 구현된 느낌? 이 아이콘을 누른 상태로 프레임 안에 영역을 드래그해서 그려주면, 해당 위치에 들어갈만 한 컴포넌트를 자동으로 추천해준다. 원하는 컴포넌트 검색도 가능하다.

Creatie Wizard 기능 체험1

이렇게 버튼이 들어갈 위치에 버튼 크기로 영역을 그려주면,

Creatie Wizard 기능 체험2

이렇게 버튼이 나름 Primary, Secondary 옵션으로 나온다. 물론 그 크기감 같은 건 좀 터무니 없지만, 각 요소(r값, W/H, 폰트 값, 패딩 등)는 세부 조정이 가능하다. 이렇게 보면 오? 좀 쓸만 한가? 싶다가도.. 

Creatie Wizard 기능 체험3

이렇게 검색해서 컴포넌트를 생성할 수도 있긴 하다. 하지만 내가 원하는 list 형태는 나오지 않았다 ㅠㅠ (애초에 Creatie의 AI가 현재 가지고 있는 컴포넌트 풀 자체가 적은 것 같긴 하다.) 

Creatie Wizard 기능 체험4

그래도 신기한 건 또 있다. 저렇게 컴포넌트를 선택하면 Skeletone 상태로 불러와지는 게 아니라, 더미 이미지와 텍스트를 모두 얹어서 제공해 준다는 점이다. 플러그인으로 더미 일일이 넣자면 그것도 사실 귀찮긴 한데, 이렇게 뿅 하고 나타나니 좀 신기했다. 다만 극 한국인인 내게는 불러오는 데 걸리는 시간이 영겁이었다. 뱅글뱅글 돌고 있는 로딩 인디케이터를 보자면 속이 터ㅈ...


솔직히 그 퀄리티가 만족스럽지는 않지만, 베타 버전임을 감안하면 초반 와이어 프레임 짜는 데는 많은 도움이 될 거 같다고 느꼈다. 디자이너가 없는 회사에서 일 하고 있는 PM/PO/기획자나 1인 창업자들에게도 많은 도움이 될 것 같고. 


+ 이 기능이 더 발전하면 디자이너도 초기 아이디어 시각화 단계에서 시간 소모를 줄이고, 문제 해결 방안을 세부 조정(Fine Tuning)하는 데 시간을 더 할애할 수 있을 거란 기대가 있다.



Magicon(Beta)

마법+icon의 합성어일까..? 정확한 뜻은 모르겠다. 기능 자체는 AI 이미지 생성기다.

Magicon기능 체험1

Magicon아이콘을 누르면 이렇게 생긴 화면이 나온다. 왼쪽 하단에서 프롬프트를 입력하고, 우측 패널에서 스타일, 레퍼런스를 체크해주면 된다. 여타 AI 이미지 생성기와 유사한 구조다. 

Magicon기능 체험2

나는 병아리 캐릭터가 손에 풍선을 들고 반갑게 맞이하는 모습을 그려달라고 요청했다. (영어 번역해준 따봉 Chat GPT야 고마워!) 그러나 어딘가 괴이한 결과물이 나와서 당황.. 일단 색깔은 병아린데 뭐지 곰이야 개야 뭐야 ㅠㅠ 게다가 저 엠보싱 느낌 가득한 모습이 약간 징그럽게 느껴져서 스타일을 바꿔보기로 했다.

Magicon기능 체험3

저한테 왜 이러세요.. 병아리 돌려내.. 뭔가 ㅋㅋㅋ 오리 발 같은 것도 있고 노란색도 있고.. 얼추 뭐지? 싶은데 난감한 비주얼이 아닐 수 없다 ㅋㅋㅋ 거기다 또 한국인 이슈인데, 아니 너무 느리다. 마냥 기다려야 하는 게 좀 힘겹다. 로딩 중에 프로그레스 바나 랜덤 문구라도 넣어주던지, 좀 더 UX적으로 이 로딩 시간을 짧게 느낄 수 있도록 조치해 주면 좋겠다.


+ 그 와중에 또 색조합은 맘에 든다. 좀만 더 똑똑해지면 진짜 쓸 만 하겠는데! 조금만 더 결과물이 잘 나온다면 3D 아이콘 사이트 연간 결제를 끊어도 될 것 같다. 아직은 역부족..ㅠㅠ 

Magicon기능 체험4: 배경 제거를 누르면 오른쪽 이미지처럼 배경이 제거된다.

아, 한 가지 또 좋은 점은 생성된 이미지의 배경을 이 자리에서 바로 제거할 수 있다는 점이다. 화면 그릴 때 대부분의 경우 배경은 필요가 없기 때문에 따로 배경 제거를 해 줘야 하는 번거로움이 있는데, 뎁스 없이 바로 할 수 있다는 점은 좋았다. Export와 Insert도 한 구간에 같이 있어서, Insert 후에 Export해야 하는 번거로움도 없었다. 좀만 더 발전해주라..




3. 마무리


한 번 훑어보는 식으로 가볍게 구경해 본 소감은 '아직은 피그마구나'였다. 새로운 기능이 추가됐다지만 그렇게까지 와우!는 또 아니었고, 기본적으로 피그마 내에서 혹은 다른 사이트를 통해서 모두 해결 가능한 지점이기 때문에 그 기능이 몹시 뛰어나지지 않는다면 굳이 갈아탈 의향은 없다. 


다만 디자이너가 아닌 사람들에게는 오히려 유용할지도 모르겠단 생각이 들었다. 약간 UI계의 망고보드 같은 느낌? 디자인 베이스가 없는 PM/PO/기획자나 1인 창업가들이 아이디어 초기 단계에서 시각화가 필요할 때, 굉장히 도움을 받을 수 있을 것 같았다. 소통 비용을 줄이는 데도 이바지할 수 있지 않을까? 싶고. 


위에서 언급했듯, 디자이너로서도 초기 단계에 도움 받을 수 있는 지점은 분명 있기 때문에 잘 발전한다면 윈윈 툴이 되지 않을까 싶다. 여러 안을 힘들이지 않고 시각화해서 볼 수 있고, 디자이너는 그걸 세부 조정하고, 조합해서 더 나은 해결방안을 도출하고. 여타 사항을 결정하여 더 좋은 방향을 설정하는 역할로 나아갈 수 있지 않나 한다.


다만 완전 깊게 살펴본 건 아니라서, 어쩌면 내가 미처 발견하지 못 한 장점이 있을 수 있다는 점은 유의해 주시라.. (도망) 나는 본 버전이 나오면 그 때 다시 한 번 살펴보려고 한다. 베타는 이만하면 됐다.. 키키..

https://i.imgflip.com/oxmt9.jpg?a476400


..각설하고,

Creatie 장단점으로 마무리 해 보자. 


장점

- 피그마와 99.99% 비슷한 인터페이스/기능으로, 피그마에 능숙하다면 Creatie도 바로 쓸 수 있다.

- 피그마에서는 플러그인을 따로 검색하고 > 켜서 > 기능을 사용해야 한다면, Creatie는 툴바에서 바로 사용할 수 있어 편리하다.

- AI가 더미 이미지/텍스트를 모두 얹은 채로 컴포넌트를 그려줘서, 초기 아이디어 시각화 단계에서 시간을 줄일 수 있다.

- AI로 3D 이미지를 바로 생성할 수 있어서 관련 비용을 절감할 수 있다. 


단점

- 피그마와 너무 똑같기 때문에 왜 Creatie로 넘어가야 하는지 모르겠다. 큰 차이가 없다면 아무리 진입장벽이 낮아도 굳이 넘어갈 이유가 없다. 게다가 협업 툴인 이상 이미 많은 사람이 익숙하게 여기고 사용하고 있는 툴이 우세할 수 밖에 없을듯.. 

- 피그마 플러그인이나 커뮤니티 기능으로 이동해야 하는 뎁스가 있긴 해도, 그 풀이 워낙 넓고 또 잘 만들어져 있는 콘텐츠들이 많아서 탐색 과정 자체가 유용한 측면이 있다. Creatie의 AI가 더 방대한 양의 학습을 하고 돌아온다면 더 편리하게 사용할 여지는 있는 듯. 속도도 좀 빨라지면 더 좋겠고..

- AI로 컴포넌트를 그릴 수 있는 부분은 분명 고무적이지만, 그 정확도가 너무 낮고 컴포넌트 종류/갯수도 너무 적다. 더 많아져야 제대로 사용할 수 있을 것 같다. 아직 베타 버전이니 그러려니 하는 부분이다. 속도도 좀 빨라지면 더 좋겠고..222..

- 이미지 생성기 역시 정확도 문제가 있다. 완전히 원하는대로 나오진 않더라도, 어느정도 근접해야 프롬프트를 고쳐가며 이미지를 만들어 보겠는데, 너무 얼토당토 않으니 의지를 상실하게 된다. 추후에 더 똑똑해 진다면 분명 유용한 기능이긴 할 것.


작가의 이전글 프로덕트 디자이너 병아리 주니어라면 이것만 확실하게!
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari