UX case study · Group project
Making sugar easy to read
A snack-label scanner that turns confusing sugar numbers and big health claims into a clear answer, right when you are choosing what to buy.
Group project · Designerrs Academy · Built in Figma Make
My role
This was a team project, but each of us owned some parts. Here is what I did.
I conducted two user interviews, built my own affinity map and first personas, then fed into the team synthesis, final personas, journey maps and ideation.
I independently built the user flows for each persona, merged them into one Master User Flow, and wrote the Product Requirements Document.
I took the final product design forward in Figma Make, from the first idea to the high-fidelity screens.
The problem
Have you ever checked the sugar on a packet of chips or biscuits and still not known what the number means? Serving sizes, percentages and claims make a clear picture hard.
A number like 12g says how much, but not whether it is okay for me.
Glucose syrup, dextrose and maltodextrin are not always seen as sugar.
“Natural” or “Low fat” makes a product feel healthier before the label is read.
Secondary research
We looked at how sugar information is shown, how people read it, how marketing shapes perception, and whether existing apps already solve this.
One Indian study found 81% of label readers mainly checked the expiry date, not nutrition.
Research on sugar labels found confusion around total and added sugar, and that front-of-pack warnings improve understanding.
Existing apps focus on calories, or have gaps in Indian packaged-product data.
We studied sugar trackers, diabetes apps, calorie trackers and barcode scanners (Suglog, Sugcut, mySugr, Glucose Buddy, MyFitnessPal, Cronometer, Fooducate, NHS Food Scanner, Yuka and more). None combined barcode scanning, a sugar-specific score and claim checking in one place for Indian packaged products.
Research
I interviewed two people: one became sugar-aware after being told they were prediabetic, the other already tracked nutrition for fitness.
Label-reading habits, how they read sugar terms and serving sizes, how claims shape their view, and what tools they use.
I grouped my own notes first. The team then merged every interview into one map with ten categories, from user pain points to trust and verification needs.
It moved us from single stories to shared patterns about how people judge sugar in snacks.
The information exists. The challenge is making it understandable, trustworthy and useful at the moment of decision.
Who I designed for
Three people, three reasons to care about sugar, one shared problem.
“12 grams. Is that okay for me?”
Became sugar-conscious after a health scare. She now reads labels out of necessity, not habit.
“I just want a safe choice for everyone at home.”
Shops for a whole family and wants every choice to be safe for each of them.
“Give me the sugar number, fast and exact.”
Already tracks macros as part of his routine and wants sugar to fit into decisions he already makes.
Their journey
The lowest point is reading and judging the label. That is where TrustBite has to help first.
Hopeful · Curious
Pain Wants a healthier snack but not sure where to start
Idea Barcode scanner with a health summary
Hurried · Doubtful
Pain Finding the right sugar information takes effort
Idea Scan once and get the answer
Confused · Overwhelmed
Pain Cannot tell if 12g of sugar is a lot
Idea Traffic light rating and plain language
Frustrated · Unsure
Pain Hard to compare products and trust claims
Idea Claim vs. reality checker and comparison
Cautious · Confident
Pain Not sure the choice suits them
Idea Suitability per person and better alternatives
Despite different motivations, all three met the same friction: finding information, understanding sugar content, comparing products and feeling sure about the final choice.
Ideation
We turned the research problems into questions, then grouped the ideas into three parts that became the final design.
Traffic light sugar rating, sugar score, plain-language translation and regional language support.
Claim vs. reality checker, verified health badge, product comparison and suggested alternatives.
A barcode scanner that gives a health summary in seconds.
Product requirements
I turned user needs and ideas into five requirements in the PRD.
Final design
TrustBite brings product information, sugar insights, claim checking and personalised suggestions into one experience.
“What’s really inside your food?”
“Is this snack really what it says?”
“Is this right for my family?”
“Show me something better.”
Design choices
A deep navy and warm ivory base for credibility and calm. Sage green, amber and red carry the traffic light logic through every screen.
Sage green Safe for you.
Amber Use caution.
Red Avoid.
Each result opens with one clear verdict and a confidence score. The detail follows, so nobody has to decode numbers before getting an answer.
The home screen leads with a single big action, Scan a Product, and the scanner sits in the middle of the navigation bar on every screen.
Headings · Manrope SemiBold
Body text · Inter Regular. Manrope’s rounder, confident headlines pair with Inter’s clear body text, because so much of this product’s job is making dense nutrition data easy to scan.
Takeaways
This was a group project across research, synthesis, ideation and product design. My own work centred on research, persona-based flows and the final product.
Individual research became a shared direction, and flows and a PRD connected it to the screens.
A number alone does not help. A clear verdict does.
Verifying claims is as important as showing data.
Information is only useful when people can understand it and act on it.
Why first. How second.