UI 그려주는 AI 3대장, 어떤게 나랑 잘 맞을까?
툴 선택하기 전 꼭 해봐야 할 비교 분석
이제 많은 UX/UI 디자이너들이 디자인 업무의 일부를 AI에게 맡기고 있어요. 하지만 디자인이라는 작업이 워낙 맥락적이고 미묘한 차이로 완성도가 결정되는 만큼 과연 어디까지 AI에게 맡길 수 있는지에 대한 고민이 뒤따르곤 하죠.
AI가 뽑아주는 UI는 기본적으로 프롬프트라는 언어적 입력을 이미지로 번역한 결과물이기 때문에, 얼마나 정확하고 명료한 프롬프트를 쓰느냐에 따라 품질이 극명하게 갈릴 수밖에 없어요. 하지만 동시에, 우리가 어떤 AI 툴을 사용하는지도 결과에 큰 영향을 미치죠. 예를 들어, 빠르게 여러 개의 화면을 한꺼번에 생성해보고 싶다면 Uizard나 Visily처럼 멀티스크린을 지원하는 AI가 좋고, 직접 세부적으로 커스터마이징을 하고 싶다면 Figma Make처럼 디자이너가 수동으로 세세히 조정할 수 있는 도구가 훨씬 나을 거예요. 또 단순히 디자인 시안을 넘어서 실제로 활용 가능한 HTML/CSS 코드까지 확인하고 싶다면 구글의 Stitch처럼 코드 생성을 지원하는 AI가 더 적합할 수도 있겠죠.
결국 중요한 건 "무조건 좋은 AI 툴"이 아니라, "내 목적에 맞게 가장 잘 활용할 수 있는 AI 툴"을 선택하는 일이에요. 어떤 AI 툴도 완벽히 모든 면에서 뛰어나지는 않고, 각자 분명한 장점과 단점이 존재하거든요. 그래서 저는 지금부터 UI 생성형 AI 세 가지(Stitch, Readdy, Figma Make)의 주요 특징과 장단점을 상세히 비교해 드리려고 해요.
1. Stitch
Galileo가 구글과 만나 탄생한 빠른 프로토타입 AI
원래 2022년부터 UI를 생성하는 생성형 AI 툴로 인기를 얻었던 Galileo AI가 2025년 5월 20일 구글에 인수되면서 새롭게 재탄생한 서비스가 Stitch에요. Galileo가 구글의 강력한 Gemini AI 모델과 만나면서 더욱 발전된 모습으로 공개된 것이죠.
창업자가 상당히 기뻐보이는군요... (구글 입성의 성공을 자축하고 있습니다)
장점
Galileo와 합세한 Stitch가 초기에 강점으로 내세웠던 건 종이에 손으로 그린 스케치를 곧바로 화면 위의 디지털 UI로 바꿔주는 기능이에요.
가볍게 스케치하며 아이디어를 정리하는 디자이너라면 러프하게 구상한 와이어프레임을 빠르게 디지털로 구체화하며 디자인의 시작점을 잡아볼 수 있겠죠. 아날로그와 디지털 사이의 간격을 좁혀준다는 점에서 Stitch는 확실한 강점을 가진 툴이라고 볼 수 있을 것 같아요.
외에도 눈에 띄는 장점들이 있어요. 프롬프트 입력만으로 생성한 UI가 실제 활용 가능한 HTML/CSS 코드로 제공되고, 색상이나 모서리 Radius 변경 등의 간단한 디자인 수정은 바로 실행하거나, 오브젝트가 살아있는 상태로 Figma에 옮겨 직접 편집할 수도 있어요. 여러 화면을 동시에 생성해 전체 플로우를 빠르게 확인하는 것도 가능하구요.
단점
그런데 사용하다 보면 Stitch의 결과물이 그다지 만족스럽지 않을 때가 많아요. 단순 정보를 나열하는 형태로 밖에 느껴지지 않고 대부분의 나열도 대체로 비슷한 형태를 띄고 있거든요 (창의성이 거의 제로). 분명 Galileo AI 시절에는 '모듈'이라는 개념을 분명히 알고 정보간 구분이 확실하거나 다른 세련된 UI를 많이 학습하고 있었다고 느꼈는데 구글과 만나면서 오히려 중요한 무언가가 빠져버린 느낌이에요.
Stitch로 만들어본 다양한 UI들구분이 없는 정보의 나열도 문제지만 세부 요소를 구성하는 능력도 많이 부족해요. 하나의 '모듈' 안에는 여러 요소들이 밀집되어 각자 자신의 역할을 충분히 지녀야 하는데 Stitch는 그러질 못해요. 아래 Readdy가 만든 화면을 보면 리스트에 '더보기 아이콘'이 하나씩 들어있어요. 설령 기획적으론 오류였어도 있는걸 빼는게 낫지 없는걸 추가하는건 어렵잖아요. 사실 요소의 디테일함이 있고 없고를 떠나 만약 이런 작은 것까지 직접 타이핑해서 프롬프트를 써야 한다면 AI를 쓰는 이유가 거의 없을 것 같은 거죠.
동일한 프롬프트로 Stitch와 Readdy에게 UI 생성심지어 프롬프트를 거듭할 수록 내가 이전에 한 이야기를 까먹기 시작해요. 초기 화면이 만족스럽지 않더라도 하나하나 수정해나갈 수 있어야 하는데, 유지하고 싶었던 부분을 마음대로 바꾸거나 기존 의도 자체를 잃어버리기도 해요. 화면의 목적 자체가 사라져 가는거죠. 그러다보니 중간에 설계를 포기하게 돼요.
✅ Stitch의 장점
손 스케치를 즉시 디지털 UI로 변환하는 빠른 프로토타입
생성한 UI를 실제 사용 가능한 HTML/CSS 코드로 제공
Figma와 연계되어 오브젝트 단위로 추가 편집 가능
여러 화면을 한번에 생성하여 전체 플로우 빠르게 확인 가능
⚠️ Stitch의 단점
모듈의 다양성과 창의성이 부족한 단순한 UI 결과물
세부 요소의 역할이나 목적성 등 UI의 디테일함이 부족
프롬프트를 여러 번 수정하면 초기 맥락이나 의도를 자주 잃어버림
만족스러운 결과를 얻으려면 지나치게 세부적인 프롬프트 입력 필요 (결국 추가 작업 필수)
요약
분명 강한 장점이 있지만, 단점 때문에 장점이 기능하질 못해요. 결국 Stitct라는 공간 안에서 화면을 완성하지 못한다면 개발 코드를 제공해주는 것도 의미가 없어지는 것처럼요. 아직 Stitch는 UI 디자이너가 사용하기엔 부족한 상태 같아요.
2. Readdy
Creatie AI 기능에서 분리되어 나온 UI 생성 강자
Readdy는 2024년 말, Creatie의 AI 디자인 기능에서 파생돼 전용 서비스로 출시된 챗봇형 웹사이트 생성 AI예요. 초기 Creatie는 Figma처럼 드래그 기반 디자인 툴이었지만 AI 디자인을 생성하는 "Generative UI" 기능이 함께 있었고, 이게 더 발전하면서 Readdy로 태어난 것이죠.
장점
가장 큰 장점은 설계할 UI 구성을 모두 알려준다는 거에요. 보통 AI가 자신이 헷갈리는 걸 질문하는 경우는 드물게 있어도 자신이 설계할 내용을 우리에게 일일이 보고하진 않거든요. 그런데 Readdy는 영역별로 구성할 내용을 쭉 나열시켜요. 그리고 추가로 대화를 이어갈 수 있죠. 이럼 어떤 UI가 만들어질지 미리 예측할 수 있고, 수정하고 싶거나 추가하고 싶은 부분을 즉시 반영할 수 있어요. 사용자가 AI를 더 적극적으로 컨트롤할 수 있게 되는 거죠.
아래는 반려식물 앱을 디자인해달라고 요청하면서 대화한 프롬프트에요.
아래 이미지는 위 대화(반려식물 관리 앱)로 생성한 UI에요. 여기서 또 하나의 장점은 생각지도 못한 디테일을 잡아준다는 거에요. 오히려 기획에 추가해도 훨 좋을 세부 요소들을 잡아준다거나, 예상도 못한 시각화(그래프)로 저를 놀래키기도 해요. Stitch에서 말한 모듈의 완성도가 떨어진다는 언급이 Readdy를 만나고 나서 위안받는 느낌이에요.
또 다른 Readdy의 가장 놀라운 기능은 바로 'Continue to Generate'에요. 생성한 화면의 Next Scene(다음 화면)을 설계해주는 기능으로 새롭게 프롬프트를 작성하지 않아도 기존 생성된 화면의 패턴이나 컨셉에 기반해 연속되는 화면을 설계해줘요. 덕분에 이전 화면의 의도를 명확히 이어받는 하나의 앱으로서 다음 화면을 볼 수 있어요. 사전에 이미 기획된 내용이 있더라도 대신 초안을 잡아주는 역할로 충분한거죠.
단점
생성된 UI를 프롬프트로 계속 수정해 나가다 보면, 이상하게 수정되지 않는 부분이 생긴다거나, 당연히 없어졌어야 할 기존 UI가 그대로 남아있는 오류가 나타나요. 이런 현상이 한두 번이라면 넘어갈 수 있겠지만 상당히 빈번하게 일어났어요.
그래서 새롭게 변경할 내용만 프롬프트 작성하는 게 아니라, 기존 요소를 어떻게 처리해야 하는지까지 매번 작성해야하나?를 계속 고민하게 만든다는 거죠. 결국 작업의 흐름이 끊기고 효율이 떨어지는 아쉬움이 있었어요. Readdy의 유일한 단점이자 빠른 보완이 필요한 부분이라고 생각해요.
✅ Readdy의 장점
설계할 UI 구성을 미리 보여줘서 사용자가 예측하고 컨트롤 가능
UI의 세부 디테일을 잘 챙겨주고, 모듈의 완성도가 상당히 높음
'Continue to Generate' 기능으로 생성된 화면을 기준으로 다음 화면 자동 설계 가능
⚠️ Readdy의 단점
프롬프트로 UI 수정 시 변경되지 않는 요소나 기존 UI가 남는 오류가 발생함
요약
Readdy는 UI 생성 AI 중에서 1등 점수를 받은 서비스에요, 수정 과정에서 일부 오류가 생기긴 하지만 아주 뛰어난 UI 완성도로 그런 작은 실수 정도는 눈감아주기에 충분해요.
Readdy로 만들어본 다양한 UI들3. Figma Make
Figma가 직접 만든 생성형 UI 디자인 AI
Figma Make는 2025년 6월에 Figma가 발표한 자연어 프롬프트를 입력만으로 완전한 UI를 만들어주는 생성형 AI기능이에요. 원래 Design Draft로 생성한 파일 안에서 AI Generate 기능이 있었는데 그 기능이 Make로 확대되어 출시된거죠.
장점
가장 먼저 체감된 강점은, Design Draft에서 작업한 프레임을 그대로 복사해 Make에 붙여넣을 수 있다는 점이에요. 단순히 이미지를 넣는 게 아니라, 컴포넌트 구조나 Auto Layout, 스타일 토큰 등 Figma 내에서 정의된 구조와 규칙이 살아있는 채로 전달되기 때문에 AI가 정확하게 컨텍스트를 이해하고 수행할 작업에 반영할 수 있는거죠. 첨부한 Frame을 다듬는다거나 연결된 화면을 그려달라는 요청은 프롬프트 질(수준)에 따라 달라지겠지만, 레퍼런스를 참고하는 용도로는 단순 이미지를 삽입하는 것보다 훨씬 정확하게 전달될 수 있어요.
보통 UI를 수정하려고 하면 AI에게 수정 내용을 세세히 말해줘야 하잖아요. px 단위의 내용을 직접 언급한다거나 이 문구를 이걸로 바꿔줘라고 친절히 알려줘야하는 번거로움이 있죠. AI가 완전히 알아들을거라는 보장도 없구요. 하지만 Figma Make는 Point to edit라는 걸 제공해요. 원하는 부분을 개별 선택해 그 부분만 즉시 수정이 가능하도록 한거죠. 글자 크기나 폰트를 고치는 것은 물론 선택된 부분만 AI에게 재요청할 수 있는 입력창도 제공해요.
UI만 그려주는 데서 그치지 않고, 실제 개발에 활용 가능한 수준의 완성도 높은 코드까지 함께 제공해요. HTML/CSS 수준을 넘어서 React 기반 컴포넌트 단위로도 코드가 정리되어 나오고, 인터랙션이 포함된 구조로 생성돼 프로토타입 시연이나 프로덕트를 테스트를 진행할 때 굉장히 유용할 수 있는거죠. Publish를 눌러 배포하고 공유할 수도 있으니 다른 생성형 AI 툴에서는 보기 어려운 완성도 높은 기능이에요.
단점
Figma Make의 UI는 구조적으로 아주 정돈되고 정형화되어 있고 정렬, 여백, 위계 모두 잘 잡혀 있음과 동시에 컴포넌트 사용 방식도 굉장히 일관적이에요. 그런데 이상하게 이 UI를 쓰려고 하면 손이 잘 안 가요. 모두 다른 프롬프트로 만든 화면인데도 색감, 톤, 정보 밀도, 여백까지 거의 비슷해서, 목적이 다른 여러 화면이 모두 같은 ‘톤’으로 찍혀 나오는 느낌이 들거든요.
이게 단순히 텍스트 밀도나 색상 같은 ‘표면적’ 문제라기보다는, Figma Make가 만들어내는 UI의 ‘균일한 미감’과 한계가 동시에 드러나는 것 같아요.
콘텐츠가 많든 적든 항상 꽉 찬 박스형 레이아웃
시각적 여유 없이 구조를 우선시하는 텍스트 밀집
대부분 강조하거나, 대부분 강조하지 않아 모든 요소가 시각적으로 비슷한 긴장감을 유지
결과적으로 화면마다 기능은 다르고 목적도 다르지만, 분위기는 거의 비슷해요. 마치 '정답 같은 UI'로 덮여 있는거죠.
Figma Make로 만들어본 다양한 UI들또 다른 아쉬운 점은 다중 화면을 한 번에 생성해주는 기능이 없다는 거예요. 화면이 여러개 필요하면 그 수만큼 프롬프트를 따로 입력하거나 Make 파일 자체를 여러개 만들어야 하는 거죠. 특히 화면 하나 생성하는데 평균 1분에서 최대 3분까지, 상당한 시간이 걸리는데 이걸 여러번 시도한다는 건 쉽지 않은 일이에요 (Readdy나 Stitch는 1분 미만으로 생성 완료함). 다중 화면 지원은 Readdy 역시 지원하지 않지만, 애초에 생성 시간이 짧고 'Continue to Cenerate'라는 강력한 기능이 있기 때문에 전혀 문제가 되질 않아요.
그래서 Figma Make에게 요청할 때는 상당히 심사숙고해서 후회없는 프롬프트를 전달해야해요. 그렇지 않으면 '아! 이렇게 요청할 걸, 또 시간 걸리겠네...'와 같은 후회가 수도없이 남거든요.
✅ Figma Make의 장점
실제 작업한 Frame 단위로 레퍼런스 첨부 가능
'Point to edit' 기능으로 원하는 부분을 선택해 즉시 수정 및 재요청 가능
HTML/CSS를 넘어 React 컴포넌트 기반의 완성도 높은 코드 제공
⚠️ Figma Make의 단점
결과물의 미적 감각이 균일해 창의성이 부족하고 개성이 뚜렷하지 않음
다중 화면 동시 생성이 불가능, 생성 시간이 길어 비효율적
요약
Figma Make는 ‘이상적으로 정돈된 화면’을 그리는 데는 강하지만, 사용자 목적이나 브랜드 감성에 따라 UI를 변주해주는 능력은 제한적이에요. 확실히 한국에서 쓰이는 UI는 아니라서 실제 업무에 활용할지는 아직 미지수네요.
글을 읽으면서 어떠셨나요? 조금 더 편리하게 사용할 수 있겠다고 느낀 AI가 있었나요?
좋았던 점도, 아쉬웠던 점도 있겠지만, 공통적으로 제가 느끼는건 AI가 그려주는 화면은 ‘완성본’이 아니라 ‘출발점’일 뿐이지 당연히 AI에게 모든 걸 맡길 순 없어요. 결국 경험의 최종 완성은 디자이너의 손에서 결정되니까요. 하지만 우리의 시간 일부를 줄여주거나 많은 영감적 도움을 주는건 확실하니 얼마나 AI 툴들의 특성을 잘 이해하고 사용하는지에 따라 그 활용의 수준이나 우리의 역량이 결정나겠네요.
좋은 프롬프트 쓰는 방법이 궁금하다면?