Mussio Music App
INTRODUCTION
Media is a very important form of entertainment in society. With digital tools, it makes it much easier for people to gain access to a much wider variety of media in a short amount of time. This creates great opportunities for businesses. Mussio believes that by creating a paid product with greater features than the free version, users will take the opportunity to upgrade to the better product and pay the subscription fee. This will create a profitable revenue.
The Problem
Since the existing flow does not have any call to action throughout the free experience to allow, or motivate, the user to subscribe to the paid experience, it was my task to create one.
For this project, I was given existing lightweight wireframes for the already existing product. In addition, I was also given information about the company’s target users, their brand, business goals, and information from the product manager. I used this information to move forward and onto research.
DESIGN PROCESS OVERVIEW
Study Industry Leaders
I spent a few hours conducting competitive industry research. I then created artboards based on my findings from my research. I wanted to understand how these three companies went about having a free product with the option to upgrade to a better product with a subscription fee.
Company Name and Visual/UI Style Guide
I created the company name using a business name generator. I spent a few hours toying with keywords to come up with a name that fit the company’s brand.
I also used the company’s brand to come up with the style guide as well. I wanted to make sure the name and style fit well with their attributes: bold, smart, and hip. I put in a placeholder logo at the top of the style guide to help tie everything together.
Project Plan and Research Plan
Now that my research and style guide was finished, I began creating a project plan. This allowed me to plan out how I was going to approach this project, as well as give myself some timelines to keep myself on track. Afterwards, I created a research plan to help me organize myself for my next few steps.
Survey
From here, I started my primary research. To start, I conducted a screener survey using Google Forms. I wanted five participants who are very tech savvy, are budget-conscious, find media [music/movies/books] a very important part of their lives, and participants that are between the ages of 18-24.
Interviews
Now that I have chosen my participants from my screener survey, I began to schedule interviews. I found five participants to interview. All of these participants found media [music/movies/books] to be an important part of their daily lives. However, most were not between the ages of 18 and 24. I chose to go ahead and interview these participants anyway, despite them being a little older, because they fit in with all of the other traits I was looking for. The participants I chose were a mix of male and female, and were in their 20s and 30s. They each had a variety of different occupations.
During the interview process, I asked participants about what media apps they use, as well as how often they use it. In addition, I asked what features they enjoyed most, as well as what features frustrated them. I wanted to know what they looked for in a media app, and why they subscribed or did not subscribe to a premium service.
Affinity Mapping
It was now time to review my interviews and work on my affinity mapping. I sorted my sticky notes into six different groups: Types of Media, Apps, Pros, Cons, Encourage, and Discourage. I noticed a lot of my information was all over the place. My participants used a wide variety of apps. Some of the pros and cons overlapped with what encouraged and discouraged them as well. However, I did notice that overall, they enjoyed apps that gave them a wide range of content, as well as the flexibility to listen to what they want to. Some participants did appreciate it when the app was able to tailor music to fit their personal tastes.
Personas
After looking over my research, I designed three personas. These personas were not based off of any specific person, but based off of the concerns of the participants, as well as what the participants wanted from a music app. I gave each persona a name that was music related to keep a musical theme going.
User Flows
I based my user flows on my artboards, as well as on my user interviews. I wanted to make sure that navigation for a user was familiar, so they could navigate smoothly throughout the app.
Wireframes
To save on time, I downloaded a few different templates of music apps and meshed what I liked together. From there, I edited the templates themselves to have them flow together better.
First Round of Usability Testing
Since I created my wireframes in Figma, I created a quick prototype using the program to help me with my first round of testing. In the first round of testing, I had five participants in their 20s or 30s, were of different genders, and all of which found music to be an important part of their life. I would have liked to find more participants that were younger, but since these participants found music so important, I felt that being older wasn’t too much of an issue. I had asked each participant to complete a few tasks. I scheduled a meet up with all of them virtually, and had asked them to share their screen as I watched them navigate through the early prototype of my app.
The results of the first round of testing found four issues, two of which were minor, one was major, and one was critical.
High Fidelity Mockups
Using my style guide, I created my high fidelity mockups. Throughout the process, I was constantly referring back to other apps for inspiration, to ensure everything would be familiar to a user. This specific color palette became a challenge, so I was constantly referring to other apps that had a similar color palette to see how they approached it. I was also referring to a contrast picker test for web content accessibility guidelines to ensure that everything passed.
Prototype and Second Round of Usability Testing
Now that my mockups were done, it was time to create the prototype. I used a similar test script for my second round of testing. Again, I chose five participants in their 20s and 30s who were of different genders and all found music to be an important part of their life. They all had the similar tasks as the first round of participants, as well as met up under the same conditions. I found one critical issue, one major issue, and five minor issues during this testing.
CONCLUSION
Reflection
In the end, I created a prototype of a music app, which gives the user the potential to upgrade to the premium service for a better product. It’s bold, smart, and hip. Throughout this creative process, I learned about using templates to my advantage to speed up the process. I also learned a great deal about using such a bold color palette. As with previous projects, I have reminded myself of the power of using other sources for inspiration, to ensure familiarity with the product to users.
What's Next?
Future versions of this prototype will include fixing the issue found in the second round of usability testing. Another round of testing could be done to ensure that everything is in the best state it can be.
Acknowledgements
Much thanks to the participants in this study for their help and generosity. I also give thanks to my mentor, Lauren McElroy.