Mineral Springs Trading Co.
Mom and Pop Artisan E-commerce Platform
Mineral Springs Trading Co. brings the magic of their brick-and-mortar boutique online!
This e-commerce website is your one-stop shop for over 100 unique treasures, from beauty and bath products to inspiring cookbooks. Think "frivolities and essentials for an art-fueled life," curated especially for you.
I was making it easier than ever to bring that art-fueled feeling home. The improved website and mobile app offer a smooth and enjoyable shopping experience, with clear navigation and a user-friendly journey.
Role: UX/UI Designer
Duration: 2-week sprint
Tools: Figma, Adobe Creative Suite, Unity, Pen and Paper, Miro, Google products
Methods: Agile, Lean
ROADMAP TO SUCCESS
To understand our ideal customer better, we talked to 9 amazing women aged around 45. We discussed their shopping habits, lifestyle preferences, and online shopping experiences.
By analyzing their insights, we created a roadmap to success! This roadmap, called an Affinity Map, helped us identify key trends and tailor the Mineral Springs Trading Co. website to their needs.
Here's what we learned: Shoppers are getting frustrated! Our website navigation is confusing, the checkout process is buggy, and product listings are inconsistent. We need to fix this!
By understanding what matters to our customers, we can create a website that's not just a shop, but a delightful shopping experience.
Persona
"I like handmade items. Particularly when the artist has a story behind them. I can support that"
Problem Statement
Mineral Springs attracts eco-conscious shoppers looking for unique items, but their website makes it difficult to find what they need. Frustrated customers end up going to big-box retailers for a smoother shopping experience.
How Might We:
-
HMW make browsing and checkout so effortless that eco-conscious shoppers can find and buy unique gifts from Mineral Springs with zero frustration?
or
-
HMW design a website experience that celebrates the unique treasures of Mineral Springs and makes it easier than big-box retailers for customers to discover and purchase them?
From F to Z Wireframe
I utilized the "F" and "Z" page structures to keep users (such as Alice) engaged.
Multiple hand sketches, Figma mock-ups, and usability tests informed the best solution.
Home page
Item page
Your cart
Observations
I streamlined the website navigation based on user feedback!
Here's what users loved:
-
Clear and easy navigation:
-
I implemented a top navigation bar with a well-organized dropdown menu (based on card sorting) to make finding items a breeze.
-
-
Search bar for convenience:
-
We added a search bar for users who know exactly what they're looking for.
-
-
Informative shopping cart:
-
A clear pop-up box displays cart contents, allowing users to easily add or remove items and proceed to checkout seamlessly.
-
Based on user feedback, we toned down the design:
-
Subtler visuals:
-
We replaced overly large photos and banners with a more streamlined aesthetic.
-
-
Reduced scrolling:
-
We optimized the checkout page to minimize scrolling, making for a more user-friendly purchase experience.
-
Outcome and What's Next
-
Reiterate Mid-fidelity
-
Rework the "Artist" feature section
-
Consider the addition of Log-in for customer loyalty programs
Empowering Women's Style in a New Era !
The world is changing, and so is women's fashion! After a period of isolation, women are reclaiming their personal style and rediscovering the joy of dressing up. But with busy schedules and evolving needs, figuring out what to wear can feel overwhelming.
Introducing M(i) Warbrode!
This mobile app concept tackles the post-pandemic fashion conundrum by offering a personalized and customizable clothing experience.
Here's what sets us apart:
-
User-focused approach: Backed by in-depth user research and usability testing, our clickable Mid-fidelity prototype prioritizes a user-friendly experience.
-
Customization is key: We understand that one size doesn't fit all. Our app empowers women to create unique looks that reflect their individual style and needs.
Role: UX/UI Designer
Duration: 2 weeks
Tools: Figma, Adobe Creative Suite, Zoom, FigJam, Microsoft products, Google Onedrive, Cell phone, Pen and Paper
Methods: Agile, Lean
Getting to the root of the issue starts with the inquiry.
What are your shopping habits?
What is your daily and weekly flow- Ex: Wake-up?
Where do you shop for clothes online?
What apps have you used for a similar feature?
What is the ideal time that you like to take to get ready?
How many pieces do you wear?
What are you seeking to find when you go shopping online?
What amount of money do you spend on your clothing every month?
Rate words and feelings 0-10- Stylist, wardrobe coordinator, dresser, personal shopper.
Discover the User
User Journey
User Feedback
Useability tests were conducted on both low and mid-fidelity.
“App is really easy to use and navigate.”
"Like the option of uploading my own photo."
"Clean and Clear to understand what app was about."
What's next?
-
Flush out the pain points of the mid-fidelity prototype.
-
Brainstorm on having a “HOME” page. test out the home page.
-
Create an integrative cloud base service