Lemon
Responsibility
UI/UX Design · Product Strategy · UX Research
Scope
Concept pilot (no live retailer integration) for demo & testing
Team
1 designer (me) · 2 engineers
Timeline
Mobile focus · 8 weeks
Lemon bridges the gap between inspiration and execution — helping users move from “I want to cook this” to “It’s on the way.” The mobile app combines recipes and grocery delivery, allowing users to shop ingredients directly from the dishes they love.
In moderated sessions (n=5), Lemon reduced time-to-cart by 42%, improved address-step completion from 3/5 → 5/5, and cut tap errors by 71% after redesigning primary actions and tap targets.
Built as an early-stage startup concept tested among friends and home cooks.
PROBLEM
The cooking journey breaks between finding a recipe and buying ingredients.
People jump between apps, convert units manually, face out-of-stock issues, and lose clarity at checkout.
Evidence from Research:
Users needed two apps (recipe + grocery) to complete one meal.
Major friction occurred in recipe → SKU mapping and address form steps.
None of the 9 competitors (DoorDash, HelloFresh, Instacart, etc.) provided a seamless recipe-to-cart flow.
RESEARCH & INSIGHTS
Evidence: 5 interviews (45-60min) (busy home cooks ordering weekly) + heuristic/competitive review. Participants were home cooks ordering groceries weekly via Instacart or DoorDash.
Archetype 1 — Time-pressed weekday cook
JTBD: Place a grocery order in <2 minutes without hopping between apps.
Constraints: low energy after work, mobile-first, budget-sensitive.
Definition of success: ≤4 taps; predictable defaults.
Quote: “If I have to compare, I’ll just order takeout.”
Archetype 2 — Diet-conscious optimizer
JTBD: Control substitutes while staying within macros and budget.
Constraints: hates surprises at checkout; wants portion pricing.
Definition of success: visible price & nutrition deltas when swapping.
Quote: “Show me what changes if I swap — cost and calories.”
Core insights:
Users context-switch between recipe and grocery apps to finish a single meal.
The address step caused most drop-offs.
Users wanted inline deltas (price & nutrition) when swapping items.
GOALS & SUCCESS CRITERIA
A quick journey map made it obvious: the biggest friction lives between inspiration and action. People find a recipe, but then abandon it when the next steps become unclear. We framed our mission simply:
👉 Our goal: make it effortless to move from “I want this” → “It’s on the way.”
KEY SUCCESS METRICS:
Reduce time-to-cart by ≥40% (baseline: 2m 30s → goal: 1m 30s).
Improve task completion at checkout by ≥20 pp
Reduce mis-taps by ≥50%
Increase intent to reuse the app (NPS + 8 pts)
PRIORITIZATION
We used MoSCoW prioritization to align the product scope. Must-haves included automatic cart creation from recipes, ingredient-level personalization, and a frictionless checkout. Social features and community content were nice-to-haves — saved for future phases.
This prioritization helped align scope with available dev capacity and focus on high-impact use cases.
DESIGN STRATEGY
The design had to feel fast, smart, and trustworthy.
I built a tokens-first system with modular grids, reusable components, and consistent spacing.
Product cards were rebuilt with nutrition clarity and visible price deltas.
The address flow was reduced to one clear primary action and a 44 px tap target minimum.
Address Flow — Before / After
Problem:
Users repeatedly mistook “Add new cart” for “Save changes,” leading to failed address submissions and frustration.
The call-to-action placement didn’t match the user’s mental model — it looked like a confirmation button instead of an add action.
Solution:
Repositioned the primary CTA into a clearer context, renamed it to “Save address,” and visually separated the “add” and “save” flows.
Increased tap targets to 44 px and adjusted alignment for better scanning.
Impact:
Task completion rate improved from 60% → 100%
Zero mis-taps during testing.
Users described the flow as “more predictable and straightforward”
Product Card — Before / After
Problem:
Users struggled to tap small product cards and often missed the “add” button due to compact spacing and unclear hierarchy.
Price visibility was inconsistent, forcing users to double-check similar items.
Solution:
Increased card size and spacing to improve tap accuracy.
Simplified the price structure and added inline quantity control to let users adjust portions without leaving the main flow.
Impact:
70% fewer tap errors
Zero mis-taps during testing.
Clearer visual rhythm across categories.
TESTING & ITERATION
We ran moderated sessions with 5 users completing three grocery tasks — add from recipe, update address, checkout.
The redesigned flow improved overall speed, accuracy, and confidence.
Findings:
Clearer “Save address” button removed all confusion (100% success).
Larger product cards and inline counters improved tap accuracy (+70%).
Diet and portion filters received strong positive feedback.
Usability Metrics:
Time-to-cart ↓ 42%
Address completion ↑ 100%
Mis-taps ↓ 71%
NPS +8 pts | CSAT 67% | CES 92%
VISUAL DESIGN
The final UI system ensured visual consistency and efficient developer handoff.
I built a tokens-first structure that defined color, typography, and component styles across iOS and Android.
Each component family — from buttons to inputs and tags — followed the same modular pattern with semantic tokens for states and accessibility.
All components shared unified color and spacing tokens, enabling faster scaling and easy handoff through Figma variables.
FINAL RESULTS
In usability testing, Lemon demonstrated measurable improvements:
–42% time to complete purchase.
+20 pp task completion on address step.
–71% tap errors on form screens
Users reported higher confidence and ease of use.
These results validated our core hypothesis: combining recipes and grocery shopping reduces friction and improves satisfaction. The prototype was demoed to 10+ users and shared internally for potential pilot expansion.
NEXT STEPS
To grow engagement, we mapped future experiments:
Cooking streaks and gamification
Seasonal collections curated by food creators
Smart restock reminders
A/B tests for upsell bundles and personalized recipe packs
REFLECTION
Lemon wasn’t just about designing a UI — it was about rethinking a daily habit.
I learned how to balance clarity and delight, and how to design for both the intentional and the impulsive.
Helping people skip friction and get things done — that’s where design creates value.
