Amazon Prime Web Application UX Redesign
(Concept Project in 48 Hours)
I use Amazon Prime for video content multiple times a day as many of you do. This often led me to face a couple of gaps in my journey as user right from log in to accessing the exact content to support my current mood. I felt there is an immediate need to have a revised search system here to help a user filter the vast amount of content available on the platform.
I quickly moved to validate the problem with friends and family in combination with research. This led me to a case study to give me more insights into similar problems and a detailed user research which only validated the problem wrt. user analysis.
Project Scope
Amazon succeeds by offering a minimal, search-oriented user interface (UI) that accommodates both digital natives and internet newcomers. However, there is a common gap to be noticed when it comes to movie buffs and tv fanatics looking for relatively precise content (if not the exact movie or show by name) vs people looking for general entertainment options.
To easily browse tailored video content, view trailers and descriptions
Let's Begin
The approach to making the product launched with problem-solving User Experience, I have followed step by step process described in top UX frameworks. At the beginning when I was learning UX, I have gone through various articles and learning platforms video series and found the below great process which makes every product works. In the below steps, I have distributed my 48 hours which means I didn’t get enough time to take interviews of many real users but I have supported my problem and solution with insights from the case study as well.
A Step by Step Process
Learn/Research & Survey.
User persona.
User journey.
Approach
Wireframes.
Visual References.
Prototype.
Usability Testing
1. Learn/Research & Survey
To begin the product design process I would have to research targeted users which will help a product designer to create the product in the same way. Research process includes Surveys & User feedback are a very important factor but to expedite the process I have managed to do my desk research and gone through different websites and mobile apps to understand user base. Below reference can be considered as a big competitor in the same business.
Key findings:
1. All of the competitors including Amazon Prime have engaging content, but too overwhelming dashboard what often makes users leave the service without easily finding something to watch as per the mood
2. None of the services has an opportunity to tailor the dashboard except Netflix wrt. filtering type of content
These findings helped us to notice a design opportunity for the Prime video. We built an aim to create features that users wouldn’t expect from their streaming service, but more likely appreciate and use them.
2. User Research & Persona
The aim was to understand what are the users streaming online behaviours, what people value about their favourite streaming service and what they found frustrating about it. I tried conducting basic usability testing based on existing Prime Video site and the competitor’s website to understand the main usability pain points.
Key findings:
1. Users value the quality of the video content over the quantity
2. They would welcome some curated content, potentially from people they know, or people they have a shared interest with.
3. A less busy, more tailored homepage would be welcomed by most.
Some quotes from the user interviews:
"Only if I could do broader search with collections of output right on the main screen at the top"
“If there was something like a playlist on Spotify”
“Trusted people reviews would be considered”
At this point, we had enough data to create a persona that represents who we were designing for. We focused on the existing user as we wanted to make sure we are able to engage with people who are already loyal to the service, before trying to bring new people in.
Below are a few problem statements that were considered to take the design process forward:
Rachel needs a better way to find something new to watch because there is so much to look through and it makes her feel overwhelmed and want to give up
How might we provide Rachel with a way to find more tailored content that she will feel more engaged and comfortable to use the service more frequently.
Rachel needs a better way to find new content to watch because the recommended content is not related to her taste.
How might we enable her to see friends suggestions to encourage her to use service more frequently?
3. User Journey
A Low-fidelity sketch on paper has been drawn to understand the User journey & user pain points as described in the above sections.
4. Approach
Goal: To re-design a product experience focus on user problem solving and motive user to be able to filter content as per mood on Amazon Prime Web App
Tasks: Find / Filter relevant content as a first step on Amazon Prime Web App
Case Scenario: The fastest approach to find/filter relevant video content on Amazon Prime
5. Wireframes
Below you will see a series of low fidelity and high fidelity wireframes which elaborate on the addition of a global filtration system to make accessing relevant and absolutely subjective content for an Amazon Prime user in the fastest and most flexible manner.
Low fidelity Wireframe to present user journey
Iterations
Prototyping from lowest fidelity to highest let us achieve our goals and ensure redesign is going to improve User experience. Here are some main changes:
Home Page
1. Global Filtration System: Addition of 'Filter' option on the main menu (right after home) to help user filter across all the content on the platform.
2. Moving of 'Watchlist' as an option on the main menu to ease the access of a personal playlist like feature
3. The user can also access a sub filter option after choosing any category from the main menu like TV shows / Movies / Kids to further filter the vast offerings
Home Screen | High Fidelity mockups made using app.moqups.com
Filter Option Selected From The Main Menu | High Fidelity mockups made using app.moqups.com
Filter Option Selected From The Main Menu | High Fidelity mockups made using app.moqups.com
Filters Applied to see selection | High Fidelity mockups made using app.moqups.com
6. Visual References (Ref From Case study)
For the web app visual design I tried to add some visual refreshment while following current Amazon Prime design guidelines. I choose Amazon blue as the primary colour but gave a little refreshment with gradient effect when using blue as a background.
7. Prototype
Below is the prototype created using Adobe XD for the ease of understanding the user journey with the new global filtration system for Amazon Prime Video. The final prototype differs from the high fidelity wireframes which showcases my learnings in the process of converting a high fidelity wireframe to an actual prototype to ensure smoother user journey and hence a few changes were introduced.
Conclusion
I believe that this global filtration system will help users reach to content they like / could like fastest with most flexibility. It enhances the experience of navigating through the vast content that Amazon prime offers without making it overwhelming. By providing the opportunity to custom select content type, it will help user retention because of ease of access of content.
