최근, Stitch가 크게 업데이트되었다는 소식을 듣고 근 1년만에 Stitch를 다시 방문했다.
시작 UI부터 제법 바뀌었다. 위가 2025년 5월, 아래가 오늘 캡쳐한 Stitch 시작 화면이다.
과거에는 Standard Mode와 Experience Mode로 나뉘고(우측 상단에서 선택), 프롬프트 입력창에는 웹 아니면 앱 둘 중 하나의 사이즈를 선택한 후 프롬프트를 입력하게 구성했는데, 이제는 모드 대신 모델을 선택하고(Standard Mode가 Gemini 3를, Experience Mode가 Gemini 3.1을 쓰게끔 선택지가 바뀐 듯 하다) Redesign과 Ideate라는 새로운 선택지가 추가로 생겨났다.
작업 화면은 더 많이 바뀌었다. Mixboard의 보드형 UI를 가져와 적용한 것 같이 보인다. 왼쪽에 결과물 설명을 볼 수 있는 창이 있고, 프롬프트 입력창은 왼쪽에서 가운데로 이동했으며, 오른쪽에는 선택편집, 이미지 추가 등의 아트보드 편집 툴이 추가되었다.
한 가지 큰 변화로는 ‘디자인 시스템’이 생겨났다. 디자인을 만들어달라고 프롬프트를 입력하면, 디자인을 들어가기 전에 디자인 가이드를 선 작성하고, 오른쪽 메뉴에서 컬러와 글꼴을 선택해 적용할 수 있는 옵션을 제공한다. 프롬프트를 추가로 입력해 디자인이 바뀌고 새로운 디자인 가이드가 나오더라도 디자인 가이드 히스토리가 쌓여 두번째 버전 디자인에 첫번째 버전 스타일 가이드를 적용해볼 수도 있다.
추가로, 각 디자인 시스템에는 DESIGN.md 파일을 생성해 다른 툴에서 디자인 작업을 하더라도 가이드대로 디자인을 할 수 있도록 가이드라인 문서를 제공하고 있다.
새로 리뉴얼하면서 Stitch는 Vibe Design이란 단어를 내세웠다. UI/UX 디자인의 전반적인 과정을 Vibe로 해결해주겠다는 의미가 담겼는데, 그에 걸맞게 기존 UI 디자인을 새로 바꿔서 다시 디자인해주는 Redesign이나, 문제를 해결하는 UI를 그려주는 Ideate 기능이 추가되었다. 디자인 시스템 기능 또한 UI/UX 디자인의 전반적인 과정을 Stitch 내부에서 처리한다는 ‘Vibe Design’에 맞게 추가되었다.
제일 궁금한 Ideate 기능을 한번 써보기로 했다. 마침 지난주 떠오른 아이디어 중에 ‘1본부 폰트 미리보기 플랫폼’이 있었는데, Claude Code로 처음부터 작업할 계획을 틀어 Stitch에서 먼저 화면 디자인을 들어가보기로 했다.
질문을 던지자 미니멀 에디토리얼, 스튜디오 툴킷, 브랜드 라이브러리 총 3가지 컨셉을 제시했다. 미니멀 에디토리얼은 포스터 갤러리 같은 아트 스타일의 컨셉, 스튜디오 툴킷은 실용도 높은 전문가 컨셉, 브랜드 라이브러리는 친근하고 정돈된 사내 도구 컨셉이라는 설명도 덧붙여주었다. 세번째 브랜드 라이브러리 컨셉이 이번 용도에 맞을 것 같아 세번째 컨셉을 골랐다.
컨셉을 고르자 제일 먼저 PRD를 작성해주었다. PRD는 html 파일로 다운로드가 가능하다. PRD는 영문으로 쓰여있지만, 왼쪽에 한국어로 추가 설명을 해줘서(아마 프롬프팅을 한국어로 해서 그런 것 같다) PRD 내용을 어렵지 않게 이해할 수 있었다.
PRD를 컨펌해주면 본격적으로 UI 디자인 작업에 들어간다. 디자인 가이드 제작, 4가지 기획한 화면 제작까지 3분 정도 소요된 것 같다.
작업된 화면은 프롬프트를 입력해 추가 수정을 해도 되고, 특정 화면을 선택해 상단 메뉴를 통해 수정해도 된다. 주요 수정 작업은 ‘Generate’에서 확인할 수 있는데, 앱 화면으로 변경시켜주는 Mobile App Version과 히트맵을 제작해주는 예측 히트맵 메뉴가 인상적이었다.
과거 Stitch에서 지원해주지 않거나, 구현되지 않았던 두 기능이었기 때문에 더 인상적이었던 듯 싶다. 앱 아니면 웹 둘 중 하나만 구현이 가능했었는데 이제는 반응형 생성을 지원하고, 예측 히트맵을 생성해주어 디자인 뿐 아니라 앞단인 화면 기획까지 커버할 수 있는 점을 확인했다.
‘인스턴트 프로토타입’ 기능도 제법 인상깊었다. Stitch 내부에서 생성한 디자인은 그 자리에서 인터랙션까지 확인이 가능해졌다. 화면을 여러 개 선택하면 자동으로 화면끼리 연결고리까지 생성해 클릭하면 넘어갈 수 있다.
데스크탑, 태블릿, 모바일 반응형 확인도 바로 가능하고 호버, 클릭 등 버튼 인터랙션, 인풋 인터랙션, 슬라이더 인터랙션 등 주요 UI 인터랙션은 웬만하면 구현이 다 되었다. 다만 슬라이더를 움직였을 때 글자 크기가 조정된다던가, 탭 버튼을 클릭하면 다른 탭으로 바뀐다던가 하는 복합적인 인터랙션까지는 구현이 되지 않았다.
프로토타입 미리보기 창에서도 화면 수정, 새로운 화면 만들기 등이 지원된다.
Stitch가 Gailieo AI일때부터 이 서비스를 써왔는데, 기능 면에서는 괄목상대 할 정도로 많아졌고, 좋아졌다. 디자인의 수준도 예전보다는 많이 나아졌다. 30분도 안돼서 화면 기획에 디자인 초안, 프로토타입까지 뽑아낼 수 있을 정도면 초기 디자인 작업에서 활용도가 꽤 높을 것으로 기대가 된다.
이제 여기서 어느 수준까지 디자인을 끌어올릴 수 있는지가 관건이다. 차주에는 수정작업을 진행하면서 디자인 퀄리티를 (내 수준에서) 최대치로 끌어올려볼 생각이다.