아래 가이드는 제가 작성하긴 했는데 너무 어휘력이 낮아서… ai가 다듬어 준 글입니다!

이 가이드에서는 웹 브라우저에 가상의 휴대폰을 만들어요. 사용자는 홈 화면에서 메시지나 갤러리 같은 앱을 열고, 단서를 확인하거나 답장을 고르며 이야기를 진행합니다. 아래 스타터 파일로 시작하면 앱을 열고 닫는 기본 동작부터 만들 필요 없이, 내 이야기와 화면을 붙이는 작업부터 시작할 수 있어요.

1. 첫 번째 장면을 기획하세요

처음부터 휴대폰에 들어갈 앱을 전부 정할 필요는 없어요. 사용자가 첫 화면에서 무엇을 보고, 어디를 누르고, 그 행동으로 무엇이 달라지는지부터 정해 보세요.

예를 들어 홈 화면에 부재중 전화가 떠 있고, 메시지 앱을 열면 친구가 보낸 주소가 나옵니다. 사용자가 주소를 확인하겠다고 답하면 다음 메시지가 오고, 무시하면 다른 사건이 시작되는 식이에요. 여기까지 정하면 첫 버전에 필요한 화면과 분기가 보입니다.

ChatGPT에 만들고 싶은 아이디어를 한두 문장으로 설명하고, 아래 프롬프트를 함께 보내세요. 제가 기획할 때는 GPT-6 High를 썼어요. 촘촘하게 기획할 때는 질문에 최소 300개 정도 답하는 걸 추천하고, 저는 보통 500~700개 정도 답했어요.

제가 실제로 쓴 방식은 질문을 한 번에 20개 이상, 가능하면 선택형으로 받고 전체 질문 수를 최대 900개로 제한하는 거였어요. 이 방식으로 진행하려면 아래 프롬프트에 그 조건을 덧붙이세요. 도중에 기획을 마치고 싶으면 그때까지의 답변을 텍스트 요약과 Markdown 기획서로 정리해 달라고 하면 됩니다.

복사할 프롬프트 · 기획 구체화

내가 설명하는 아이디어를 바탕으로 휴대폰 화면에서 진행되는 인터랙티브 서비스를 기획해 줘.

먼저 주제와 분위기, 등장인물, 필요한 앱, 첫 장면, 사용자의 행동과 선택지, 선택에 따른 결과를 구체화해 줘. 화면 디자인과 진행 저장 방식도 함께 다뤄 줘. 서버, 로그인, 외부 API는 기획에 필요한지부터 확인해 줘.

내가 정하지 않은 부분은 구현에 영향을 주는 것부터 질문해 줘. 질문은 주제별로 묶어서 보내고, 가능하면 선택지와 각 선택의 차이를 짧게 설명해 줘. 이미 답한 내용은 다시 묻지 말아 줘.

내가 여기까지 정리해 달라고 하면, 확정 사항과 미결 사항을 구분해 줘. 첫 버전에 넣을 화면, 앱별 역할, 사건과 대화 순서, 선택과 결과, 저장·재개 방식, 확인할 동작을 담은 Markdown 기획서와 짧은 텍스트 요약을 만들어 줘.

2. 스타터 파일로 첫 버전을 실행하세요

아래 ZIP을 내려받고 압축을 푼 뒤, 기획서와 다음 프롬프트를 코딩 에이전트에 전달하세요. 홈 화면에서 앱 하나를 열고, 첫 장면을 진행한 뒤, 홈으로 돌아올 수 있는 상태를 첫 목표로 잡으면 작업 범위가 분명해져요.

phone-story-starter.zip

에이전트를 바꿀 때는 같은 프로젝트 폴더와 기획서, 실행 방법, 남은 작업을 함께 전달하세요.

복사할 프롬프트 · 스타터 구현

첨부한 phone-story-starter.zip은 가상 휴대폰에서 진행되는 서비스를 만들기 위한 시작 틀이야. 아래 기획을 반영해서 로컬에서 실행되는 첫 버전을 만들어 줘.

[서비스 기획]
- 주제와 분위기:
- 등장인물:
- 필요한 앱과 각 앱의 역할:
- 첫 장면과 주요 사건·대화:
- 사용자가 할 수 있는 행동과 선택지:
- 선택에 따른 결과와 엔딩:
- 참고 화면 또는 자료:

[작업 순서]
1. 압축을 풀고 README.md와 AGENTS.md를 읽어 줘. 앱 등록, 화면 전환, 상태 저장, 대화 분기 구조를 확인해 줘.
2. 기존 샘플을 새 기획으로 교체해 줘. 먼저 홈 화면에서 앱을 열고 닫을 수 있게 하고, 핵심 앱 하나에서 첫 장면과 선택 결과가 이어지도록 구현해 줘.
3. 대화 데이터와 공통 기능을 분리해 줘. 앱이 늘어나면 앱별로 모듈을 나누고, 진행 저장·재개와 다시 시작이 동작하도록 해 줘.

[구현 원칙]
- 휴대폰을 직접 쓰는 느낌을 유지하고, 기획에 필요한 앱과 기능만 만들어 줘.
- 화면에 설명, 힌트, 진행률을 임의로 넣거나 등장인물 설정과 결말을 바꾸지 말아 줘.
- 확정된 내용부터 구현하고, 작업을 막는 정보가 있을 때만 질문해 줘.
- 실존 인물이나 단체가 소재라면 가상의 창작물임을 표시해 줘.
- 외부 서버, 로그인, AI API, 통계, 유료 서비스는 별도 요청이 있을 때만 추가해 줘. 비밀번호나 API 키를 코드에 넣지 말고 배포는 하지 말아 줘.

[완료 전 확인]
앱 열기·닫기, 구현한 모든 선택지와 결과, 새로고침 후 진행 재개, 다시 시작, 모바일 화면을 확인해 줘.
완료하면 실행 방법, 변경 내용, 확인한 동작, 남은 작업을 알려 줘.

3. 앱 화면을 하나씩 완성하세요