KiranaPro · AI voice & hyperlocal commerce

Speak your grocery list. AI builds your order.

A voice-first shopping experience for local kirana stores: say what you need, get a structured cart, and watch your neighbourhood store pack and deliver it — live on the map and on your Dynamic Island.

Role
Product designer
Focus
AI voice UX · interaction
Context
10kdesigners assignment
Platform
iOS
“2 kilo tamatar, bhindi, haldi…”
AI listening screen AI-created shopping list
At a glance

Typing a long grocery list is tedious — and once you order, the wait is a black box you keep reopening the app to check.

KiranaPro lets you speak the list, routes it to nearby kirana stores, and turns the wait into a visible journey on the map and the Dynamic Island.

Outcome · A concept prototype covering voice-to-cart, live store responses, four order states and an iOS Live Activity suite.
10kdesigners assignment — a concept, not a shipped product.
Role
Product designer
Platform
iOS
Users
Urban customers · kirana owners · delivery riders
Delivered
Brief & MoSCoW · voice flow · store-selection map · order states · Dynamic Island suite · visual system
Add timeline and toolsHow long the assignment ran and what you used.
Stop 1 · The product

AI voice lists, fulfilled by the kirana next door.

Speak naturally; the assistant parses your speech, builds a structured cart, checks live inventory at nearby stores and places the order.

Instead of dark-store monopolies, KiranaPro routes orders to trusted neighbourhood kiranas — hands-free convenience that keeps commerce local.

Speak naturally, let AI build your cart, and watch nearby kiranas fulfil in real time.

AI voice inputAI cartKirana respondsLive tracking Speak your list naturallyStructured, curated itemsNearby store accepts & packsHyperlocal delivery en route
Objective 01 · Speak & build

Turn spoken words into a clean, itemised cart instantly.

Objective 02 · Connect & map

Broadcast the order to nearby kiranas and show confirmations on a live map.

Objective 03 · Dynamic Island

Use Live Activities so tracking continues outside the app.

Stop 2 · Reframing

The wait is usually invisible. What if it was the experience?

TYPICAL DELIVERY APP Place order static wait screen · reopen app · reopen app · reopen app… Delivery KIRANAPRO CONCEPT Place order Stores respond Preparation Dispatch Delivery

Designing for everyone in the chain

GUPTA KIRANA “2 kilo tamatar, bhindi, haldi…” ACCEPTED ✓ DELIVERED ✓
  1. Speak
  2. Send to store
  3. Pack
  4. Deliver
Three people share one order: the customer speaking a list, Gupta ji packing it, the rider carrying it the last kilometre.
Urban customers

Fast, understandable, reassuring delivery with transparent status.

Kirana stores

A simple way to receive and pack digital orders alongside walk-ins.

Delivery & operations

Order state and pickup points that stay clear and predictable.

Add the store-owner sideOne or two screens for how Gupta ji accepts and packs an order — even rough wireframes. assets/v2/kirana/store/
Stop 3 · MoSCoW

A tight prototype, focused on the core journey.

MUST HAVE

Frictionless order submission

Live map of store responses

Real-time status notifications

SHOULD HAVE

Store rating & delivery time

Delivery route visualisation

Arrival countdown

COULD HAVE

iOS Dynamic Island

Richer micro-interactions

WON'T HAVE (V1)

AI store recommendations

AR delivery path overlay

Stop 4 · Core flow

From “haldi, tamatar…” to a ready cart.

One continuous story rather than disconnected screens.

Home screen with voice bar
01Home & voice barOne tap to talk
AI listening
02AI listeningLive waveform feedback
AI processing
03ProcessingSpeech parsed into items
AI-created list
04AI-created listEditable, structured cart
Add voice error statesWhat happens when the AI mishears — “did you mean jeera or jeera rice?”, unavailable items, silence. assets/v2/kirana/voice-errors/
Stop 5 · Store selection

Visualise the invisible: the stores around you.

Ahuja Store · ₹116 Raju Store · ₹121 Garg Mart · ₹133 Bharat Store · ₹147 Kwality Bazaar · ₹152 YOU

Illustration · the order is broadcast and nearby kiranas respond with prices.

Store selection map
Nearby storesPick by price & distance
Cart and payment
Cart & payCheckout stays simple
Stop 6 · Fulfilment

Your order shouldn't disappear when you leave the app.

Each state updates the app and the Dynamic Island together. Pick a state.

Order accepted screen
In the app
Dynamic Island: order accepted
Live Activity · expanded
Add a screen recording of the Dynamic Island animation10–15s, compact → expanded → state change. assets/v2/kirana/dynamic-island.mp4
Stop 7 · Visual system

A visual language for local commerce.

Near Black
#0B0D0E
Deep Green
#10B981
Vivid Green
#22C55E
Warm Yellow
#F59E0B
White / Grey
#E2E8F0
Editorial headings
Racing Sans One

High-impact section headers and bold statements.

Primary interface
Sofia Sans

Body, lists and core readable UI.

Expressive accents
Sedgwick Ave

Used sparingly for highlights and callouts.

Final stop · Delivered

A delivery journey, not just an order confirmation.

Traditional order experience
  • Static confirmation after checkout
  • Black-box fulfilment
  • Reopen the app for every update
  • Disconnected notifications
KiranaPro concept journey
  • Checkout flows straight into the live map
  • Visible kirana store responses
  • Continuous tracking on Dynamic Island
  • Clear, transparent state changes

Five principles that guided the project

01

Turn waiting into an experience

Use post-checkout time to show progress and build confidence.

02

Visualise the invisible

Show the store network so customers see their order move.

03

Keep checkout simple

The rich tracking starts after the essential purchase.

04

Extend beyond the app

Live Activities keep users updated without switching back.

05

Motion with purpose

Micro-interactions explain state changes, not decorate.

The order doesn't end when you tap “Place Order.” That's where the experience begins.

The strongest idea wasn't another feature — it was exposing enough of fulfilment to make the experience feel transparent, clear and alive.

Add “what I'd do differently” and any feedbackMentor or reviewer feedback from 10kdesigners, plus one honest change you'd make.
Next case study

Fluently Kind →