Trains and Morse Code - Game Design

I led a team that conducted design research to identify Ben’s needs for a game to learn morse code while meeting his other learning goals and interests.

Ben was our 9 year old child expert at the Morse Code Game Jam in New York City. 

The game we built can be expanded to multiple game levels using all alphabet letters and tailored to a specific child’s favorite videos.

My talented teammates were Sandy Hsieh, Hau Yuan, Keerthana Pareddy, and Mithru Vigneshwara. We represented NYU’s ITP graduate program.

Role: Leadership, ideation, concept development, user testing, coding.


Tools: Game made with HTML, CSS, Javascript, node server, Illustrator, and AfterEffects; enclosure made with laser cutter and cardboard.


Project: Part of Google’s Morse Code Game Jam hosted by Adaptive Design Association.


Timeline: 2.5 days

Ben's game on his family iPad's browser, enclosed in a case designed to help him tap each morse code button.

How It Works

We built Ben's game online in the web browser so that it's easy to access on his family's iPad anywhere he goes.

 

  • You can try the game yourself here. Be sure to turn on your sound! You’ll hear a “choo chooo” after you press Start and Ben’s mom as she narrates the game for him. 
     

  • We also built an elegant iPad case made of one piece of cardboard which folds into a closed box or open stand. You can learn how to create the iPad enclosure yourself at Sandy Hsieh’s blog.

We designed the game so that Ben could work on his goals in the context of his genetic condition called Phelan-McDermid Syndrome. Ben’s goals were to:
 

  • Try a new communication method: morse code

  • Learn how to isolate his finger

  • Strengthen his muscle tone 

  • … Watch his favorite videos : ) 

Check out the main game flow in this video below.

A short clip of the game's user flow: Start Page, Home Page, Lesson Page, and Video Page

My Role

I built a team of my classmates from NYU’s ITP masters program to participate in the Morse Code Game Jam. I led us through the major stages of the game jam to be sure we met Ben’s needs, including heading up user research.

What Problem Did We Want to Solve?

We went into the Game Jam wanting to do two things. As the top priority, we wanted to satisfy Ben’s needs, and if possible, work within the creative constraints of the game jam. 

Ben playing the game with his dad's help.

​GAME JAM CREATIVE CONSTRAINTS

The game jam's constraints were easy to identify. They were hoping we might build a physical device to connect to Hello Morse, the Android Google keyboard that can be used with physical buttons for people who have dexterity impairments that prevent them from using computer screens.

 

BEN'S GOALS

Ben's needs took more time to identify and describe. While conducting user research and user testing, we learned the following needs and came up with design solutions.

1) Watch His Favorite Videos ➡️ Game Reward

 

Need: We learned that favorite videos were a huge motivator for Ben.
 

Design Solution: We designed the game to unlock a favorite video of Ben’s after he entered the correct morse code pattern for a letter of the alphabet. This worked: Ben began to expect a video after playing, and showed great delight once the video began.

2) Isolate His Finger ➡️ Large Buttons

 

Need: Ben needed Google's keyboard Hello Morse buttons to be very large so that he could successfully isolate his finger to tap them. Unfortunately, the Hello Morse keyboard couldn't increase in size. 

Design Solution: As a solution, we hard coded our own version of Hello Morse's keyboard with buttons large enough for Ben. We were able to meet Ben’s needs while demonstrating to Google a possible new feature: adjustable sizing for their Hello Morse keyboard buttons.

3) Strengthen Muscle Tone ➡️ Tap, Not Hold the iPad

 

Need: Ben needed to focus on his goal of strengthening his hand's muscle tone to tap the screen, not hold the iPad. Holding the iPad would be a difficult task and a distraction for Ben.

Design Solution: In response, we built a cardboard enclosure to hold the iPad up for Ben, so he didn't have to.

Creative Process

Paper prototypes of the user flow to gather feedback from Ben, his family, occupational therapists, and Google developers.

​STAGE 1 – RESEARCH

  • Our team met Ben and his mom at Adaptive Design. I led Stakeholder Interviews with the two of them to learn about Ben’s interests and his learning goals. An Occupational Therapist served as a Subject Matter Expert by helping answer important questions and providing context.
       

  • I synthesized the major goals stated by Team Ben. Recording these goals allowed us to reflect on them while we designed the game. Whenever we disagreed, we could return to the goals to find clarify and shared purpose.
     

  • We researched the functionality of the Hello Morse Android Google keyboard.
     

STAGE 2 – SYNTHESIS
 

  • I ran sessions to whiteboard general ideas as a team, while always making sure any direction still met the interests and needs of Ben.
       

  • We sought out advice from additional Subject Matter Experts such as NYU ITP professors specializing in accessibility, interaction design principles, and game design.
       

  • We made two rough prototypes of our main directions. We showed these to Ben and his family, and went with the strongest option.

The iPad cardboard enclosure folded and ready to take with Ben.

STAGE 3 – DESIGN
 

  • Step by step, we coded the final game design ourselves. We built our game’s user flow with Javascript and embedded video frames to enable Ben’s interactions online in the browser on any device, and especially his family's iPad.
     

  • Teammate Hau made four beautiful individualized lessons for the letters T, E, A and M. The letters were specially chosen by Ben’s parents to match a few of Ben’s favorite things: trains, elephants, aliens and minions.
     

  • Meanwhile, Sandy prototyped and finalized an iPad case for Ben. The goal was to hold up the iPad for Ben, so that he could focus on pressing the surface itself.
     

STAGE 4 – TESTING
 

  • I ran a robust user testing plan with the Occupational Therapist to get feedback on learning and game principles, and then again with Ben and his parents to hear any thoughts on improvements.
     

  • Sandy showed the iPad case to Ben and his family to get feedback that gave us insights into how exactly to prop the case up and the size of the keyboard openings for Ben’s finger.

Team Ben: Ben and his family with classmates from ITP.

​STAGE 5 – HAND OFF
 

  • In just one weekend, Ben had a game designed just for him! 

 

  • By the end, he was using the game to unlock his favorite videos and showing great delight each time. Most important of all, Ben went on to play the game online at home.
     

  • Below is a video of him playing it at the dining room table!

What’s Next?

Ben playing his game with family at home.

  • The game can be expanded to multiple game levels using all alphabet letters and tailored to a specific child’s favorite videos.
     

  • The game is still online and working. You can play it here.
     

  • If you're interested in using this game or working on the next version, my contact info is on my About page.