NoAllergy
Awards
Nominee of 2022 Unblock Design Jam: Unicorn Designer
(Taiwan)
Work
UX/UI Design
Tool Used
Figma
Miro
Date
2022
Challenge
Food allergy is a public health issue in the many countries. There is no cure for food allergy. Avoiding the allergenic food is required to prevent a reaction. We decided to design a product that can assist in mitigating or addressing food allergies in a 2-week hackathon.
Solution
We built a website extension for allergies call "NoAllergy". That allows users to avoid allergens while shopping online, getting a healthier life.
Research & Planning
Among the topics referring to SDGs, We were most interested in good health and zero hunger issue.
During the discussion, we found that most of our friends who pay attention to diet are due to diseases or health factors, so we decided to conduct an in-depth investigation from one of the directions—food allergies.
During the investigation, it was found there are approximately thirty-two Million People in the United States have food allergies.
And the Centers for Disease Control & Prevention report that between nineteen ninety-seven to nineteen ninety-nine and two thousand and nine to two thousand and eleven, food allergy prevalence among children increased by fifty percent. Even U.S. families spend twenty-five billion each year caring for children with allergies.
We also found a report that said more than half of all cases of anaphylaxis or food allergy reactions featured in a new study occurred after the consumption of products that failed to contain any allergen warning labels.
Based on these surveys, we hope to design a product that can assist in mitigating or addressing food allergies.
So we build a website extension for allergies call "NoAllergy".
That allows users to avoid allergens while shopping online, getting a healthier life.
We care most about someone whose family members have allergies and he or she is responsible for buying food for the family through online shopping.
For example, this is Joanna, she is a career woman, and she also has two kids who are seriously allergic to nuts and gluten.
The problem is that when she buys food, she needs to pay more attention to checking allergens for two kids and finding related information on shopping websites for a long time.
What if she was able to know food's allergens more quickly? Now she can with NoAllergy.
You can set up your family member's allergens first. NoAllergy will detect and label food allergens based on your setting while shopping online.
Now, when Joanna wants to buy allergy-free food for her two kids, she can turn on Noallergy.
NoAllergy is a website extension for allergies.
We make money by charging to new users, cooperative merchants revenue share, and advertising fee.
Our target customers are who want to avoid their allergens while online shopping.
Our current partners are online shops and healthy food stores.
Our costs are the labor costs and the allergen database.
These are our interview questions for people who have allergies and doctors. We prepared the questions based on personal details, motivations, frustrations and interactions.
And we also used user journey to take note on the buying behaviors of people who have allergies. We noticed that both of them will check the ingredients for a long time.
Base on the research, we built a persona.
We collected findings into the user journey chart. Joanna's shopping journey includes four stages. We found that she is not sure if food will trigger her kid's allergies when she start shopping. During shopping, she was difficult to go to the ingredient section directly and not easy to read the texts of food ingredient. After receiving and tasting the food, she wanted to record what kind of food will cause allergic symptoms for her kids.
In analogous location fieldwork, we went to two organic store. We found that there were lots of clearly indications for allergens and there were some posters for showing cooking methods.
Ideation
We began brainstorming solutions with Post-it notes. As a result, we generated more than one hundred and twenty-eight ideas.
After analyzing the feasibility of our ideas, we finally chose the coolest and the most innovative idea which is “browser extensions”.
According to the matrix, the first two direct competing products have an allergen warning function, but they cannot record multi-user and cannot be used worldwide. The partial competition, FamilyMart in Taiwan does not have the function of allergen warning based on users allergens. Users just can only find out food allergens by the search function.
In addition to competing products, we also found a reference, "Shopback" with similar interaction for detection and reminder but it targets different user groups.
Product Development
To validate the first version of the prototype, we have three goals for usability testing.
First, we checked if users can set up members' allergens easily through the cognitive walkthrough. Second, we checked if users activate our product successfully through the cognitive walkthrough. Third, we checked if the notification for allergens is understandable by online hallway usability testing.
Final Design
We generated this user flow. First users can read the introduction about NoAllergy on the landing page. There is a call-to-action button guiding users to add NoAllergy to their google chrome. After registering, users can set up members and their allergen-related information. When they open a shopping website, they will see a pop-up for activating NoAllergy. NoAllergy will detect any allergens by showing reminder users notifications at every step during shopping.
Lets say Joanna wants to buy snacks for her two kids, Alice and Ray. First, she signs up with her google account. She inputs Alice and Ray in the members section. For Alice, her allergens are crustaceans and gluten and she wants the system to recommend alternative food based on similar nutrition. Then she also set up Ray's allergen-related information.
After finishing the setup, she can see the overview of allergens information for her two kids on the account page of NoAllergy.
Branding
The brand colors are green and orange which are related to nature and food. The brand typeface chooses a sans-serif font. it creates a warm and lively style.
NoAllergy is a website extension that can record the allergens for members and label food allergens based on settings while shopping online. It helps people to avoid allergens and get a healthy life.
Design System
Future
