PROTEINMATTERS

Storefront design package · v2

Rebuilt on a researched corpus of real food-ecommerce patterns (Factor, CookUnity, Amazon Fresh slots, Baymard checkout research, Indian health-food DTC), with the user flows adversarially reviewed before a single screen was drawn. Start at the flow map, or click straight into a journey.

Open the flow map Enter the store

Flow 1 · À la carte pre-order

01

Home

Landing: hero, menu preview, how it works, plans teaser, FAQ, first-visit welcome

 02

Menu

The shop: search, category chips, sort, protein + kcal on every card, sold-out state

 03

Item detail

Gallery, macro strip, ingredients & allergens, fresh-vs-stackable note

 04

Cart

Instant totals, free-delivery progress, cross-sell, empty state
05

Checkout

Accordion: address → slot (24h cutoff live, options A/B) → payment with guest gate; UPI-pending + confirmation states

 06

Weekly plans

Tier pricing, credit builder with depleting meter, drops, windows, dated start

 07

Account

Wallet + ledger, order tracking, plan management with Thu 6 PM cycle, addresses

 08

Sign in

Google, Apple, phone OTP first; email fallback

Decisions still open

  • Slot density: options A (3 windows/day) and B (6) sit side by side in checkout step 2.
  • Consolidation bonus value: wired into the plan flow, amount marked as being calibrated.
  • Photography: tinted placeholders throughout; add a Fal key in Settings → AI Providers (or drop real shots into assets/) and they can be swapped in.