_
Design a game that engages 3-5 years old child to practice spelling and learn new vocabulary. Create a fun environment to practice spelling in the native language or foreign language and build vocabulary. All elements (colors, buttons, sound effects, movements, screen transitions, awards, etc.) should be part of a seamless experience.
_
The challenge was based on creating a game for toddlers, developing a whole immersive environment to keep them playing for more than 20 minutes. Encourage learning in a motivating way through awards and due to the treatment of errors in a way that children do not fear mistakes.
_
Explore the skills and techniques required to be successful in the game design, the interactions that keep the player in the game, and the environment that the game teaches players.
Discover how a game can incorporate types of learning, to call attention to what might be overlooked as significant forms of learning, and to understand and take advantage of the opportunities that games can provide as an enjoyable learning environment.
The findings after a competitor analysis and a survey were:
– create basic, day-by-bay collections of words to spell
– it’s good to have levels of difficulty
– a character can engage in the experience
– create rewards for each correct word
– create a profile for each child to have it separately from siblings, friends
– present hints, sound, and mnemonic forms to engage in learning
– use voice over, sounds and music to create the environment and increase engagement
– use flat and intuitive design
– use high-quality graphics
– be careful with the app icon. Design something easy to be found by kids.
_
Sketch some user flows for the possible scenarios. We found the necessity of creating profiles for different users on the same device.
Another finding: how to create rewards. Each correct word spelled, the user earns coins, which can be used to unlock hints for more difficult phases. Also, give a choice of picking the difficulty of the levels and pick a language to practice.
Full User Flow:
This flow shows the entire process of the game, including all three personas: new user, returning/new device user, returning/ same device user.
Game Screen Wireframe:
This wireframe shows in details the game screen
_
DESIGN SYSTEM: Create a design system that speaks to kids. The study evolved all about characters, symbols, icons, reward system, avatars, music, voice over, character animation to create an immersive experience.
Color Palette:
Buttons Shapes & Icons:
Character:
User Avatar:
Word Collections:
_
Initial and Login screens:
Level selection and game:
Change avatar and language:
_
Start by creating a storyboard to explore each user journey, identifying what the user sees, and the user does on each step.
The refined prototype is focused on the UI, applying the findings in all phases before. Also, can be used with real customers for testing purposes.
The prototype was built using HTML5, CSS3, JS, Bootstrap, JQuery, Snap.svg. The database used to save coins and users was Firebase.
Check it out!
Is available on desktop, only.
_
The prototype is ready for development after testing and validating the features with users.
_
A full game UI with a live prototype to be tested with children. It’s possible to test, record and grab data.
Check it out!
This prototype is available for desktop, only.
_
– add words on existing collections;
– add new collections;
– add “How to play” flow;
– create mobile & vertical versions;
– add new languages;
– add avatar customizations;
– find a way to connect with friends.