jaye loading
Client project · Mobile apps

Jaye home-cooked, at your door

A platform connecting approved home cooks with the neighbours around them. Diners order wholesome, hygienic homemade food; cooks, many of them women, earn from their own kitchens; riders bring it over. Three apps, one order.

  • UX · UIResearch to build
  • 3Apps: diner, cook, rider
  • 13Boards of screens
The rider’s app: dashboard, orders, the route and confirming an order
The cook’s app: dashboard, new and on-going orders, and an order
Jaye · Diner
The diner’s app: meals by course, a dish, search and favourites
Overview

From the neighbour’s kitchen to your table

The shift

  1. Restaurant or processed food most days, and it costs more
    Homemade meals from cooks nearby, usually cheaper than eating out
  2. No way to know how or where the food was made
    Every kitchen inspected before its cook is onboarded
  3. Good home cooks with no way to sell what they make
    A menu, orders and a wallet for every cook; women earning alongside their day
  4. Cooks and riders who aren’t business people, and late, mixed-up orders
    Apps that run the order for them: confirm, mark ready, route, track, get paid

My role

  1. 01ResearchPersonas, empathy map, user journey map
  2. 02UXInformation architecture and flow charts for three apps, brainstorming
  3. 03Brand, UI & buildThe brand identity, then the apps, designed and developed in Ionic

What we heard

65.4%Chose home-cooked meals over eating out in a busy week
70.7%Crave home-style food every day; 29.3% on special occasions
54.5%Say the food they order isn’t as good as they expected

Key metrics

  • Prefer homemade food to restaurant food68%
  • Eat homemade food often96%
  • Sides of the platform: diner, cook, rider3

Three apps

  • DinerCooks nearbyMeals by courseFavouritesCart & checkoutTrack the riderWallet
  • CookToday’s takingsNew & on-going ordersMark readyMenu & itemsWallet
  • RiderOrders by distanceThe routeConfirm pick-upHistoryWallet

Tools

  • Adobe XD
  • Photoshop
  • Ionic
  • HTML
  • Sass
  • npm
Research

Three sides, none of them a business

The client, in Saudi Arabia, asked for a brand and a product to lead its market. Jaye depends on cooks for the food and freelance riders to deliver it, and most of them had never run a business. We talked to diners, built personas from what they said, and mapped an app for each side.

The problem, and the answer

Most cooks and riders are hobbyists or doing it for the first time. They don’t necessarily understand handling customers, and small things go wrong: late deliveries, mixed messages, a diner’s likes forgotten.

So Jaye works closely with its cooks and riders, and inspects every kitchen before a cook joins. That takes time, and leaves a waiting list of cooks: a good problem to have, but a problem, so the apps carry as much of the work as they can.

The goals

  1. Convenience: every kitchen checked before it joins
  2. Save time: less tired, rushed and stressed
  3. Flexible: cheaper than eating out
  4. Safe: food made with home hygiene
  5. Empowering: women earn from their own kitchens

Who we designed for

Abu Bilal 29 · Designer · New Delhi · Married

A designer who lives on his own in Delhi. Busy with work, he orders from the nearest restaurant, doesn’t get healthy food, and too often ends up sick.

Frustrations

  • Misses home-cooked food
  • Unhealthy, unhygienic meals
  • No time to cook after work

Goals

  • Meals that feel home-cooked
  • Healthy, hygienic food
  • Motivated by: healthy, hygienic, tasty, homemade, convenient, quality
Bilal Azad 16 · Student · New Delhi · Single

In his first year at college, living in a hostel and spending most of his time on his studies. He orders on his phone or laptop and picks the food up at the gate.

Frustrations

  • Going to a restaurant wastes time
  • A very limited budget
  • No time to cook, busy with studies

Goals

  • Explore new dishes
  • Tasty meals
  • A quicker way to order

Information architecture

Diner

Login · Home
  • CooksCook’s menu
  • ExploreDish
  • Search
  • Favourites
  • My cartCheckout
  • My accountMy ordersOrder detailsTrack riderWalletAdd & withdraw

Cook

Login · Dashboard
  • OrdersOn-goingFilterOrder detailsTrack rider
  • Order historyFilter
  • MenuItemsAdd item
  • WalletTransactionsAdd & withdraw
  • My account

Rider

Login · Dashboard
  • OrdersOrder details
  • Order historyFilter
  • WalletTransactionsAdd & withdraw
  • My account

Wireframes, one app each

Wireframes of the diner’s app, joined by the flow
Wireframes of the cook’s app, joined by the flow
Wireframes of the rider’s app, joined by the flow

The journey

  1. Empathize
  2. Define
  3. Ideate
  4. Prototype
  5. Test, and back to ideate

The diner’s flow

The diner’s flow: log in, search or browse, refine with filters, open a dish, add to cart, check out

What I learned

Bring the user back into the room
On a tight budget, it was hard to turn the client from the next feature to the customer. Short workshops on what users want would have helped.
Out of sight, out of mind
A design system needs constant reference and someone who champions it, above all when the team changes.
The core

One order, three phones

Follow order #56343 from the diner’s cart to the cook’s kitchen and onto the rider’s route, on the real screens of each app. The phone whose turn it is comes forward. It plays on its own; pick a step and it’s yours.

Order #56343Browsing
The diner’s app
Diner
The cook’s app
Cook
The rider’s app
Rider
13 boards of screens · 3 parts
  1. Getting started

    Homemade food, a rider and you: then a phone number and a one-time code, no password.

  2. Cooks and meals nearby

    Meals by course, meals nearby and featured cooks; every cook with a rating and a distance.

  3. Choosing a dish

    Meals by course, a dish with its ingredients, search and favourites.

  4. Cart, checkout, orders

    The cart with a discount, checkout from the wallet, card or cash, and every order with its status.

  5. Tracking the order

    The order with its OTP, call or track the rider on the map, and the account.

  6. The wallet

    Balance, transactions with filters, add funds and withdraw to a bank account.

  7. The kitchen’s orders

    Today’s takings, new and on-going orders, mark ready, and an order to confirm.

  8. Status and the rider

    Set an order’s status, see the rider coming, and the order history.

  9. The menu

    Courses, the items in each, and adding a dish with its price and photo.

  10. Getting paid

    Earnings in the wallet, transactions, withdrawals and the account.

  11. The rider’s run

    Orders with distance and time to deliver, the route on the map, and confirming the pick-up.

  12. History and account

    Every delivery made, filtered by date, and the account.

  13. The rider’s wallet

    Pay per delivery, transactions, withdraw and add funds.

01 / 13
Jaye · Diner · Start
The diner’s onboarding, phone number and OTP
Home, the cooks nearby and a cook’s menu
Meals by course, a dish, search and favourites
Cart, checkout and my orders
Order details, the rider on the map and my account
Wallet, transactions, withdraw and add funds
The cook’s dashboard, new and on-going orders, and an order
Order status, tracking the rider and order history
Menu, items and adding an item
The cook’s wallet, transactions, withdraw and account
The rider’s dashboard, orders, route and confirm
Order history, date filter and account
The rider’s wallet, transactions, withdraw and add funds
Next

More company work