.png){kind=logo}
Click to view prototype
Duration: Two Week Sprint
Team: Solo Project (Conceptual project)
Client: Spice & Tea Shoppe
Role: Researcher & Designer
Overview: Over the course of a couple of weeks I undertook UI and research challenges daily. I struggled with ideating on different solutions that would best fix user pain points but in the end, everything came together and I was able to give users exactly what they were longing for. Keep reading to find out what I did to get there and what exactly it was that users felt they were missing.
Challenge: My challenge in this project was to take a pre-existing e-commerce website and redesign it to fix user pain points. Along with finding a way to make the user's experience when interacting with our product more enjoyable. I conducted research, defined the problem, and redesigned our website to better-fit user needs.
Goals entering research: Our goals are to understand the user’s perspective on likes and dislikes when going through our website this will help us to know how to reiterate our current design for better functionality to improve user interaction and overall allow us to meet business goals.
How will we do this?
-
Surveys
-
User Interviews
-
Contextual Inquries
Research process: I started off by creating a survey based on users' experience with e-commerce websites, in general, to better understand their expectations when shopping online. I then moved onto user interviews that centered around their experience with buying tea in person and digitally. I did this so I can understand what users want from this experience and what they hate from it. From here I was able to go onto contextual inquiries to see the pain points users are dealing with on our current website.
Affinity map takeaways:
-
Users want easy checkout
-
PayPal Option
-
Option for guest checkout
​
-
Users want information on the flavor profile
​
-
They want to see color of tea after steeping
​
-
Good product description
.jpg)
My research really surprised me. I had no idea how strongly people felt about the lack of experience they feel they have when buying tea online. Most people mentioned how they love to be able to smell the tea, taste it, and see the color of it after steeping. Due to COVID-19, they have had a difficult time experimenting with new tea as much as they would like since stores have been closed and users feel an absence of information on tea e-commerce sites. So the question is, "How can we fix this?". We start off by making a persona based on the information we've collected so that we can reach our target audience.
Meet Kyle
How might we help Kyle? After creating the persona I came together with a few other UX designers to collaborate on different ways we might be able to help Kyle with some of his frustrations. During the stage of ideation, we came up with some features to solve the pain points of users by making sketches to let our vision out. Here are some bullet points we came up with.
-
Question: HMW digitally allow Kyle to know the flavor profile of a tea before purchase?
​
-
Solution: Lips under the product image to show flavor profile
​
-
Solution: A way to customize tea to user likes and dislikes
​​
-
Question: HMW give Kyle the amount of descriptive information he wants without feeling overwhelmed?
-
Solution: Clock underneath product image to show the best time of the day to drink the tea​
Putting pen to paper! My favorite quote to carry out into this process is, "Sketch everything and keep your curiosity fresh!". Here is just a sample of a few sketches that helped visually bring my design to life.
Landing Page
Product Page
Product detail Page
User flows & Site map: After I conducted an ideation session I was able to make a site map and two user flows of our users using our MVP features. Here is what we came up with...
Site map
User Flow 1: Purchasing a product
User Flow 2: Customizing a tea
Designing & testing: Thereafter we were able to continue onto the next steps, which is designing, My favorite part! Here are some takeaways from the usability test from our grayscale prototype.
-
People wanted a notification to show up after putting something in the cart
-
People, want to have the checkout options such as “Guest Checkout” and, “Sign In” to have boxed drop-down buttons to help them understand that they are supposed to click it.
-
Add a review section and, add a quick summary description of the product in the cart.