GLUTEN FREE BITE
PROBLEM
People with dietary restrictions need a quick and easy way to find bread free of their personal allergens at the local bakery online.
WHAT I LEARNED
Competitors do not make it easy to find allergen information on their websites.
SOLUTION
A responsive website that is equipped with an informative menu and filters to sort out allergens — everything users need for a safe shopping experience.
TOOLS
RESPONSIBILITIES
ROLE
Sole UX/UI designer
DURATION
Jun — Jul 2022
LACK OF ALLERGY-FRIENDLINESS
Allergic individuals often turn to online resources to discover safe food options. However, existing resources can be less than ideal in terms of user-friendliness, and, at times, they even complicate the shopping experience. This can be due to issues like incomplete ingredient listings or unstructured presentation of information.
OBJECTIVES
To understand:
how target users currently buy products including bread;
what pain points they have along the way;
what users need to make this process easier.
METHODOLOGIES
Secondary reseach
Personal experiment
User interviews
Competitive analysis
Contextual inquiries
KEY LEARNINGS
Looking for personal allergens takes 80% of users' shopping time.
When shopping online, users can't find product information that is crucial for decision making.
Users don't trust businesses that can't articulate why they care about allergic people.
THE FOOD ALLERGY EPIDEMIC
The number of people with food allergies is growing fast. One allergy usually comes along with more. The top nine food allergens — milk, egg, wheat, fish, shellfish, peanut, tree nut, soy and sesame.
KEY FACTS & NUMBERS
85 milion
Americans living with life-threatening food allergies and intolerances
377%
Increase in treatment of diagnosed anaphylactic reactions to food between 2007 and 2016
Every 3 minutes
A food allergy reaction sends someone into the emergency room
TESTING ON MY OWN SKIN
I interviewed 6 people (and read 100+ online reviews of people) who previously adopted through pet adoption apps and weren't happy. My goal was to understand user behaviors that lead to wrong choices, how the existing technology is being used and what frustrations arise on the way.
Takeaways:
it takes forever to read product ingredients;
nobody cares about your allergies but you;
bread makes life easy and happy;
being able to hear from peers is refreshing.
ASKING PEOPLE OUT THERE
MOST COMMON BEHAVIORS
100% of my respondents buy a product only after studying its ingredients
80% have family members on different diets
60% find groups of people with same interests to stay updated and supported
60% want to know the story of the business and shop from businesses whose founders are allergic/on diet
WHAT QUALITIES DO MY USERS POSSESS?
Well informed
They are highly educated on food allergies and expect you to know even more
Cautious
76% of target users carefully study labels before puchase
Loyal
64% of target users keep buying the same product they once found safe
Trust small
They prefer so support small businesses with a mission to promote awareness
Premium byers
32% of target users are ready to pay more for quality ingredients
Curious
They are always on the lookout for new great products
READING EVERY LINE, EVERY DAY
The biggest pain point of people with dietary restrictions is time. They have to read labels on each product in their basket to make sure there's no allergens. Many bakeries do not provide ingredients for their baked products at all.
"There’s no such thing as doing a quick shopping trip. When you’re at the grocery store, you’re at the grocery store for a while".
INTERVIEW TAKEAWAYS: USER PAIN POINTS
Time
Finding and studying ingredients takes 80% of shopping time
Users have to read whole menu to find safe product
It takes time to travel to sometimes the only GF bakery in town
Users can't pre-order to save time
Information
Many small GF bakeries don’t have websites
GF bakeries don't have menus and photos of products
GF bakeries don’t provide lists of ingredients
Quality
Trust
Users don't trust businesses that aren't knowledgeable about food allergens
Users are afraid of cross-contamination
Users can’t see if bakery is trusted by their community
DO COMPETITORS HELP?
Not really. Most gluten-free bakeries do not publish lists of ingredients and food allergen information. Users spend a lot of time reading all menu entries to determine safety.
Chaos!
No ingredients at all
Would be great to only show "egg free"
You need to study every item's ingredients list
Assumption: users need a way to filter through menu entries by ingredient/allergen.
HOW LONG DOES IT REALLY TAKE?
I asked a user who is allergic to gluten and nuts to visit all of the above mentioned 7 competitors' websites and find the first safe item. None of the competitors provided a smooth stress-free experience.
PROBLEM STATEMENT
Users need a quick and easy way to find and buy safe bread in the local glute-free bakery.
HOW MIGHT WE?
How might we help users save time while searching for allergen-free and vegan bread?
How might we help users trust this bakery?
Based on the findings from user research and competitive analysis, I wanted Gluten Free Bite's users to be able to do the following on the website:
Browse menu
See bread selection and
prices
Filter menu
Remove breads containing personal allergens;
Sort by diet
See bread info
Read bread ingredients list; See allergen alerts
Connect
Explore bakery's story;
Learn about their mission
and values;
Connect to peers
Contact
Find contact details
for quick order placement;
Find address
for in-person visit
Order delivery
Use third-party
website to order bread
delivered to your door
My goal was to create a simple and intuitive navigation with all the crucial navigation elements in direct sight, so that users could complete an order flow within a minute.
TESTING INITIAL CONCEPTS
TASK
I wanted to see whether users understand the navigation and whether the protoype is overall usable. During moderated usability study users studied the menu and ordered one safe bread
OUTCOMES
4 out of 5 users thought opening ingredients as overlay was inconvenient.
3 out of 5 users found the menu layout cluttered.
5 out of 5 users didn't understand why "Add to order button" led to a third-party site.
CHANGING SOME LAYOUTS
FINAL DESIGNS
TRUST STARTS WITH SEEING THE RIGHT INFORMATION
Homepage is the face of the business and it can gain your customers' trust within seconds. It includes the most important information a user wants to see on a bakery's website — contacts, menu, how to make an order. To meet the needs of health-conscious people and save their time I added easy access to menu and ingredients on navigation bar. Company's mission and customer reviews help gain more trust.
FILTERING MAKES IT EASY (AND QUICK!)
Menu page is equipped with filters which users can apply to remove personal allergens or view bread compliant of their diet. Bread cards provide high-quality images, lists of ingredients for each item and allergen warnings — all of that allows to make informed and safe choices.
TIME CAN BE SAVED!
5 users to completed the flow of finding the first safe product for a nut-allergic person. They also browsed the website and provided feedback on whether they would trust and shop at this bakery.
View prototype
