Rona

AI로 모바일 앱 MVP 디자인부터 구현까지 만들기

중급452026-06-15

시장 수요 가설을 먼저 정리한 뒤, 핵심 기능 하나에 집중해 모바일 앱의 온보딩·홈·페이월·프로필 화면을 설계하고 이를 편집 가능한 UI 코드와 초기 앱 뼈대로 변환합니다. 최종 결과물은 `product-brief.md`, `design-system.md`, `screens.md`, `index.html`, `styles.css`, `app-data.js`로 구성된 모바일 앱 MVP 화면 세트 문서와 HTML/CSS 코드입니다.

이 실습은 터미널에서 진행됩니다

이런 걸 배워요

  • 시장 수요 가설을 앱 화면 설계 전에 먼저 정리할 수 있습니다.
  • 핵심 기능 하나에 집중한 모바일 앱 화면 구성을 만들 수 있습니다.
  • 하나의 디자인 언어를 온보딩·홈·페이월·프로필 화면에 일관되게 적용할 수 있습니다.
  • 디자인 설명을 편집 가능한 UI 코드로 내보낼 수 있습니다.

어떻게 진행해요

1. 작업 환경 확인
2. 수요 가설 정리
3. 디자인 언어 정의
4. 전체 화면 설계
5. UI 코드로 내보내기
6. 핵심 기능 뼈대 추가
7. 산출물 검증

AI 튜터가 각 단계를 하나씩 안내해줄 거예요

AI로 모바일 앱 MVP 디자인부터 구현까지 만들기 (중급)