Plex Redesign
Better access to all the media that matters to you.
Introduction
This project was done as part of my Kleiner Perkins design challenge where we were prompted to redesign the product or webpage of one of their portfolio companies.
The one-stop destination for free shows.
Plex TV is a one-stop destination where users can watch thousands of on-demand titles and live TV for free, on any device. In addition to viewing the free titles, members of their Plex Pass subscription can also stream music and set up their own personal media server.
Problem
The current onboarding isn’t reflecting the high-quality content of the app.
A great onboarding experience can lead to conversion rates above 90%¹, leading to higher engagement and profitability amongst users, but Plex may currently be losing out on some of that potential.
Goal
Building an onboarding that informs and excites.
Plex’s freemium model could benefit greatly from a positive onboarding experience, utilizing this chance to introduce Plex’s differentiating features , get users excited about using the app, and additionally build brand trust.
Research
First impression evaluation
Method: User Journey
Prior to starting this project, I had never heard of Plex before :(. I wanted to record my own experiences as true first-time user so I downloaded the app and gave it a go to see what I was missing out on!
I was able to divide the onboarding process into 5 different phases.
The 5 phases of onboarding:
1. Offer
2. Account Creation
3. Service Selection
4. App Icon Change
5. Home
Flip through my user journey slide for my thoughts & feelings throughout the experience or skip straight to the user journey map for insights.
User Journey Slide
User Journey Map
I mapped out my pain points based on my thoughts during the onboarding process and transformed them into opportunities for improvement.
Findings
There are missed opportunities for a better experience by fixing minor inconsistencies in style and being more transparent with information.
Summary of opportunities
- Create distinctive button and information hierarchy
- Display more information on app offerings
- Introduce the Plex Pass plan and its features
- Improve overall impression by fixing inconsistencies in text/style
Design
The new onboarding journey is optimized for an increased conversion rate.
Wireframe
How?
- Informative process → user develops a good understanding of product and can make an informed decision later on
- Intuitive and consistent UI → professional image builds brand and service trust
- Reduced information clutter → users can focus on what really matters
- A positive ending → users have a friendlier impression of the brand image
Sign up Page
The original sign up page required users to tap “continue with email” to sign up with email.
*Why I wanted to have email form available by default
I thought that by doing so, I could potentially reduce the number of taps users would need to make so I played with several variations (see image: v1, v2, v3).
My original plan didn't work out.
When I thought about how much easier using socials to login was, I realized I made a mistake by unintentionally emphasizing the email form in an effort to reduce taps.
A research in 2015 revealed that 88% of consumers have used social logins to connect with sites/apps and it’s likely to be much higher in 2023¹. In order to boost conversion rate, I thought it best to prioritize the simpler method → V4.
Other notable changes
An easier way to select services
- Selected services are pinned on top
- Grid layout for easier scanning
- Search function for better navigation
Introducing the Plex Pass
I combined the 2 screens from the original onboarding, removing the option to skip. If users chose to skip, Plex would lose an opportunity to bring awareness to Plex Pass.
Testing (A/B) - 3 users
Preference for B
Ver. A is a little cramped; Ver. B leaves more space for information
Where is the next button?
A warm welcome
Further heighten user anticipation for the product
Testing (A/B) - 3 users
Preference for B
Can see more of the homepage in Ver. B (half-screen); feels more attainable
Final Screens
Prototype
Conclusion
The Kleiner Perkins challenge was a great opportunity for me to apply my understanding of UX design to assess and improve design decisions.
It's worth point out that most of the re-design revolved around my single user journey, which was very fun to story-tell but has clear drawbacks.
Given more time, I would have loved to do more research and testing.
The 4 ways I would like to improve this project...
- Record the original onboarding’s first impressions of 5+ new users other than myself
My view holds a lot of bias (especially as a designer) and I’d be sure to gain more insight with more perspectives - Thorough research on Plex’s competitors, their offerings, and how they sell it
Conversion rates can be further improved by showing how Plex differentiates - Test the final prototype with more users and make adjustments for improvement
Can help challenge the assumptions I made in my design - Carry the re-design onto the home screen
I would love to re-design the home screen to reflect the changes I made for the onboarding as its also an integral part of a user’s first impression
References
1. "User Experience Design." Meta For Developers, https://developers.facebook.com/docs/facebook-login/userexperience/.
2. Beck, Martin. “Gigya Survey: 88% of U.S. Consumers Say They Have Used Social Logins.” MarTech, 14 July 2015, martech.org/gigya-survey-88-of-u-s-consumers-say-they-have-used-social-logins/.
Thank you :)
You've reached the end...why not take a look at my other projects?
