Endless
Moji

Html, Css, Javascript, Jquery, UX Design

Endless Moji is an interactive educational experience, which is meant to teach users the first 5 letters of the Japanese alphabet using a web coded game. The game itself is quick and easy to play, and with enough repetition the letters can be learned!

Full Project

Introduction

This assignment as a whole is meant to educate, and teach users through an interactive game experience. Initially this project began by planning what kind of experience could be made, but quickly became a tool to help others and mentor people in Japanese.


How might I create an interactive game using JavaScript, and web coding to give users a unique and worthwhile experience.

Tools & Programs Used

Ideation

This project began with exploring my passions and trying to find some kind of purpose for the creation. Exploring different text based games but felt they lacked substance. Finding ways in which I could teach my friends and peers something interesting, and by reframing my challenge, it became the idea of teaching part of a new language in small bite-sized games.

Planning

Starting by sketching and thinking through a variety of different mini-games people could play, that would both be educational and fun. Also drafting some of the initial menu interactions and wanting it to reflect the Japanese flag's red circle design aesthetic.

Hand drawn project sketches that show Japanese characters and ideas of how to make the game.

Design

When creating a design and layout for the game, and wanting it to feel dynamic and intuative to use, rounded and relatively saturated colours felt the most apporpriate. Also fitting the Japanese theme, a soft red and an off-white seemed like the most appropriate colours to use. As for the type, Muli and Ovo were paired to create a dramatic difference between title and body, while Noto-CJK was used for its simple and clean Japanese letter forms.

Hand drawn project sketches that show Japanese characters and ideas of how to make the game.

Challenges

With the limited time I had to cut down on the amount of animations, user testing, and reduce the application to only teach the first 5 vowels あいうえお.That being said, I wanted the game to have replay value in that users would try again until they succeeded and even after that.

Mentorship & Coding

Coding this experince was challenge at the time as helping fellow classmates with their projects was important to me as well. Mentoring numerous peers with their code, making sure everyone else had presentable code, and that they understood Javascript at it's core. This assignment also was the start of my understanding of Jquery, being able to learn a faster and smoother way to code.


View on GitHub

Final Insights

After finishing this assignment, I was able to create a game that had an easy to understand flow and I was able to help one of my friends actually learn the letters. Now that it is finished, I feel as though having created a solid template or base would've helped if I ever wanted to expand it into new games and experiences.

Shoreline Mayhem: a 3D web experience, to teach about oceanlife and pollution.

To Top