Gamification: Pivoting a Sunset App
UX Case Study
How can we create a way to add value to an existing app that may be coming to the end of its time?
The Scope
Keezy Classic: Jamming on a Classic
Once a darling among early native sound and music apps, Keezy Classic now looks at an uncertain future. With sister products from its parent company, Keezy Corp., it’s only a matter of time before a decision has to be made — can Keezy pivot, or is it time draft an end-of-life plan? With such an ethereal interface and endless utility, the Keezy Classic product should be immortalized, preserved, and developed upon.
The Opportunity
The opportunity for this project is to design a new app that complements and adds value to a sunset app, Keezy Classic, in a 1.5-week sprint.
To attract and reengage users while opening up a new market.
What I did:
I began the journey of saving the world… I mean, the journey of exploring ways to help Keezy Classic pivot by conducting user research. Through understanding users’ habits and needs, I discovered the best way to meet my client’s needs and designed a user-centered application. The discovery and design process has been documented below in 5 phases: Research, Synthesis, Design, Prototype, and Future Considerations.
INTERVIEWS
I interviewed people from different countries, which gave me a global perspective. The interviewees possessed a range of zero to a professional level of experience with music; Three of which were professional musicians.
Half way through the interviews, I had gained empathy for the users and discovered creating a game out of beat-making might be the best direction to add value to Keezy Classic. This is when I shifted gears slightly and continued the rest of the research process trying to validate/invalidate this assumption.
Affinity Map
I took the data I got from research and searched for trends and insights by creating an affinity map.
Key Findings
The findings can be summed up by the following two key quotes from the interviews:
“Learning needs to be fun and engaging.”
“I am most engaged by games that are easy, yet challenging.”
With the trends and insights I drew from research, gamification was the best way to meet, both, business and user goals. The project goal is now defined and I was able to confidently move forward. The challenge was now to tackle designing the game with the users’ needs in mind! Which is the very thing I was excited to do.
User Persona
Meet Amber! She lives and works in NYC but due to the pandemic, she’s been laid off and now has quite a bit of time on her hands. She wants to learn something new but found the experience of learning music boring. She needs a fun way to learn music without even realizing she’s learning.
Before entering the design phase, it was essential to, first, define the reason WHY. The problem statement is the reason for the design. With the problem statement and users like Amber in mind, I began designing.
Design
User Flows
I created flow charts to walk through the navigation process of the user. Below are two main user flows: (1) The user navigates through the login process, and (2) The user navigating from the point of a successful login to the game.
Sketches
Sketches are a quick and easy way to flush out the initial idea of the design. Initially, I considered using the Profile screen as the Home screen, where the user can see game stats and friends. That idea was scrapped and replaced with the Home screen in the iteration below.
Every step of the design process is focused on Amber’s needs and habits. The Home screen is no different. Amber needs something simple, direct, and easy to navigate. Therefore, I eliminated screens to make the process more efficient and Amber can start playing with just one click from the Home screen.
The game interface is where the fun and action is for Amber. The first iteration was inspired by the original Keezy Classic interface, which is functional but not engaging. I did some more research and got inspiration from different mobile games. I ended up using a combination of iteration #2 and #3 in the final design.
User Testing and Feedback
For the purpose of this project, I used Balsamiq to digitize wireframes guided by the user flows, sketches and wireflows I created previously.
When the prototype was finished, I did some user testing. I took their feedback into consideration and made the appropriate changes, arriving at the final design below.
(1) Clickable Prototype via Balsamiq
https://balsamiq.cloud/so9yz0o/pa3h6uf
(2) Clickable Prototype PDF
Screen Overview
Here’s a break down of all the screens in the prototype.
Onboarding/Login/Home
Onboarding screen for new users.
Login/Sign Up screen
Home screen
Solo game Mode
When Amber enters the game, there’s a prompt to remind her how the game works. This prompt screen was added as a result of user testing and feedback.
Once Amber clicks ‘Play’ a little disc appears and moves slowly in an upward motion. When the disc arrives at the target, Amber hits the beat and a musical tune/beat will play. The entirety of the game will make up a track that one can essentially create on the original Keezy Classic app.
Friends, Chat, Game Options
Friends: Amber can send her friends a message or directly challenge them to a game.
Chat Message: Amber banters and agrees on game option details with her friend.
Challenge! a Friend: Amber selects different options for each game. The last game’s selections are automatically saved.
Versus Game Mode
Amber plays in synchrony and real-time with her friend. She is able to see her friend’s screen as well as both of their scores to emulate the sense of being in the same room together, since due to the pandemic Amber is unable to see her friends in person.
Keezy Challenge! is a simple game for Amber to learn beat-making and to interact with her friends.
Future considerations
(1) Incorporate a metronome option
(2) Enhance the learning aspect of the game. For example, developing additional solo challenges where the user can play levels however many times they want until they are able to mimic a track with little to no prompts (the little discs)
(3) Turning this into a hi-fidelity prototype
Takeaways
This was a stretching, yet great learning process for me, personally. With the constraints of time (1.5-week sprint), the pandemic, and also my first time creating wireframes I was challenged, failed, got back up, and continued diving in. I still don’t feel completely confident in the research phase, but know I will only grow in this area and obtain more tools in my pocket moving forward.
I only had previous experience skinning wireframes and incorporating UI elements, so I really enjoyed creating wireframes in this project. This was a good introduction to working in Balsamiq, and I like how quick and simple it is to use.
