Audio interactive game for kids around letters and numbers learning
Description
Toddlers are attracted to computers, they want to play with it, press the keyboard all the time when their parents use it - pretty much for everything. I was browsing the web for games designed to help kids learn their letters and ABC when I decided to take the opportunity to build a simple game allowing the child to discover the letters, while taking an active role in building the game it self.Here is the concept:
The game displays a letter and at the same time plays an audio relating to the letter.
If the player presses the right key at the first attempt, a congratulation sound is played and lots of progress is made. If the right letter / character is found after several attempts, less progress is made, no congrats sound is played.
The child or the parents can record every sound matching the letters as well as the congrats messages. I got my daughter to record a short voice memo to match each letter and number, as well as congratulation messages that are played if the right letter is found at the first attempt.
Once the set is completed (5 letters or more), a rhyme is played in relation to the latest letter found.
Here, we used a set of rhymes amongst the numerous ABC rhymes we had gathered and that were hidden in the computer and never played. This is a way for the child to re discover them in a fun fashion.
We performed the recordings using a phone and the default voice memo app, and creating one short sound file for each letter and number.
Here is what a set looks and sounds like :
Download the game (zip package)
The package comes with a full set of sounds, that are all ... in french... . However, it will be simple to replace them all using your own.
How to play:
- Un-zip the file on your computer
- Open the file letter game_4.html in your browser, and play
How to customise the game using your own audio files :
- drop the files into the "sounds" folder
- edit the file script_lists_lettergame_4.js using a text editor.
It is a rough way of doing things, but quite simple.
Zip file includes :
- lettergame_4.html - the actual game
- style.css - the associated style sheet
- script_lists_lettergame_4.js - file to edit to add or replace the sound files to play for each letter
- sounds (folder) - where all the sound files are stored
Javascript code, css and hash tables
For enthusiasts, and to keep the same approach used throughout the blog, below is the code used for the game.Apologies to you if the code is not perfectly commented. I know it would require some tidy up to look pretty for others to use or tweak, but time is scarce.
hello
ReplyDelete