AI로 우리 아이만의 영어 단어 게임 만들기: Gemini와 함께하는 코딩 놀이

"엄마, 아빠, 영어 단어 외우기 너무 싫어요!"

혹시 자녀에게 이런 말을 들어보신 적 없으신가요? 아무리 좋은 단어장과 앱이 있어도, 아이들의 마음을 사로잡기란 쉽지 않습니다. 빽빽한 단어 목록은 아이들에게 공부가 아닌 '숙제'로 다가오기 마련이죠.

만약 우리 아이가 직접, 자신이 원하는 단어로, 세상에 단 하나뿐인 영어 단어 게임을 만들 수 있다면 어떨까요? 코딩을 전혀 몰라도 괜찮습니다. 우리에겐 강력하고 친절한 친구, AI가 있으니까요.

오늘은 Google의 AI, Gemini를 활용해 단 몇 분 만에 아이 맞춤형 영어 단어 게임을 만드는 놀라운 방법을 소개해 드릴게요. 이 과정은 단순한 영어 공부를 넘어, 아이들이 AI와 친해지고, 스스로 학습법을 설계하는 멋진 경험을 선물할 겁니다.

무엇이 특별할까요? 🤔

완벽한 개인화

아이가 평소에 어려워하는 단어, 교과서에 나온 단어, 좋아하는 영화에 나온 단어 등 원하는 단어만 쏙쏙 골라 게임을 만들 수 있어요. 더 이상 불필요한 단어까지 외울 필요가 없죠.

자기주도 학습의 시작

"어떤 단어를 외워볼까?" 고민하고, "이 게임으로 공부해야지!" 계획하는 과정 자체가 훌륭한 자기주도 학습입니다. 아이는 스스로 문제점을 찾고(어려운 단어), 해결책을 만드는(게임 제작) 경험을 통해 학습의 주인이 됩니다.

AI는 내 친구!

AI가 단순히 정답을 알려주는 존재가 아니라, 내가 원하는 것을 만들어주는 '창작 도구'가 되는 것을 보며 아이들은 AI에 대한 긍정적이고 생산적인 인식을 갖게 됩니다. 코딩의 원리를 자연스럽게 체득하는 것은 덤이고요!

마법의 주문: AI에게 게임 제작을 요청하는 '프롬프트'

이제 본격적으로 게임을 만들어 볼까요? 우리는 AI에게 아주 구체적인 '요청서'를 보낼 겁니다. 이것을 프롬프트(Prompt)라고 불러요. 아래 상자 안의 내용을 그대로 복사해서 사용하시면 됩니다.

[AI에게 보낼 요청서]
목표: 아래에 제공된 영어 단어 목록을 기반으로, 5가지 학습 모드를 갖춘 HTML 영어 단어 암기 게임을 제작합니다. AI는 각 단어의 뜻과 예문을 자동으로 생성해야 합니다.

1. 단어 목록
[여기에 암기하고 싶은 영어 단어를 자유롭게 입력하세요]
단어는 쉼표(,), 줄바꿈(엔터) 등으로 구분할 수 있습니다.
예시:
apple, book, chair
desk, student
teacher, computer, window, flower, water

2. AI 수행 작업
- 위에 제공된 단어 목록에서 쉼표(,)나 줄바꿈으로 구분된 모든 개별 단어를 추출합니다.
- 추출된 각 영어 단어에 대해 ①한글 뜻, ②영어 예문, ③예문 한글 번역을 자동으로 생성하여 게임 데이터를 구성합니다.
- 생성된 데이터를 사용하여, 아래 3번과 4번 항목의 모든 요구사항이 포함된 HTML 게임을 단일 파일로 제작합니다.

3. 필수 게임 모드 (5가지)
- 플래시 카드: 앞면에 영어 단어, 뒷면에 뜻/예문을 표시하고 클릭 시 뒤집히는 기능.
- 4지선다 퀴즈: 한글 뜻을 보고 정답 영어 단어를 고르는 기능.
- 영단어 타자 게임: 떨어지는 영어 단어를 입력하는 게임.
- 한글 뜻 타자 게임: 떨어지는 한글 뜻을 보고 해당하는 영어 단어를 입력하는 게임.
- 문장 완성 게임: 예문 속 빈칸에 알맞은 단어를 채우는 기능.

4. 핵심 요구사항
- UI/UX: 전체적인 디자인은 깔끔하고 현대적이어야 하며, 모바일에서도 깨지지 않는 반응형 레이아웃으로 제작합니다.
- 타자 게임 규칙:
  - 목숨: 총 3개의 목숨을 가지며, 단어를 놓치면 1개씩 감소합니다.
  - 중복 처리: 화면에 같은 단어가 여러 개 있을 경우, 한 번만 입력하면 모두 사라져야 합니다.
  - 편의성: '시작' 버튼은 텍스트 입력창 바로 옆에 위치해야 합니다.
- 설명: 각 게임 모드에는 간단한 플레이 방법 안내 문구를 포함합니다.
- 기술: HTML, Tailwind CSS, 순수 JavaScript만을 사용하여 단일 파일로 제작합니다.

딱 3단계! 게임 만들기, 정말 쉬워요!

1

우리 아이만의 단어 목록 준비하기

먼저 아이와 함께 외우고 싶은 단어 목록을 만들어 보세요. 위 프롬프트의 [여기에 암기하고 싶은 영어 단어를 자유롭게 입력하세요] 부분에 넣어주기만 하면 됩니다.
예를 들어, 아이가 '우주'에 관심이 많다면 이렇게 시작할 수 있겠죠?
space, planet, star, rocket, astronaut
2

Gemini에게 요청하기

이제 Gemini와 대화창을 열고, 위에서 준비한 '요청서(프롬프트)'와 '단어 목록'을 합쳐서 그대로 붙여넣어 보세요. 그리고 엔터 키를 누르면...
3

게임 탄생!

놀랍게도 Gemini가 요청서의 내용을 완벽하게 이해하고, 잠시 후 모든 기능이 포함된 HTML 코드 전체를 뚝딱 만들어 줄 겁니다. 이제 이 코드를 파일로 저장하거나, 온라인 코드 편집기 같은 곳에 붙여넣기만 하면 세상에 하나뿐인 우리 아이만의 영어 단어 게임이 완성됩니다!

게임 안에는 플래시 카드, 4지선다 퀴즈, 신나는 타자 게임 등 5가지 모드가 모두 들어있어 지루할 틈이 없죠. AI가 자동으로 생성해 준 예문과 뜻으로 더 깊이 있는 학습도 가능하고요.

Gemini 게임 실행 방법 (1~10)

1. Gemini 페이지에서 'Canvas' 선택하기: Gemini 대화창 하단의 '+' 또는 'Tools' 버튼을 눌러 'Canvas'를 선택하여 코드를 작성할 수 있는 환경을 엽니다.

2. 프롬프트 붙여넣기: 복사한 'AI에게 보낼 요청서'를 Gemini 입력창에 붙여넣고, [여기에...] 부분에 원하는 영어 단어를 입력합니다.

3. 게임 생성 및 시작: Gemini가 코드를 생성하면 오른쪽에 게임 화면이 나타납니다. 원하는 단어를 입력하고 '게임 생성 및 시작하기' 버튼을 누릅니다.

4. 플래시 카드 모드: 카드를 클릭하면 단어의 뜻과 예문을 확인할 수 있습니다. 좌우 버튼으로 다른 단어로 넘어갈 수 있습니다.

5. 4지선다 퀴즈 모드: 제시된 한글 뜻에 맞는 영어 단어를 4개의 보기 중에서 선택하는 퀴즈입니다.

6. 영단어 타자 게임 모드: 하늘에서 떨어지는 영어 단어를 사라지기 전에 입력하는 타자 게임입니다.

7. 문장 완성 게임 모드: 예문 속 빈칸에 알맞은 단어를 직접 입력하여 문장을 완성하는 게임입니다.

8. 한글 뜻 타자 게임 모드: 하늘에서 떨어지는 한글 뜻을 보고, 해당하는 영어 단어를 입력하는 타자 게임입니다.

9. 게임 모드 전환하기: 상단의 버튼들을 클릭하여 언제든지 원하는 학습 모드로 자유롭게 변경할 수 있습니다.
10. HTML 파일로 저장하여 실행하기: Gemini가 생성한 코드를 복사하여 메모장과 같은 텍스트 편집기에 붙여넣습니다. 파일을 저장할 때 '파일명.html' 형식으로 저장한 후, 해당 파일을 웹 브라우저로 열면 언제든지 게임을 즐길 수 있습니다.