NoAllergy

Shopping safely with allergies.

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.

Role

UI/UX Designer

Type

Competition Project

Tools

Figma
NoAllergy extension shown on a shopping website

Problem

People with food allergies struggle to safely identify potential allergens when shopping online, where ingredient information is often hard to scan, inconsistent, or buried in product details. This uncertainty increases anxiety and the risk of accidental exposure, limiting their confidence in everyday purchasing decisions.

Solution

NoAllergy is a browser extension designed to help people with food allergies shop online more safely. It identifies potential allergens in real time, allowing users to avoid risky products and make healthier, more confident purchasing decisions.

Function01

Multi-user integration

NoAllergy enables families to manage multiple profiles under one account. The extension automatically scans products against each saved profile and flags risks accordingly.

NoAllergy multi-user integration screenshot

Function02

Rapid detection of allergens

NoAllergy identifies potential allergens in products and recommends safer alternatives, help users navigate their purchasing journey with clarity and confidence.

NoAllergy rapid allergen detection screenshot

Research

Finding food that's actually safe to buy still feels like guesswork.

Food allergies are becoming an increasing health concern across the Asia-Pacific region. Studies show rising prevalence in several Asian populations, including Taiwan, where food allergy rates increased from 7.7% to 10.4% among children and adolescents and from 6.4% to 12.5% among adults. The region also presents distinct allergen patterns, with shellfish playing a particularly significant role in many Asian populations.

This research aimed to understand how people with food allergies navigate everyday food decisions, from searching for suitable products and interpreting ingredient labels to assessing risk and managing uncertainty before making a purchase.

Affinity Mapping

NoAllergy affinity mapping research synthesis

User Journey

NoAllergy user journey map, new user NoAllergy user journey map, returning user

User Flow

NoAllergy user flow diagram

Design System

NoAllergy design system: colors and type

Final Design

NoAllergy final design, Google search with allergen popup NoAllergy final design, shopping site with allergen popup
NoAllergy final design, full flow screens