Rock Box’s karaoke system is inefficient.
- What could be improved about this karaoke experience?
- How could an app facilitate these improvements?
- Where are the painpoints for Rock Box customers?
Over the course of two weeks, I worked on solving this problem for Rock Box using newly-learned UX research and information architecture skills to guide my design.
Rock Box caters to the “salaryman.”
Rock Box is bustling with business.
Busy People both Yelp (pink) and Google (green) felt as if both the private rooms and the main area were crowded.
Variety People appreciated the music variety and private rooms.
Happy hour Finally, people seemed to enjoy happy hour. Rock Box offers a different experience depending on when you go.
I conducted four interviews to discover problems to design for.
Rock Box is busy and the staff have to work hard to keep up.
Meet Stan Smith.
Inspecting the competition helped shape my design.
I decided that I wanted to design an app to help Stan queue music in the main room and purchase food and drinks. This would cut down on the amount of work the staff would need to do and make it easier for customers to quickly find their favorite music. Considering the immense database of songs available, I decided to create an interface that allowed people to quickly search, queue, and save music. But I also considered other options, so I made a feature analysis comparing Rock Box’s current system to two karaoke apps:
|Rock Box: Pencil, Paper, and Website||The Mix: Kara Fun App||Hula Hula: Heals Sonic|
|Operated by Staff|
|Browsing on Home|
|Browse Top of Charts|
|Browse New Releases|
|Search Automatically Searches Titles, Artists, etc.|
As you can see, the apps used by The Mix and Hula Hula have a lot going for them in comparison to Rock Box’s system. Kar Fun App and Heals Sonic are karaoke apps that can be used to queue music. From this analysis, it seemed the most important features were:
My thinking was that searching allows users to find specific music quickly. Browsing is important because sometimes users may not know exactly what to play, so giving them some easy options to look through might help them. And having a feature to favorite music felt like a good idea because many people at Rock Box are returning customers and they might want to be able to easily find music they enjoy singing regularly.
Laying the foundation for the design.
Next, I created a sitemap for my design. I split the app into two parts: a menu and a song selector. The menu part of the app is for customers to order food and drinks. The song selector takes customers into the karaoke part of the app.
When formulating the site map, I decided to my design “The Square” and to make it for desktop or tablet. My thinking was that Rock Box customers could use the app while at desktop or tablet stations around the bar. The stations could have an accompanying credit card reader to allow customers to make payment on the spot.
When using The Square, a customer like Stan will have to order something from the bar before they can use the Song Selector. After making an order, Stan will receive a code of random numbers and letters. He can decide if he wants to print a receipt with the code or have it texted to him. Before using the Song Selector, Stan must enter this code. This way, the karaoke system can’t be abused by non-customers and it incentivizes customers like Stan to give Rock Box business.
Creating wireframes for several user flows.
High fidelity wireframes in Adobe XD.
Final prototype and next steps.
With only two weeks, I was unable to push the design into a higher fidelity unfortunately. With more time, the next steps would be:
- Build out pages for the music collection feed
- Create account management pages for returning customers
- Bring the designs into a higher fidelity
- Conduct usability tests to determine flaws
- Create subsequent design iterations based on feedback
Below is a clickable prototype of my final design.