Mother Earth
It is a Toronto e-commerce that sells Fashion bags made with ecological and recyclable materials.
Overview
Mother Erth is an e-commerce that handcrafts fashion bags with recyclable materials, such as plastic, they have a wide variety of designs and limited editions that can be purchased from anywhere in the world
Project features
- Users must be able to add to shopping cart products or pay inmediatly
- Users must be able to view product categories
- Users must be able to navitage through the product catalog
- Users must be able to view prices, product details, dimensions, faqs, bag impact
- Users must be able to checkout without sign in or account creation
- Users must be able to view product gallery photos
- Users must be able to order write note for special occasion
- Users must be able to select wrap the product as a gift
Customer experience goals
- Buy products, the simplest without problems
- Buy products without registering as a new user or creating an account
- Choose payment options during the purchase process
- Obtain all the detailed information of the product in the purchase process
- See the price of the products from an initial stage of the purchase
- See product reviews
- Choose to send a personal note or wrap the product as a gift
- Having options for delivery and deliver time
What I did
- Stakeholder interview
- User interviews
- Setting goals and objectives
- Persona
- Scenarios
- User journey
- User flow
- Creating wireframes
- Low fidelity prototypes
- High fidelity prototypes
- Interactive demo presentations
- Competitive analysis
Discovery research / Findings
- Users could not select categories, causing it to take time to find the products
- Users can only select one payment method
- Users have to sign up to be able to make a purchase
- Users can only view one photo of the product, even in the product details
- Users cannot add congratulatory notes to the product
- Users cannot buy the product and have it wrapped as a gift
- Users can't find product details
- Users need to sign up before finalizing the purchase
- Users cannot make an express payment
- Users only have one shipping option, without telling me how many days it takes
- Users encounter a discount pop up window at checkout
Competitive analysis
Findings
I conducted a competitive analysis to methodically identify redundancies + opportunities. Our competitors had:
- Pop-up windows appear during the purchase process
- Product titles are confusing, looks like a button
- Product details small and not very descriptive
- Not showing delivery estimate or options
- Not showing payment options
- Large forms to finish the checkout
- Limitations on shipping options
- Mandatory sign up to check out
Affinity Diagram
Affinity diagram helps me to gather large amounts of data and organize them into groups and themes based on their relationships. This process is a good resource in order to group data gathered during research or ideas generated during Brainstorms
Synthesis
Having our research and information i synthesized information Creating persona in order to know the person who is going to use our product and next to the team we start to write the ideas we consider should have our development
Persona
Persona are fictional characters wich was created on our research in order to represent our user. Persona help us to understand user needs, experiences, behavior and goals
User Journey Map
The user journey map allowed me to visualize the process that a person goes through in order to accomplish a goal in this case the process the person goes through to get a flower bouquet for a relative or significant person
Guiding Principles
User must be able to complete a checkout after he select a product
Customer Journey
Scenarios
User scenarios help to show how users might act to achieve a goal in a system or environment. Make me understand users motivations, needs, barries and more in the context of how they would use a design app, and to help ideate, iterate and usability-test optimal solutions. In this case we have 1 scenario
User wants to buy a product and checkout
User Flow
I created a user flow that takes them from their entry point through a set of steps to a successful outcome and final action
Sketch
With a paper prototype, We could test early design ideas at extremely cost. We fixed problems before to start the wireframe process. This is the first approach to the problem that allowed me to change and define the user interface architecture
Wireframes
Wireframing as low-fidelity prototyping allowed rapid iterative in order to usability test and get insight early and get problems early
Testing findings
- Users need to see information filters in the product catalog
- Users got confused with the button inside the image in categories
- Users need see from the beginning the materials of the products are ecological
- Users need to have express checkout
- Users need to know delivery estimate
- Users need to have a share option
Mockup high fidelity
This is an integral part of the design process, it allows us to turn a vision into something tangible in order to test our hypothesis with real users. Also allows experimenting and explore various approaches to an idea before selecting the one that is most valuable both from a business and user standpoint. The goal is to ensure that their product satisfies the user`s needs. Prototyping allows us to explore and validate ideas before investing too many resources
