Feel the Beat
Designing a rhythm training game for people who don’t consider themselves gamers or musicians.
Software: Photoshop, Illustrator, After Effects, Unity
Lumosity is a brain training app on iOS, Android, and the web. It’s a platform where players engage with over 60 different interactive mental workouts.
Goal: Add value for current subscribers by making something different than any other game in our library.
Strategy: Create a rhythm training game using a “call and response” interaction, where the player hears the music first and then they join in.
Timeline: 6 months for the web release, 3 months for mobile port.
Team: 3 individual contributors.
Discovery
We began by interviewing several cohorts of people to strategize how to approach this project.
Select a group of users to read some of the insights we discovered.
-
Our users don’t consider themselves gamers, so it was important to demonstrate real world benefits. Our users also tend to skew older, have lower technical proficiency, and some portion of our audience even has physical limitations like poor eyesight, hearing, or motor skills issues.
Based on marketing segmentation research and user interviews, we targeted a subset of our subscribers who prioritize learning new skills and exploring different activities over strict self-improvement in familiar tasks.
-
We interviewed a lot of musicians and rhythm game developers at the start of the project. We learned a few key takeaways that informed our design philosophy:
Rhythm is intuitive to learn at a basic level, but that improving that skill is very difficult.
It’s easy to make levels that are too challenging for players.
People desire to make music as part of a group.
-
Multiple scientific studies have shown that rhythm and music training can enhance attention, speech and language skills, perception and working memory, and motor skills. The corpus callosum also known as the “wiring” that connects the two hemispheres of your brain is also shaped by this type of training. In this case it seems to be related to the coordination of auditory and motor skills needed to play music.
-
Due to the small team size and high replayability of our games, this meant we would need to procedurally generate the rhythms to meet the required quantity of unique levels. The design challenge would be making the end result sound like music.
Prototype
Usability of the core gameplay mechanic was the highest priority. Once we had a usable and engaging prototype, we could shift focus onto the overall user progression and the narrative theming.
Gameplay UX
Our goal was to add value for current subscribers by making something different than any other game in our library. Users encountering repeated content increased their use of the “skip game” button in their daily workout.
UI Wireframes
For the gameplay HUD, we chose to represent the rhythm as a circle because it aligns well with the “call and response” method of learning music that plays out like a game of Simon Says.
I explored several aspects of the gameplay screen including layout, iconography, and HUD.
Player Input
After testing player input options for the web version, we decided to start players at the “F” and “J” keys of the home row, because of two factors:
The neutral hand position prevented awkward postures or hand cramping.
The keys have physical bumps on them to help users locate the keys.
Motion Design
Motion communicated many aspects of core gameplay, including the tempo of the rhythm, how accurately each drum beat was being played, and the complexity of the rhythms presented to players.
User Flows
We measured player progression based on accuracy over time, which helped distill the target metric to an easy-to-communicate goal post.
As they gain proficiency, players would ramp up in difficulty thorough mechanics like more drums to play and advanced musical concepts like syncopation.
The NUX tutorial was an essential onboarding feature given how different this game was from the existing Lumosity library.
By the end of the tutorial, players should understand that they need to use audio, know which keys to press, and be able to hear a consistent beat like a metronome.
Test
We built a functional prototype in Unity, play testing and iterating weekly on core gameplay. The most important goal at this phase is clarity of the core task. Do users know how to interact and are they getting the support they need when struggling?
Pain Points
The spinner visual was confusing. We used it as a visual helper to get users started, then made it disappear after they were successfully interacting for a bit. This confused them and they thought they were done playing.
Solution: Remove the spinner! We get the user to understand audio is required from the start and work on reinforcing the beat visually through secondary motion queues like matching animation speeds to the tempo.
Levels were too hard! Our initial plan was to start with 2 player controlled drums and ramp up to 4. However, our users tended to skew older and less musically inclined.
Solution: Start with 1 drum for player input and focus on keeping a steady tempo on the first difficulty level before introducing any variation to patterns.
Design
Before we could move forward with a visual direction, we needed to settle on a narrative theme that felt on brand and appealing to our core users.
Ideation
Once the team had settled on a few solid options, I created short animations queued up to audio to gauge the appeal with our core audience.
Key Takeaways
The themes that were more musical scored higher on clarity.
Having a retro theme resonated with specific age groups in our audience.
Humor was appealing, because it helped users to relax and approach rhythm training with less anxiety.
Mood Board
I was inspired by the MTV generation of music videos, montages, group dancing, and big hair. The 80’s dance aerobics theme appealed to the nostalgia in our demographic and workout culture fit perfectly with the aspirational tone of self-improvement in brain training.
Sketches
Sketches applying the Retro 80’s musical workout theme to the screen flows. Early explorations were focused on the idea of picking up a cassette tape to play music for the workout class. Leveling up would unlock new tapes with more challenging songs.
Character Design
Characters in the game served three functions:
Player input controls the dance movements of the characters.
Their idle animations are mapped to the tempo of the song.
They add humor to the game.
The character designs are based on user personas created by our marketing research.
I modeled them after common kinds of people one would see in the gym, pushing the shape language of each to feel unique.
Motion Design
I focused on screen transitions in the final motion design, guiding the viewer’s eye while also incorporating the energy and iconography of the 80’s.
Iconography
All vector assets were created in Illustrator and were optimized for implementation in Unity engine.
Mobile Port
On mobile, screens were recomposed to be in a vertical orientation as well as simplified for the smaller screen size. Drum input labels were changed to numbers.
Impact
Player Testimonials
“Love it love it love it! The cassette tapes, the aerobics dancers, the music. It is fantastic.” - Cynthia
“Really enjoy the theme and sound effects. Great idea for a game!” - Esther
“I play Piano and drums and am LOVING this game!!!” - Laura
“As an aerobics instructor in my real life. I live on the beat. This is a great game for new instructors to use.” - Cebie
“I know how much music helps the brain with memory and this game does even more as it assists in the brain with coordination of the fingers.” - Leanora