Creating a home fermentation e-commerce concept
Context
The Project Design a mobile-first website that connects visitors with home fermentation tools and advice. This project was part of my UX coursework at the School of Visual Concepts (SVC).
Duration Mar. - Sept. 2020
Sole Designer UX Research, Wireframing, Interaction Design, Prototyping, Visual Design, Usability Testing
Project Inspiration
How Do I Make Sauerkraut Without Poisoning Myself?
Beginner fermenters ask a LOT of questions. That’s one of the many commonalities I noticed while interviewing the “fermentation-curious” for my School of Visual Concepts coursework. As a student, I designed an ecommerce concept that can connect the newly initiated with home fermentation supplies and advice. My concept was inspired by my own interest in fermentation and my discovery that existing sites don’t cater to beginners.
Opportunity Bubbles Up
Based on my user interviews, I learned beginners want a home fermentation site with approachable language, digestible how-to content and high quality visuals. They need resources that make them feel confident and capable in their abilities.
A great beginner fermentation site needs to help users feel comfortable with the learning curve.
Brewing An Approach
Part E-Commerce, Part Advice Column
I evolved my concept from “there should be a better site” to an interactive prototype by working through understanding user needs, designing for versatility, and testing for discoverability. I knew at the outset that my site should ease-in beginners and be versatile enough to encourage return visits. I envisioned an ecommerce site that sold supplies and provided fermentation advice with recipe inspiration.
I believed that beginner fermenters would have unique needs and motivations when planning a fermentation project than those with more experience.
Foraging Data
Competitive Analysis
I looked at existing home fermentation sites to understand the problem space. It was surprising to find that even top sites used confusing jargon and were difficult to navigate.
I also did benchmarking of established retail sites that included a robust advice section. I wanted to explore best practices for easy navigation between the advice and shopping pages. Looking through sites like REI and Home Depot, I saw how creating multiple points of entry between sections makes a more fluid user experience.
User Interviews
To understand my target user, I conducted semi-structured interviews with five participants who ranged in fermentation experience level from novice to expert. Analyzing the data showed my hypothesis was correct: novices had specific needs that differed from more experienced users.
Beginners need:
Clear guidance and assurances on safety within fermentation instructions
Simple and quick project suggestions
Tools that are affordable and are multipurpose
Card Sort
Rounding out my research, I conducted an open card sort with 15 participants. I wanted to understand how users think about my site content to inform my site structure. The results showed most users focused on three large groupings: beginner basics, recipes and supplies.
Card sort dendrogram showing the most common category clusters
Personas
Novices are fearful about food safety and are more likely to have a specific food in mind when starting a fermentation project. They are hesitant to invest time or money into a project without assurances that it will be worthwhile.
Beginners and advanced users were more likely to take risks when selecting a project.
User personas
Stirring Up An Intuitive Experience
Site Structure
I kept my initial designs simple to focus on ease-of-use and fluid navigation.
Site Structure Shallow navigation with three main categories that helps users quickly orient to the site.
Wireframes
Homepage: users are greeted with a hero image linking to the "getting started guide" and a carousel of best selling products.
Recipe Category Page: users can use multiple filters to narrow down recipe results. Sort allows users to prioritize either "most popular" or "most recent."
Recipe page: users are shown a how-to video for the chosen recipe as well as written instructions. Contextual nav gives user options to see related products and related info pages.
(Taste) Testing My Design
Usability testing
While developing my prototype, I wanted to understand how users would navigate between the three sections. To get quick, preliminary insights I used a competitor site that has a similar structure to conduct usability testing. This allowed me to incorporate findings into the prototype as it was being developed.
The usability tests helped me identify user pain points with navigation when there was insufficient landmarking.
Findings:
Landmarking across the site was insufficient
5/5 participants become disoriented while navigating between the product pages and advice pages
Several participants shared they wouldn’t be able to retrace their steps
I used the usability insights to iterate on the landmarking in my own designs. I added bolder page titles and breadcrumbs.
Changes made to designs after usability testing including making page titles more prominent.
Et Voilà!
Outcome
I concluded my concept “Fermake” with a desktop prototype of key features. My research helped me evolve my design to provide users of all ability levels a “choose your own adventure” experience. The clear landmarking, shallow navigation and bold visuals invite users to freely explore and find content that suits their unique fermentation interests.
Next Steps
If I were to continue developing my concept, I would:
Conduct usability testing on my desktop prototype to evaluate how easily users can discover key information. Are users able to navigate between the recipe/how-to pages and the product pages? What pain points, if any, do users experience while browsing recipes?
Prototype and test my mobile designs
Continue to iterate on my design informed by usability findings