Amazon
Exploring possibilities for a better e-commerce experience
E-commerce App • UX/UI Design
Project Summary
Amazon is an existing e-commerce app. It is online retailer, manufacturer of e-book readers, and Web services provider. I redesigned their department and shopping experience to provide users with personalized features. This was a personal project for the Google UX Design Certification course. The project duration was 2 months. I used Adobe XD to create the mockups.
Observe
To begin my research, I began to look for critical user reviews about the Amazon app on the App Store (iOS). The purpose was to observe user’s behavior in regards to their shopping experience. From the reviews, I filtered out potential biases versus reviews that describes specific features in detail. This is to ensure that the users are providing genuine feedback instead of biases against the brand in general.
Identify
Market Research
A Competitive Analysis was performed to:
1. Synthesizing the information before acting on the findings.
2. Create features that’s non-existent on the app
3. Enhance a feature by taking solutions from another product
4. Identify common pain points.
I’ve compared different apps from Amazon’s main competitors Ebay, Walmart, and Best buy to identify possible existing solutions. After researching through variety of articles, user reviews, and assessing the app in-person, I’ve defined some of the pain points and solutions to enhance the app.
UX Design
The Pain Points:
1. Outdated UI. A number of people said that the interface does not match the branding style of the website version. The navigation was also confusing because users were not able to go back to the intended page on their search journey.
2. Irrelevant Product Results. It is clearly mentioned several times that Amazon app doesn’t display relevant products that anticipates the next user’s behavior.
3. Underdeveloped filtering options. Many users feel frustrated that once they select a filter feature, they must re-do the entire search process to go back to the filter options. Another pain point is that the filter isn’t well-defined. It will not allow users to make the appropriate filter to accurately find the item.
4. Display of Ads. Numerous people expressed annoyance with the ads display.
The Solution:
1. Engaging Exploration Feature. The goal is to match the branding of the website version to the mobile app. Along with this, the UI will display an exploration feed of organized departments.
2. Algorithm Product Results. We want to display products from past user searches and data from website history or cookies. This will show the users new items and deals they’ll most likely purchase.
3. Enhance Filtering option. The filter option will be primarily used to prevent repetition of unwanted items on the feed. Users can go back to the filter option and make changes to their selections without re-doing their search.
4. Make the ads more attractive. The ads will not be taken out since many of the vendors conduct business with Amazon. The solution is to make the ads look less like ads and more of a recommendation preview.
User Persona
Visual Design
Aa
Arial Regular 32pt
ARIAL BOLD 24pt
Futura Regular 16pt
Futura BOLD 14pt
The current Amazon App uses Open Sans and Arial. I decided to keep the Arial font but use Futura Font for the exploration
#FFD800
#232B3D
#FF9900
Comparison
Landing Page
Rational. The landing page for the Amazon app was uninspiring. For individuals who wasn’t interested in Alexa, the landing page will not motivate them to scroll past the first page. I’ve changed the design by placing the past history of the items the users viewed. The rational is that even if the users wasn’t interested in Alexa, the users can still relate to the products seen below it. I’ve also changed the bottom navigation by including a home, favorites, departments and account. This helps with the easy navigation of the app.
Filter Options
Search
Rational. I’ve reorganized the filter selections by taking out irrelevant options and replacing them with price, customer rating, brand, beauty products attributes, condition, and gender. I’ve also included a “done” button that will redirect them to the same page so the users do not have to re-do their entire search.
Since many users expressed annoyance with the ads, I’ve created an option to hide them. I placed a small “Hide Ad” on the bottom of the advertisement as an option to opt out.
Exploration
Rational. The explore page appeared cluttered and disorganized. Since the categories were also links instead of buttons, there was a higher risk for the user to click the incorrect link. I’ve re-organized the categories by creating buttons for each genre of books. I’ve kept the related books, but also included Popular Books so that the user can explore new books based on the algorithms of the users past searches.
For the department, the previous design only had a drop list option. The drop list option is still intact on the new app, but I created a more visual representation for the department category so that users can feel motivated to explore.
Usability Testing
I conducted user tests with 5 participants and synthesized the feedback in an affinity map.
Mockup
Conclusion
Overall, the project was fun to work on. I’ve worked on an e-commerce product in the past, but I thought it would be interesting to improve an existing product.
The most challenging part of the project was creating solutions to solve the existing user problem. Instead of second guessing possible solutions, the market research helped with narrowing down key features that improves the overall user experience.
Thanks for Reading!
Like What You See?
Contact me for inquiries.
alicemariechong@gmail.com