JukeBoxx - Premium Subscription Concept
Duration
4 weeks
Role
Solo Project
Problem Area
A startup company launched a media product two years ago. It is a freemium model that has a mobile-web experience and a mobile app for both iOS and Android. The company’s business strategy was to first build a user base by offering a free product and then evolve the feature set so they could monetize on a premium (paid) product.
At this point, the product has been well received and has a healthy user base of free users. They now need to design an experience that will allow users to subscribe and pay a monthly fee
Hypothesis
Create two premium plans to offer existing and first-time customers so that customers can choose a plan based on budget and their listening preferences
Business Opportunities
Offering two types of premium subscription models will allow customers the option to choose a plan based on budget needs and listening habits. This will reduce the number of customers leaving the platform for either something more budget friendly or with more listening options to choose from.
Approach
Define
Understanding problem space
Defining project goals
Forming a schedule
Research
Competitive Analysis
User interviews (5)
User Flow
Design
Wireframes
Feedback Session
Style guide
Hi-Fidelity
Evaluate
User-based testing (5)
Re-design
Research
Competitive Analysis
Analyze the music streaming space and current state-of-the art solutions related to the problem area
User Interviews (5)
Survey music streaming users of their pain points and what they like about their streaming service
User Flow
Understand the user journey, user need and various pain-points
I divided the research phase into two phases - a primary research phase where I understood the context of the problem, conducted initial stakeholders interviews and audited existing solutions.
This was followed by a secondary research phase where I conducted 5 user interviews and synthesized all of this data into a written research synthesis and user flow.
Who did I interview?
(2) Interviewees had full time jobs, (2) were college students, and (1) was a 12th grade high-school student
All interviewees listened to music via music streaming service at least once a day
All interviewees paid for a premium music streaming service
Insights + Themes
Theme 1 - Convenience
Insight 01
Hates paying for two music streaming services to get different types of content (creator and mainstream)
Insight 02
Spotify's free one-month of premium when signing up for their freemium model incentivized users to pay for premium
Theme 2 - Design & Functionality
Insight 03
All interviewees preferred Spotify's UI over SoundCloud or Pandora
Concept
Touchpoints
Freemium
Premium
Premium Plus
User Flow
Wireframes
Freemium vs Premium vs Premium Plus
I wanted to emphasize the difference in the freemium versus the two premiums model through design by:
For the freemium platform, I used the JukeBoxx logo as the far right icon on the navigation bar where the user chooses one of the premium plans
I included a pop-up blocker that would allow users to sign up for premium or return to search when trying to play a song that requires a premium plus subscription
The premium subscribers get a full profile page of their recently listened to songs plus much more. The freemium users have to access their profile page through the homepage
Testing & Improvements
First Major Improvement
Pick a Plan Screen
-
Users mentioned their confusion regarding where to click to choose a plan. To have the plans appear clickable, I added the arrows and shadow boxes
Second Major Improvement
Improvement in overall UI + Music Streaming bar
-
Increased saturation on the dot which shows which screen you're viewing on the navigation bar
-
Mentor feedback recommended switching from the branding color blue over the artist photo to a black gradient over the name of the artist. This was to eliminate text blending in with the artist photo
-
Adding a floating streaming player bar to each page where the user can pause/play or expand wherever they are in the app.
Third Major Improvement
Music Player
-
Enlarged the buttons to make more accessible
-
Created a quick and easy way to 'favorite a song'
-
Added a gradient black film over the image to increase visibility if the text/buttons and image color blended in together
Style Guide
Hi-Fidelity Designs
Key Screens
Usability Testing
I conducted moderated in-person testing at a local coffee shop in my town. I picked (5) different users ranging from 17-32 years old. I asked them the following questions and had them walk me through the prompts listed:
Qualitative Questions
To gather thoughts, feelings & impressions
-
Take a look at each screen, what are your initial thoughts and impressions?
-
What options do you have access to?
-
What do you think each icon means on the navigation bar?
-
What does your your profile or home screen show you?
-
If you had the options of two types of premiums - which would you choose?
-
What are your overall impressions of the app? What do you wish were different?
Quantitative Tasks
To identify any usability problems
-
How would you choose a free plan? How would you choose premium plus?
-
Navigating the main screens within the app
-
(within the free version) What is the paywall telling you?
-
How would you view the premium plans from here?
Outcome
Users during testing mentioned how they liked having different options of payment plans and to have the same music content that SoundCloud includes while having better design and functionality. All five users from both rounds of testing said they would prefer to have a paywall on premium creator content and unreleased songs knowing they have the ability to subscribe for that content rather than signing up for a separate app.
Final Prototype
Future Roadmap
Future Research + Changes
While the testing phase went well and interviewees had positive feedback regarding the two types of premium plans, it would be interesting to see how many users would select the Premium Plus model versus Premium or the free version.
Are the features offered in Premium Plus enough to insinuate users to upgrade their plan? The number of upgrades is the only way to tell if these models work.
What I learned
01
My biggest mistake with this project was not taking enough screenshots of the changes I made throughout the design process. Even though I had three rounds of feedback from testing, I could only find screenshots of two iterations I had made. Major re-designs happened after the usability testing including adding the floating streaming player and changing the blue gradient over the artists image to black
02
Learning that what is obvious to me may not be obvious to the users of my product. I assumed usesability testers knew they could click into a box to select the service but found I needed to improve my designs to make it more intuitive