클로드디자인 완전 정복 | 당근마켓 통째로 복제해서 앱·PPT·홍보영상·랜딩까지 원샷

✔️ Anthropic이 Claude Opus 4.7과 함께 공개한 Claude Design,
이 영상 하나로 끝냅니다.

이번 영상에서는, 한국인 모두가 UI를 외우고 있는 앱 '당근마켓'을
레이아웃 그대로 복제해서 IT용품 전문 중고거래 앱 '감귤마켓'으로 바꾸는
실험을 해봤습니다.

단순히 앱 하나 뚝딱 만드는 '딸깍 코딩' 데모가 아니라, 하나의 디자인 시스템이
어떻게 여러 산출물에 일관되게 흐르는지를 직접 증명하는 게
이번 영상의 진짜 목적입니다.

이번 영상을 끝까지 보시면 같은 브랜드 시스템 위에서
네 가지 산출물이 반자동으로 뽑히는 과정을 전부 보실 수 있습니다.

1. 실제 안드로이드 폰에 배포되는 Flutter 감귤마켓 앱
2. 투자자용 회사소개서 PPT
3. 앱 홍보 영상
4. 브랜드 랜딩페이지

Claude Design은 이 흐름을 'GUI 기반 온보딩'으로 바꿨습니다.
코드베이스·스크린샷·에셋을 폴더 통째로 던져주면 그 다음부터
모든 산출물이 같은 토큰·타이포·컴포넌트를 자동 상속합니다.

한 줄로 정리하면
"이전엔 디자인 에이전트를 내가 조립했고, 지금은 디자인팀이 이미 도착해 있다"
라고 할 수 있습니다.

Design System 생성부터
Prototype 목업 · Handoff · Flutter 빌드
Edit/Draw/Comment 세 가지 수정 인터페이스,
그리고 주간 사용량 소진 시 Claude Code로 자연스럽게 이어 가는 실전 팁까지
Claude Design의 시작부터 끝까지 이 영상 하나에 전부 담았습니다.

1인 창업자와 소규모 팀의 FDE(Forward Deployed Engineering) 시대,
기획·디자인·개발·마케팅을 한 사람이 하나의 흐름으로 굴리는 구조, 지금 바로 시작해 보세요!


📍 타임라인 (Timeline)

00:00 | 인트로 — Claude Design 공개와 감귤마켓 4종 예고
03:06 | 1. 사전 준비 — 당근 SEED 크롤링 + 앱 스크린샷 수집
06:34 | 2. Claude Design 온보딩 — Design System 생성
14:10 | 3. Prototype 목업 — 소크라테스 문답 + 당근 재현율 95%
19:45 | 4. Handoff to Claude Code — Flutter 앱 빌드 & 안드로이드 배포
24:25 | 5. 바이브 디자인 수정 사이클 시연
31:18 | 6. 회사소개서 PPT
33:51 | 7. 앱 홍보 영상 — Animation 템플릿
35:37 | 8. 랜딩 페이지
38:37 | 아웃트로 — 실무자 액션 3가지

---

🔗 관련 링크 및 참고 자료

1. Claude Design: https://claude.ai/design
2. Claude Design 공식 발표 (Anthropic): https://www.anthropic.com/news..../claude-design-anthr
3. 당근 SEED 디자인 시스템: https://seed-design.io
4. Flutter: https://flutter.dev
5. scrcpy (Android 화면 미러링): https://github.com/Genymobile/scrcpy
6. Picsew (iOS 스크롤 스크린샷 앱): App Store에서 검색
7. WWIT (국내 앱 스크린샷 레퍼런스, 무료): https://www.wwit.design
8. Mobbin (해외 앱 스크린샷 레퍼런스, 유료): https://mobbin.com


---
카카오 오픈 채팅방 [실전AI] 커뮤니티
👉 https://open.kakao.com/o/gURfTmqh

💌 비즈니스 문의 (강의・AX컨설팅・협업)
단테랩스 홈페이지 : https://dante-labs.com
이메일 : dante@dante-labs.com





#클로드디자인 #클로드코드 #ai자동화 #단테랩스