https://gemini.google.com/share/8b7bc91bb7c3

'초등학생을 위한 오늘의 위인 명언 웹앱'을 제작하기 위한 COSTAR 프롬프트

1. Context (배경)

사용자는 초등학생 자녀나 학생들을 둔 교육자 또는 학부모입니다. 아이들이 매일 아침 웹사이트에 접속하여 짧지만 깊은 울림을 주는 '오늘의 한 줄'을 읽으며 긍정적인 마음가짐으로 하루를 시작하기를 원합니다.

2. Objective (목표)

위인의 이름, 명언(원본), 그리고 초등학생 눈높이에 맞춘 쉬운 해설이 포함된 단일 파일(Single File) HTML 웹 애플리케이션을 생성합니다. 사용자가 접속할 때마다 새로운 내용을 보여주어야 하며, 시각적으로 매력적이어야 합니다.

3. Style (스타일)

• 디자인: 초등학생들이 좋아할 만한 따뜻하고 아기자기한 스타일 (둥근 모서리, 부드러운 파스텔톤 컬러 사용, 충분한 여백).

• 폰트: 구글 폰트의 'Gaegu' 또는 'Nanum Pen Script'를 사용하여 부드러운 느낌을 줍니다.

• 이미지: 별도의 외부 이미지 파일 없이 CSS 애니메이션, SVG 아이콘, 이모지만을 활용하여 생동감을 줍니다.

4. Tone (어조)

• UI 텍스트: 아이들에게 말을 건네는 듯한 친근하고 격려하는 말투 (~해요, ~있어요).

• 해설 내용: 어려운 한자어나 관용구 대신 아이들이 학교나 집에서 겪을 법한 상황(친구 관계, 숙제, 도전 등)에 빗대어 설명하는 따뜻한 어조.

5. Audience (타겟)

• 주 타겟: 8세~13세 사이의 초등학생 (가독성이 높고 이해하기 쉬운 문장 구성 필요).

• 부 타겟: 학생들에게 좋은 메시지를 매일 공유하고 싶은 교사 및 학부모.

6. Response (형식 및 요구사항)

• 기술 스택: HTML5, CSS3 (Tailwind CSS CDN 활용), Vanilla JavaScript.

• 주요 구조:

  • Header: 앱 제목(예: 🌟 오늘의 지혜 한 조각)과 따뜻한 환영 메시지.

  • Main Card: 위인 이름(배지 형태), 명언(큰 따옴표 스타일 적용), 쉬운 해석(눈에 띄는 박스 형태).

  • Interaction: '다른 위인 보기' 혹은 '오늘의 행운 명언 뽑기' 버튼 (클릭 시 페이드 효과와 함께 데이터 변경).

• 데이터:

  • 최소 10개 이상의 위인 명언 데이터를 포함할 것.

  • 위인 예시: 세종대왕, 이순신, 에디슨, 헬렌 켈러, 링컨, 마더 테레사, 안중근, 김구, 간디 등.

• 파일 제약: 모든 로직(JS), 스타일(CSS), 구조(HTML)는 하나의 .html 파일 내에 완결된 형태로 작성할 것.

7. Additional Instruction (추가 지시)

• 페이지가 로드될 때마다 무작위로 하나의 명언이 선택되어 나타나게 하세요.

• 명언이 바뀔 때 부드러운 전환 효과(Transition)를 추가하여 사용자 경험을 높여주세요.