SnackSwap
Web Design
Role
UX/UI Designer
Tools
Figma, Google Forms, Illustrator
Focus
User Research, Wireframes, UI Design, Prototyping, Usability Testing
Timeline
3 Weeks
.png)
The Problem
Busy people with dietary restrictions often feel limited by traditional snack subscription services. These services usually offer pre-set snack boxes with minimal customization and poor ingredient transparency. This leads to canceled subscriptions and wasted snacks.
The Goal
Design a personalized snack delivery experience that allows users to:
-
Set dietary preferences during onboarding
-
Browse and filter snacks by category and nutrition
-
Swap items before checkout
-
Track deliveries and rate snacks to improve future boxes
Target Users
Brenda (Busy Mom) – Needs quick, healthy snacks for herself and her kids
Frank (Fitness Buff) – Wants protein-heavy options that match his diet
Mia (Mindful Eater) – Prefers vegan, organic, low-sugar treats
User Research
I conducted 5 interviews and surveyed 30+ snack box users. Top pain points included:
-
Limited control over what's in the box
-
Lack of transparency around allergens
-
Hard to discover new snacks that match dietary needs
User Journey
I mapped the experience of “Brenda” — from discovering SnackSwap to customizing and completing her order.
Wireframes
Based on user feedback, I designed eight core wireframes.
-
Welcome / Sign In
-
Set Dietary Preferences
-
Choose Snack Flavors
-
Browse Snacks by Category
-
View Snack Details
-
​Snack Box Preview + Swap
-
​Checkout & Delivery Summary
-
Rate Snacks / Feedback
Design System & Branding
Usability Testing
I tested a clickable prototype with 4 users. Feedback included:
-
"I love the swap feature — it’s exactly what I need!"
-
More visible nutrition info per snack
-
Add a “Surprise Me” button
What I improved:
-
Clarified ingredient labels
-
Added allergen filters
-
Highlighted user ratings in the swap screen
Final Takeaways
SnackSwap helped me grow as a designer by challenging me to:
-
Design for user customization and flexibility
-
Balance branding with real-world usability
-
Prepare designs that are scalable and development-ready
