2026년 1월 10일 토요일

6살 딸아이를 위해 직접 만든 '쑥쑥 한글 퀴즈' 개발기 🍎🦁


안녕하세요! 오늘은 6살 된 딸아이의 한글 공부를 위해 직접 개발한 '쑥쑥 한글 퀴즈' 프로젝트를 소개하려고 합니다. 시중에 많은 학습 앱이 있지만, 우리 아이의 수준에 딱 맞고 부모가 직접 콘텐츠를 관리할 수 있는 도구를 만들어주고 싶어 시작하게 되었습니다.

1. 왜 시작했나요? (Motivation)

아이가 한글에 관심을 가지기 시작하면서 단어 카드를 활용해 공부하곤 했습니다. 하지만 금방 지루해하는 모습을 보고, "아이들이 좋아하는 게임 요소와 보상을 결합하면 어떨까?" 하는 생각이 들었습니다.

단순한 암기가 아닌, 시각(이모지), 청각(TTS), 촉각(글씨 쓰기)을 모두 활용하는 인터랙티브한 환경을 목표로 했습니다.

2. '쑥쑥 한글 퀴즈'의 주요 기능

이 게임은 단순한 퀴즈를 넘어 아이의 성장 단계에 맞춘 다양한 기능을 포함하고 있습니다.

  • 다양한 학습 모드:

    • 알쏭달쏭 퀴즈: 그림을 보고 단어를 맞히는 기초 모드

    • ✏️ 글자 쓰기: 캔버스 API를 활용해 직접 글씨를 써보는 연습(이 부분은 일부 오류가 존재 합니다.)

    • 🎤 따라 말하기: 음성 인식을 통해 단어를 정확히 발음해보는 훈련

  • 강력한 보상 시스템 (Gamification):

    • 문제를 맞힐 때마다 칭찬 스티커를 획득하고, 스티커함에 수집할 수 있습니다.

    • 스티커 10개를 모으면 부모님이 미리 설정한 '현실 보상 쿠폰(예: 아이스크림)'이 나타나 동기부여를 극대화합니다.

  • 펫 성장 시스템:

    • 학습 성취도에 따라 펫 캐릭터가 알에서부터 영웅까지 진화합니다.

  • 부모님 전용 메뉴:

    • 우리 가족만의 퀴즈 만들기 (가족 사진 활용 가능)

    • 학습 리포트 확인 및 난이도 조절

3. 개발 기술 포인트 (Technical Highlights)

이번 프로젝트는 Google Antigravity 환경에서 웹 표준 기술(HTML, CSS, JS)을 활용해 제작되었습니다. 특히 유지보수를 위해 몇 가지 원칙을 지켰습니다.

🛠 모듈화된 데이터 관리 (word_data.js)

누리과정 기반의 300개 단어를 수준별(Level 1~3)로 분류하여 관리합니다. 아이의 실력이 늘어감에 따라 자동으로 난이도가 조절되도록 설계했습니다.

🎨 인터랙티브 UI/UX (style.css)

아이들의 눈높이에 맞춰 파스텔 톤의 테마를 적용했습니다. 특히 중력 효과를 활용해 단어 이모지가 아래로 떨어지는 애니메이션은 아이의 집중력을 높여주는 핵심 요소입니다.

🧠 스마트한 학습 로직 (script.js)

  • TTS (Text-to-Speech): Web Speech API를 사용하여 모든 안내를 음성으로 제공합니다.

  • 오답 우선 노출: 아이가 틀린 단어는 LocalStorage에 저장되어 복습 모드에서 더 자주 등장하도록 구현했습니다.

마무리하며

직접 코딩을 통해 아이에게 필요한 선물을 줄 수 있다는 것은 개발자로서 큰 기쁨입니다. 이 프로젝트의 소스코드는 모듈화와 재사용성을 고려해 작성되었으며, 앞으로 더 많은 단어와 재미있는 테마를 추가할 계획입니다.

혹시 비슷한 고민을 하는 부모 개발자분들이 계신다면, 여러분도 아이만을 위한 특별한 '놀이터'를 만들어보시는 건 어떨까요?

혹시나 궁금 하신 분들을 위해 압축파일 링크 공유 합니다. WordCard

최근 AI를 이용한 개발에 RULES.md로 코딩 규칙을 정하고 readme.md 파일을 생성 해둔 이후 코드 작성을 진행 하는 테스트를 진행하고 있습니다. 해당파일들도 포함되어 있습니다.

파일내 전문가는 AI에 역활을 주어 결론을 도출 하는 형식으로 사용 했습니다.

프로젝트 진행은 개인의 스터디를 위해 개발 되는 부분들이 있음을 양해 해주시기 바랍니다.


저작권 및 이용 안내 (License)

본 프로젝트의 소스 코드와 자산은 아래의 라이선스 정책을 따릅니다.

CC BY-NC-ND 4.0 (저작자표시-비영리-변경금지)

실행 허용: 코드 수정 없이 원본 상태로 실행 및 학습 목적으로 사용하는 것만 허용됩니다.

비영리: 상업적 목적으로 이용할 수 없습니다.

변경 금지: 코드를 수정하거나 이를 기반으로 한 2차 저작물 제작이 금지됩니다.

* 본 프로젝트의 공유는 AI를 이용한 코딩 방법에대한 공유와 피드백을 위해 공유 합니다.

#한글공부 #6세교육 #육아코딩 #한글게임 #웹개발 #Javascript #ParentingTech #딸바보개발자 #홈스쿨링 #한글놀이 #쑥쑥한글퀴즈 #GoogleAntigravity


[AI로 생성한 프로젝트의 인포그래픽]




댓글 없음:

댓글 쓰기

🤖 리틀 로직 봇(Little Logic Bot) 개발 여정기

  "아빠가 설계하고 딸이 완성하는 로직 퍼즐" 만 4~6세 아이들을 위한 초기 코딩 교육용 웹 게임 개발 프로젝트 📌 프로젝트 개요 탄생 배경 이 프로젝트는 펌웨어 엔지니어인 아빠가 딸을 위해 시작한 교육용 게임입니다. 복잡한 텍...