EcoTheory
EcoTheory is an e-commerce application that helps keep our planet clean for future generations.
Role
UI/UX Designer
UX Researcher
Tools
Figma
Miro
Timeline
December 2021 - February 2022

PROJECT
The e-commerce EcoTheory company wants to improve its conversion rate from browsing to completion of checkout to increase sales and revenue. Based on the data information given by the Product Manager at EcoTheory:
-
50% of users open on average 7 item pages and abandon the site without moving any items into the cart
-
70% of users who place an item in the cart do not purchase
-
Additionally, they would like to capture email at checkout
GOAL
The goal is to reduce the user’s bounce rate, improve the usability navigation throughout the application, and offer easy payment process to complete their checkout.
SOLUTION
Quick & Simple Onboarding
-
Sign up using their name, email, and password or social media account
-
Quick overview of the company's shopping experience


Hassle-Free Shopping Experience
-
Add to cart without leaving the page allows customers to continue shopping
-
Reduces the cart abandonment rate
Payment Options
-
Pay using a credit card
-
Checkout using online payment methods such as Apple Pay, Google Pay, or Paypal


Reordering Made Easy
-
Let's customers reorder items they’ve already ordered with just one click
-
Saves time and effort
RESEARCH
To understand the target audience, data was provided by EcoTheory -
-
Users are between the ages of 25 and 40
-
71% of women are high-income earners
-
Environmentally conscious consumers will spare no expense on these eco-friendly products because they want to reduce their carbon footprint, and pollution, and protect the ecosystem
I began with secondary research on how customers interact with shopping brands on a practical and functional level. User abandons a site before adding an item to the cart, it takes only 15 seconds to grab a reader’s attention, and on average users stay on a website for about 2-3 minutes. A major indication of a high bounce rate is due to a poorly designed website or application.



A competitive research was conducted to understand why the top online retailers such as Amazon, Walmart, and Target are dominating the e-commerce retail space in the US markets. Amazon is the most recognizable ecommerce store worldwide because of its dependable delivery services and convenience. By providing competitive pricing, great deals, easy shipping and returns, Amazon has disrupted the online retail space.
DEFINE
Through secondary and competitive research, I created personas using some of the pain points of consumers’ reasonings as to why user's abandon their shopping carts. To visualize who the users are, an empathy map was used to see from the consumer’s perspective and what they look for in a product to reduce the bounce rate of the application.



IDEATE
By mapping out the user flow, I can simplify the user’s journey and determine how many screens to design. Using the data that I’ve gathered from the user’s research and personas, will help me create all of the important navigational paths.

PROTOTYPE
To help me explore and communicate my ideas on paper, I began sketching my idea before I settled on this design. I translated my sketches to build out my low-fidelity wireframes. Seeing the early stages of my framework, allowed me to visualize the rough design functionality and test the concept.

Home
Product Info

My Cart
Payment

Home
Product Info
My Cart
Payment
TEST
After using the feedback from the low-fidelity wireframes in guerilla testing, I moved forward with my high-fidelity wireframe designs by creating a realistic prototype that closely resembles the final design of the project.
Conducted (2) rounds of usability testing with 5 participants in each round to see if my design solutions met the deliverables.
Here are some of the Key Findings & Redesign Iterations:

Add To Cart
Findings
-
Users can't continue shopping/browse
-
Add to cart icon led to the My Cart page
Iterations
-
Quick add to cart modal was added
-
Shopping bag icon has an indication to let users know the item was added
Recently Viewed Section
Findings
-
Users can't view recent items on the home screen
Iterations
-
Implemented a recently viewed section on the home screen

FINAL DESIGN + TAKEAWAYS

What I've learned?
-
Follow Project Timeline - I set a timeline for myself to accomplish design goals to have clear direction and priorities for my project. The timeline provided a simple visual overview of a project from start to finish which lead to increased work efficiency within the schedule constraints.
-
Review Design Deliverables - Remember to review your user flows to ensure that you’re not forgetting any navigational paths as this may take you longer to reiterate your final designs.
-
Detach Yourself From the Project - At the beginning of my design process, I lost sight of the target audience because I was too passionate about this project. I made design decisions that did not cater to the overall user experience and I quickly realized that during guerilla testing before creating wireframes.


