https://gemini.google.com/share/69f477d610cf

퀴즈네르 수막대 구구단 시뮬레이터 제작 COSTAR 프롬프트

1. Context (배경)

초등학교 3학년 학생들이 구구단의 원리를 시각적으로 이해할 수 있는 교육용 웹앱을 개발 중입니다. 이 앱은 벨기에의 교사 '조르주 퀴즈네르'가 개발한 수막대(Cuisenaire Rods) 모델을 기반으로 합니다. 단순 암기가 아닌, 수의 길이를 통해 곱셈의 원리를 깨닫게 하는 것이 목적입니다.

2. Objective (목표)

2단부터 9단까지의 구구단을 시뮬레이션할 수 있는 React 기반 단일 페이지 애플리케이션을 제작하세요. 사용자가 단(2~9)과 곱하는 수(1~9)를 선택하면, 수막대 애니메이션을 통해 계산 과정을 시각적으로 보여줘야 합니다.

3. Style (스타일)

• 디자인: 파스텔톤의 부드러운 색상, 둥근 모서리(Rounded), 깔끔한 타이포그래피를 사용하여 아이들에게 친숙하고 현대적인 UI를 제공하세요.

• 언어: 초등학교 3학년 수준의 친절하고 쉬운 한국어를 사용하세요. (예: "똑 떼어내면 끝!", "상상해봐요")

4. Tone (어조)

• 격려하고 응원하는 교육적인 어조.

• 수식 위주의 딱딱한 설명보다는 원리를 풀어서 설명하는 다정한 선생님 같은 느낌.

5. Audience (청중)

• 주 타겟: 구구단을 처음 배우거나 원리 이해가 필요한 초등학교 3학년 학생.

• 부 타겟: 아이들에게 수학적 개념을 시각적으로 가르치고 싶은 학부모 및 교사.

6. Response (핵심 요구사항 및 제약사항)

• 전략의 이원화 (필수):

  • 2~6단 (누적 전략): 짧은 수막대를 위로 차곡차곡 쌓아가는 '덧셈의 반복' 연출.

  • 7~9단 (보수 전략): 10개짜리 수막대 틀에서 부족한 만큼(10-n)을 잘라내는 '뺄셈' 연출.

• 창시자 강조: 조르주 퀴즈네르(Georges Cuisenaire)와 그의 수막대 교육 철학을 하단 가이드에 명시하세요.

• 기술 스택: React, Tailwind CSS, Lucide-React 아이콘 사용. 모든 코드는 단일 파일로 작성하세요.

• 수식 사용 제한: $10 \times n$과 같은 추상적인 변수 기호 대신 "10개씩 3개"와 같이 구체적인 한글 표현을 사용하세요.