Kanji Challenge

Project Overview

Challenge: Create a Bingo game that helps users learn Japanese characters.

Role: Interaction Designer, Visual Deisgner

Duration: 6 Weeks

Technology: Figma

Summary

Interest in leaning Japanese is at an all time high with many enrolling in language classes and picking up self study materials. However, Japanese character often overwhelm learners into dropping their studies. Most language apps only offer memorization and character stroke drawing features to allow for users to master these characters. Users are disengaged using these apps and usually drop learning the language all together. I created a bingo inspired Japanese character learning app that allows for users to engage in competitive game play to engage learners in consistent studying.

Problem

Japanese is one of the most challenging languages to learn for English speakers with over 500,000 words, three different levels of speech, and pitch accent. However, the area that language learners most likely give up trying to learn Japanese characters. Japanese contains over 4,000 different characters that a person must learn to gain proficiency. That includes three different alphabets: Hiragana, 48 phonetic characters, Katakana, 48 phonetic characters, and Kanji, over 4,000 logosyllabic characters. Learners can feel extremely overwhelmed and unmotivated by the scope of what they need to learn. Japanese language learners need a resource that allows to learn Japanese characters and to encourage consistent study. A constraint that I was given developing this project was to incorporate the game bingo into the design in some way.

How might we create a resource that incorporates bingo to help Japanese language learners be consistent and motivated to learn Japanese characters?

Research

The current most popular method for Japanese character learning is dividing them into groups based on the different alphabets and levels provided by the Japanese Language Proficiency Test (JLPT). Currently, the JLPT is divided into different levels with N5 being the easiest and N1 being the most difficult. In these exams, each level has a different amounts of characters that are needed to pass each exam. For example, N5 includes Hiragana, Katakana, and around 100 Kanji, while the N1 level requires around 2,000 kanji. Each level requires a larger number of Kanji with a higher degree of difficulty. Conducting a competitive analysis on the most popular Japanese character learning apps, they mostly contain repetition note cards for sounds and definitions and stroke order practice for drawing out characters. They rarely contained mini games or interactions with other users. This lead me down a rabbit hole into the world of a prominent figure within the language learning space: Duolingo. Duolingo incorporates a leader board that drops the lowest points earning players and promotes the top players into a different rank. Additionally, players will loose their ranking if they do not engage and earn points for that week. This motivates players to stay consistent and dedicated to their language learning. This system is so engaging that it has encourage people to go on social media to personally challenge the person currently at the top of the leader board. Looking further into ranking systems brought me to the current ranking system incorporated into League of Legends. Rather than just having an achievement based system for completing a level, it was instead focused on the overall success of each game. Based on the ranking system in chess, users will gain or loose points that are attributed to their rank. Applying this method that causes engagement with rank climbing and the non-active rank demotion currently incorporated in Duolingo, players will be motivated to consistently play games to maintain their current rank. Thus, this sparked the creation of Kanji Challenge’s duo achievement system of badges and rankings.

User Task Flow

Users will sign into the app, with the option to review rules or go forward into the levels screen. From there, they can select their desired character level and read the description. Then, they will enter in a game against a player or NPC to be the first to answer four character definitions in a row, column or across. Answering each character definition correctly gives them points ranging from 1 to 5 each based on the number of times that they have answered that character in previous games. For example, a character that the player has never answered before will give give them 5 points in the game, but one that they have already answered 5 times will only give them 1 point. A player will get three tries in their turn to answer correctly the character that they selected and cannot change characters once they have clicked on it. This is to encourage players to take risks in trying to answer new characters, while strategizing on how to be the first to get four across. At the end of each game, the winner will gain 20 points, while the loser loses 20 points from their total. So it is necessary for a user to gain as many points within the game to minimize the amount of points they might lose and avoid the risk of going down a rank. By being inactive for a month, a player automatically drops a rank as well. To achieve each ranking, a user must gain a set amount of points as shown in the example above. Through the points system, users will be encouraged to revisit earlier levels to gain points lost on harder material. Each game level will be based on the difficulty of the characters levels established by the Japanese Proficiency Test and increase in the number of characters per level. By answering a character five times correctly, the character gets added to the users’ Kanji learned stat, which will eventually earn them a badge for each level completed. In between games, the user can review characters and definitions by looking at flash cards for each level.

Sketch and Wireframes

When developing my initial sketch, I thought of the user flow and the information that the user would need to consume. For example, the user would need a way to view their current stats and stay motivated while being able to easily navigate to the game play. Therefore, I included the player stats not only on the badge page, but on the level, play screen, competitor match up page, game results page, and the rank page at the end of a game. I wanted to remind the user of the current stakes and motivations to the game to motivate them to push forward. A key addition moving on from the initial sketch to the Lo-Fi wireframe was ensuring that there was a visual way to indicate to the user that they gained extra points from answering before the one minute time limit. I experimented with the original five by five grid in the original bingo game to try to stay true to the original bingo roots and ensure that the traditional winning strategy of going across was still secured. I experimented with the question screen being a pop-up to ensure that a player still had enough of the game board screen showing to ensure that they knew that they were still in the game.

Sketch

Lo-Fi Wireframes

Design System

When creating a design system, it was critical to ensure that I incorporated that would support both the Latin alphabet and Japanese characters. My search for the perfect fonts, I searched through multiple websites and tested out countless fonts until I settled on Rampart One for more branding and headings and Murecho for the rest of the typography. The aesthetic of the font was inspired by Japanese pop art artists Tadanori Yokoo and Hirohiko Araki. Analyzing other Japanese character apps, I noticed that many of them had a limited color palette. I wanted to try to incorporate a more dynamic color palette into my work and allow for the viewers to be more visually engaged. At this stage, I also developed my Hi-Fi Wireframe and included an option at the end of a game to review all of the characters used within that round to help users review and study new material. The question page changed from a pop-up to an individual page to maintain more consistency between the different stages of the game.

Hi-Fi Wireframe

Prototype

Before crafting the prototype, I received some feedback about the explanation, or lack there of, of rules before entering into a game. So I added an option for the user to have the rules explained in an on boarding process. That way all of the information was displayed in digestible little chunks and add visuals to engage the user into the rules. Additionally, I removed the players current points within their game screen because this information is already being described through their rank. Additionally, I adjusted the board screen to allow for more space and emphasis on the players.

Deliverables & Reflection