Rock On!: From Idea to Launch and 2.0 Update

 

What Is Rock On?

Rock On, a spin-off of SongPop, is a name-that-tune music trivia game for iOS. The game was released on April 2015 and was immediately featured on the App Store as Best New Game in over 100 countries (including the US). Unlike SongPop, Rock On offers a single-player experience and focuses on Rock and its subgenres. The game features 4 different game modes and over 100 levels.

My Responsibility

I led the project's UX/UI design from the initial brainstormings to launch and the 2.0 update. 

 
 

Kick-Off 

"SongPop was a huge success. How can we make that happen again?"

In 2014, I was asked to join a team in charge of inventing the next SongPop. After a formal kick-off meeting, we started with a few brainstorming workshops during which we went over lessons learned from the success of SongPop, user feedback we received over time, and all the feature ideas that were sitting in SongPop’s backlog but never got to be implemented.

 
A picture from the brainstorming session. ideas were grouped by core game, meta game, content, social, UI improvements.

A picture from the brainstorming session. ideas were grouped by core game, meta game, content, social, UI improvements.

 

We then moved on to a phase of rapid prototyping in order to flesh out the core game experience. We iterated fast and built over 50 prototypes that we play tested both internally and externally.

 
Usertesting.com is my go-to tool for concept testings and usability of an app.  

Usertesting.com is my go-to tool for concept testings and usability of an app.  

 
This is a brainstorming summary report I created to share with the team.

This is a brainstorming summary report I created to share with the team.

 

Key Decisions

This exploratory work led us to make four key decisions that would set the direction for the upcoming product development:

  • Core Game UX: Identify as many songs as possible in a given amount of time.
  • Meta Game UX: A single-player experience with a linear progression through themed levels (Modern Alternative Rock, 80’s Rock etc…) laid out on a map. —A solo mode was one of the most requested features in SongPop.
  • Content: All about Rock. Focusing on a particular music genre allowed us to build an engaging game narrative that our players loved. We picked Rock because it was the most popular genre in SongPop and was broad enough to build a rich set of playlists.
  • Technology: Native iOS first, built with Swift. Unlike SongPop which needed to be multi-platform from the start to take advantage of its network effect, Rock On as a solo game could be launched on iOS first. Building the game natively with Swift allowed us to get great performance and to easily integrate advanced features like VoiceOver.

 

Game Narrative

Once the direction was set, we knew the player would linearly progress through a series of Rock-themed playlists. We wanted this progression to feel more like an epic journey than a tedious concatenation of levels, so we worked hard on building an engaging game narrative.

Lots of fun ideas came out of our brainstorming sessions but we eventually settled on putting the player in the shoes of a fan following a legendary Rock band. The adventure starts in a concert venue, takes the player backstage, then onward to Vegas following the band’s bus on Route 666, after which things only get crazier as the band explores a lost temple leading to Rock Heaven, all the way to space! 

This epic journey came to life thanks to the very talented Alex Eben Meyer whose colorful and playful illustrations wonderfully captured the essence of Rock’n’Roll.

 
Game art by Alex Eben Meyer

Game art by Alex Eben Meyer

 

IA and Wireframes

The next step was to structure the screen flows, which involved many whiteboard sessions. As these flows got fleshed out, I produced hi-fi wireframes that I posted on standing boards to serve as support for live discussions with the team during the implementation phase.

 
RockOnWireframe01.png
Hi-Fidelity wireframes printed on a board.

Hi-Fidelity wireframes printed on a board.

 

UI Visual Styles

I created a cohesive look and feel between the game art and the UI by using bold colors such as red, black and yellow, and a font that looks hand-drawn and whimsical.

I used black as the base color for the UI in order to help the user focus on information and interactive elements rather than the UI itself.

All UI visual design was done with Sketch.

 
RockOn_GUI.png
 

Motion and Sound 

Animations and sounds at appropriate moments not only make a game feel responsive but help create an immersive user experience.

To reinforce the game’s Rock’n’Roll mood, I created speedy and bouncy UI animations, and added some energy through particle effects. These animations were then complemented with layers of sound effects by our sound designer Louis. 

 
 

User Feedback

During the initial development phase, we didn’t have any live data to inform our decisions. Instead we relied on qualitative tools:

  • Usability tests, both internally and through usertesting.com, allowed us to observe users going through the onboarding and early game flows, and identify key UX issues.

  • Our private beta, mostly composed of active SongPop players, let us see how hardcore users could really stretch the limits of the game.

Having both of these perspectives was crucial to calibrate the UX and the game balance for a wide audience.

 
 

Honing and Refining

After our initial launch, we discovered that players progressed through the game a lot faster than we had anticipated. While other games could solve this problem by simply adding more levels, we found ourselves constrained by the amount of content we could draw from. Even with a loose definition of what qualifies as Rock, there are only so many playlists one could compile without venturing in completely obscure titles, which would have made the game less and less fun for most people.

We had to find ways to engage players over time with a limited amount of content. After many discussions with the team, we settled on two ideas:

1. Social features for competition

We knew that competition was a strong motivation for SongPop players, so we added various leaderboards throughout the game to allow players logged-in with Facebook to compare their performance with that of their friends.
We also added the ability for players to challenge their friends (to beat their high score on a given level) via Facebook Messenger or Apple’s Game Center.

 
 

2. Game modes for replay-ability

In order to increase replay-ability and allow players to stretch their limits, we added a variety of game modes of increasing difficulty. This meant each level (playlist) could be replayed with different gameplays and difficulty settings:

  • Mic Check (easy): Correctly guess at least 5 songs out of 10.
  • Opener (medium): Score at least X points in a given amount of time.
  • Sudden Death (hard): Correctly guess X songs in a row. Any mistake means game over.
  • Arcade (hard): Same as Opener, with harder goal and timer settings.
 
A white board session for discussing new game modes

A white board session for discussing new game modes

 

Results and Achievements 

I feel extremely grateful to have taken part in this project. Not only we built a great product, but we had a lot of fun in the process and the teamwork was excellent.
Here is a summary of the game’s achievements as of December 2015:

  • Featured by Apple as “Best New Games” and “Best New Updates” in 124 countries.
  • Over 600,000 downloads.
  • 50% Day 1 Retention (vs 37% industry average).
  • Rounded average of 5 stars over 1,700+ App Store reviews.