“이게 진짜 된다고?”
솔직히 처음 Google Stitch 써봤을 때 그 생각밖에 안 났어요.
프롬프트 한 줄 치니까 앱 UI가 뚝딱 나오더라고요. 모바일이든 웹이든.
근데 말이죠.
“이거 실제 개발에 쓸 수 있나?”
그게 문제였어요.
저처럼 1인 개발하시는 분들 많잖아요. 디자이너 따로 없고, Figma 배우자니 시간 아깝고, 그렇다고 UI 대충 만들자니 찝찝하고.
그래서 요즘 핫한 두 가지 AI 디자인 툴을 직접 써봤어요.
- Pencil.dev – IDE 안에서 디자인하고 바로 코드로
- Google Stitch – 프롬프트로 UI 생성하는 구글의 실험 프로젝트
2026년 1월 기준, 둘 다 써보고 1인 개발자 입장에서 뭐가 더 현실적인지 정리해봤습니다.
📊 한눈에 보는 비교
| 구분 | Google Stitch | Pencil.dev |
|---|---|---|
| 접근 방식 | 프롬프트 → UI 이미지/프로토타입 | 캔버스 디자인 → 코드 export |
| 타겟 사용자 | 기획자, 디자이너, 빠른 아이디에이션 | 개발자 (IDE 사용자) |
| 코드 export | ⚠️ 제한적 (베타) | ✅ React/Tailwind 직접 지원 |
| 학습 곡선 | 낮음 (글로 설명하면 됨) | 중간 (IDE 플러그인 설치 필요) |
| 가격 | 무료 (Google Labs) | 무료 tier + Pro 구독 |
| 현재 상태 | Beta | 정식 서비스 |
Google Stitch – “말로 하면 UI가 나온다”
이게 뭔데?
Google Stitch는 구글이 만든 AI 디자인 도구예요. stitch.withgoogle.com에서 바로 써볼 수 있어요.
핵심 기능은 심플해요:
“텍스트로 설명하면 모바일/웹 앱 UI를 생성해줌”
끝. 이게 전부예요.
1인 개발자 관점에서 좋은 점
1. 아이디에이션이 미친듯이 빨라요
“여행 앱 예약 화면 만들어줘” → 3초 뒤에 UI 나옴.
Figma 열어서 프레임 잡고, 컴포넌트 배치하고… 이런 과정이 사라져요. 생각나는 대로 말하면 됨.
2. 레퍼런스 수집할 때 꿀
“이런 느낌인데…” 하고 클라이언트한테 설명할 때 있잖아요.
Stitch로 10개 버전 뽑아서 “이 중에 어떤 방향이에요?” 하면 커뮤니케이션이 훨씬 빨라져요.
3. 디자인 센스 없어도 됨
솔직히 개발자들 디자인 감각 좀… 그렇잖아요. (저 포함)
AI가 요즘 트렌드에 맞게 예쁘게 뽑아줘요. 색 조합, 여백, 타이포그래피 다 알아서.
근데 문제가 있어요
⚠️ 코드 export가 애매해요
2026년 1월 현재 베타 상태라서, 생성된 UI를 바로 코드로 뽑는 건 제한적이에요.
이미지/프로토타입 수준이라 실제 개발에 그대로 쓰기엔 무리가 있음.
“어? 예쁘게 나왔네!” → “그래서 이거 React로 어떻게 옮기지?” → 😅
⚠️ 세밀한 컨트롤이 어려워요
“이 버튼 왼쪽으로 5px만 옮겨줘” 같은 건 안 돼요.
아이디에이션 단계에선 장점이지만, 디테일 잡을 때는 답답할 수 있어요.
Pencil.dev – “IDE에서 디자인하고 바로 코드로”
이게 뭔데?
Pencil.dev 슬로건이 **”Design on canvas. Land in code.”**예요.
직역하면 “캔버스에서 디자인하고, 코드에 착지해라” 정도?
쉽게 말하면:
“VS Code 안에서 Figma처럼 디자인하고, 그게 바로 React 코드로 나옴”
1인 개발자 관점에서 좋은 점
1. 디자인 ↔ 코드 왔다갔다가 없어요
진짜 이게 핵심이에요.
기존 플로우:
Figma에서 디자인 → 개발자 핸드오프 → CSS 노가다 → "어? 이거 간격 다른데요?" → 수정 → 반복
Pencil.dev 플로우:
IDE에서 디자인 → 끝 (이미 코드임)
1인 개발자한테 이게 왜 중요하냐면, 핸드오프라는 개념 자체가 필요 없어요. 나 혼자니까.
2. 익숙한 환경에서 바로 시작
Figma 배우는 데 며칠 걸리잖아요. 오토레이아웃, 컴포넌트, 베리언트…
Pencil.dev는 VS Code 플러그인이라 개발자 입장에서 진입장벽이 낮아요.
3. React + Tailwind 코드가 꽤 깔끔
AI 디자인 툴들 보면 코드 export 품질이 천차만별이거든요.
Pencil.dev는 시맨틱하게 나와서 바로 쓸 만해요. 물론 완벽하진 않지만, 70~80% 정도 감수하고 쓸 수 있음.
근데 문제가 있어요
⚠️ 디자인 자유도는 Figma에 못 미쳐요
복잡한 일러스트, 그래픽 작업, 애니메이션 같은 거 하려면 한계가 있어요.
심플한 앱 UI? → 충분
크리에이티브한 마케팅 사이트? → Figma 가세요
⚠️ Pro 기능 유료
무료 tier로도 쓸 만한데, 코드 export 고급 기능은 유료예요.
1인 개발자로서 월 구독료 고민될 수 있어요.
🎯 둘 다 써보고 내린 결론
이럴 때 Google Stitch
- 😀 아이디어 단계에서 빠르게 여러 버전 뽑고 싶을 때
- 😀 클라이언트 미팅 전에 레퍼런스 보여줄 거 만들 때
- 😀 디자인 센스 없는데 일단 예쁜 거 필요할 때
- 😀 코드는 직접 칠 자신 있을 때
이럴 때 Pencil.dev
- 😀 실제 프로덕트 개발할 때
- 😀 React/Tailwind 스택 쓸 때
- 😀 Figma 배우기 귀찮을 때 (솔직히 이거 큼)
- 😀 디자인 → 코드 변환 반복 노가다 싫을 때
저라면?
솔직히 말할게요.
둘 다 써요.
아이디어 단계에서 Stitch로 여러 버전 빠르게 뽑고, 방향 잡히면 Pencil.dev로 실제 개발 들어가요.
Stitch로 아이디에이션 (5분) ↓ "이 방향이다!" 결정 ↓ Pencil.dev로 실제 UI 구현 (30분~) ↓ 코드 export → 개발 시작
이렇게 하니까 예전에 Figma + 코드 변환으로 반나절 걸리던 게 1~2시간으로 줄었어요.
💡 1인 개발자를 위한 현실적인 조언
1. 완벽하게 자동화되는 건 아직 없어요
Stitch든 Pencil.dev든, AI가 만든 결과물 그대로 프로덕션에 넣기엔 부족해요.
70% 뽑아주고 30%는 직접 다듬는다 생각하세요.
근데 그 70%가 시간으로 치면 엄청난 거예요. 화이트 캔버스에서 시작하는 것보다 훨씬 빠름.
2. Figma 완전 버리진 마세요
복잡한 디자인 시스템, 프로토타입 인터랙션 같은 건 아직 Figma가 최강이에요.
저도 기본적인 건 Pencil.dev로 하고, 복잡한 거 해야할 때만 Figma 열어요.
3. 내 개발 스택 먼저 확인하세요
Pencil.dev가 React/Tailwind에 강해요.
Vue나 Svelte 쓰신다면 코드 export 후 작업량이 좀 늘어날 수 있어요.
🤔 내가 느낀 점
솔직히 처음엔 “이게 되겠어?” 싶었어요.
AI 디자인 툴이라고 하면 뭔가 애매한 이미지만 뽑는 거 아니야? 했거든요.
근데 2026년 지금 시점에서 보면, 진짜 쓸 만해졌어요.
특히 1인 개발자로서 디자인 리소스 없이 프로덕트 만들어야 할 때, 이 툴들 없었으면 디자이너 외주 맡겨야 했을 것들을 혼자 처리하고 있어요.
물론 아직 완벽하진 않아요.
Stitch는 베타라서 기능 제한이 있고, Pencil.dev도 복잡한 건 어려워요.
하지만 방향은 확실해요.
앞으로 더 좋아질 거고, 지금도 충분히 생산성 올려줄 수 있어요.
앞으로 내가 할 것들
- Stitch 베타 업데이트 체크 – 코드 export 기능 추가되면 게임체인저
- Pencil.dev Pro 체험 – 무료로 한계 느껴지면 결제 고려
- v0.dev랑도 비교해볼 예정 – Vercel 것도 요즘 핫하더라고요
❓ FAQ
Q. 디자인 완전 1도 모르는데 써도 돼요?
네, 오히려 그런 분들한테 더 좋아요. AI가 트렌디하게 뽑아주니까요. Stitch가 특히 그런 케이스에 강해요.
Q. Figma Pro 구독 중인데 갈아타야 하나요?
당장은 아니에요. 복잡한 작업은 아직 Figma가 나아요. 근데 단순한 앱 UI 정도는 이 툴들로 충분히 커버 가능해요.
Q. 실제 프로덕션에 바로 쓸 수 있어요?
Pencil.dev 코드 export는 꽤 쓸만해요. 근데 100%는 아니고 약간 수정 필요해요. Stitch는 아직 프로덕션용보다는 아이디에이션용.
Q. 둘 다 무료로 써볼 수 있나요?
Stitch는 Google Labs라 무료, Pencil.dev도 무료 tier 있어요.
Q. 다른 대안은 뭐가 있어요?
Vercel v0, Uizard, Builder.io 같은 것들도 비슷한 포지션이에요.
📚 참고 자료
🏷️ 태그: #AI디자인 #1인개발 #Pencil.dev #GoogleStitch #노코드 #개발자디자인 #사이드프로젝트