먼저 써 보기 관찰
① 불편 하나 고르기
크게 말고, 이번 주에 실제로 겪은 한 장면.
떠오르지 않으면 하나 골라 시작해도 됩니다.
② 한 문장으로
「나는 [상황] [불편한 점]. 그래서 [바라는 것].」
학번, 연락처, 친구 이름은 적지 않습니다.
③ 첫 화면에 꼭 보일 것만
제목 1개 · 보여 줄 내용 1가지 · 버튼 1개. 로그인 · 알림 · 결제는 오늘 넣지 않습니다.
④ AI에 보낼 요청문
빈 칸은 노란 [ ] 로 남고, 채운 칸은 초록 글씨가 됩니다. 다 채웠으면 복사해서 AI 채팅에 붙여 넣으세요.
⑤ 미리보기
AI가 준 HTML 전체 코드를 붙여 넣고 「첫 화면 보기」를 누릅니다.
이 칸은 내 기기 안에서만 열립니다. 서버로 보내지 않습니다. 외부 그림이나 온라인 연결이 필요한 코드는 안 보일 수 있습니다.
⑥ 한 곳만 고치기
「더 예쁘게」보다 「이 부분을 이렇게」.
확인할 것
- 처음 보는 사람도 제목을 이해하나요?
- 가장 중요한 내용이 먼저 보이나요?
- 버튼을 눌렀을 때 의도한 일이 되나요?
같은 AI 대화에 이어서 보냅니다. 받은 뒤 ⑤에 다시 붙여 넣어 확인합니다.
막혔을 때
- 불편이 안 떠오르면 ①의 예시 하나를 눌러 그대로 시작합니다.
- AI가 코드를 안 주면 「HTML 한 파일 전체 코드로 다시 보여 줘」라고 보냅니다.
- 미리보기가 하얗게 나오면 코드 처음부터 끝까지 빠짐없이 붙였는지 봅니다.
- 시간이 모자라면 ② 한 문장과 ③ 세 칸만 보여 줘도 오늘 목표를 채운 것입니다.
- 노트북이면 코드를 메모장에 붙여
내화면.html로 저장하고 두 번 눌러 열 수 있습니다.
만든 사람의 이야기 · 2026.10.14 · 천지운