Skip to content
Snacks in a Van

Guided tour

Snacks in a Van in three videos

Each video follows one workflow from start to finish, with the step shown on screen and as captions: a customer orders from the nearest van, the vendor fulfils it on the live board, and the records area shows the audit trail, the analytics and the A/B-test designer. They were recorded by a Playwright script that also checks every step, on the committed demo data, so the same run reproduces the same journeys.

Walkthrough 1 of 3 · /customer

Customer orders

From the landing page to a live order: find the nearest open van, add to the cart, place the order and follow it on the tracker, including what happens when the 15-minute promise runs out.

Setup: One-click demo customer; the browser's location is set to the University of Melbourne; order 2 × Flat White and 1 × Fancy Biscuit from Ardeth Lavon.Open the MP4

Time-lapse: browser clock only. Steps 8 and 9 move the browser's clock forward so the 15-minute ring can run out in a few seconds. The order on the server keeps its real times; the vendor in walkthrough 2 sees a fresh order.

Steps (transcript)

  1. 1Start on the landing page and try the customer app with the one-click demo account
  2. 2Use my location: open vans are ranked by distance and the five nearest are listed
  3. 3Pick the nearest van, Ardeth Lavon at the University of Melbourne
  4. 4Its menu: add a flat white, make it two, and add a fancy biscuit
  5. 5Review the cart and place the order (the server recomputes the price)
  6. 6Confirm: the order goes straight to the van
  7. 7The live tracker: status timeline, the 15-minute ring and 10 minutes to change or cancel
  8. 8Time-lapse: the browser clock jumps to 10 s before the 15-minute deadline (the server is untouched)Time-lapse: browser clock only
  9. 9At 15:00 the ring turns red and the late-order discount applies; changes closed at 10 minutesTime-lapse: browser clock only
Try it yourself

Walkthrough 2 of 3 · /vendor/orders

Vendor fulfils

Behind the hatch: the demo vendor's live board receives a new order, marks it fulfilled and then collected, and the customer's tracker follows along without a reload.

Setup: One-click demo vendor (van Ardeth Lavon). During the recording the demo customer, signed in in the same browser, orders 2 × Cappuccino and 1 × Small Cake.Open the MP4

Steps (transcript)

  1. 1Log in as the demo vendor, van Ardeth Lavon, with one click
  2. 2The live board refreshes every 3 s: outstanding, ready for pickup, recently collected
  3. 3Today's tiles: the on-time rate comes with its n and a Wilson 95% interval
  4. 4A new order arrives from the demo customer, with its 15-minute countdown
  5. 5Mark it fulfilled: the ticket moves to Ready for pickup
  6. 6The customer's tracker, in the same browser, now says Ready for pickup
  7. 7The van marks it collected, and the tracker updates by itself within seconds
  8. 8Back on the board, the order sits under Recently collected
  9. 9Optional AI shift summary: bring your own key, kept in this browser only
Try it yourself

Walkthrough 3 of 3 · /admin/records

Admin and experiments

The records area: every table and the append-only audit trail, the operations analytics with their intervals, and the A/B-test designer with a power analysis, a seeded simulation and the cost of peeking.

Setup: One-click demo admin, on the committed demo data. Experiment: late-discount rule, baseline 35%, minimum detectable effect +8 points, α = 0.05, power 80%; simulation seeds 2021 (the default) and 4399; A/A peeking seed 30005 with 5 looks.Open the MP4

Steps (transcript)

  1. 1Open the records area with the one-click demo admin
  2. 2Every table with record counts, search, pagination and CSV export; password hashes redacted
  3. 3The append-only audit log: sign-ins, order status changes, van updates
  4. 4Operations analytics: every figure comes with its uncertainty and its n
  5. 5Minutes to ready, and the Kaplan–Meier time-to-fulfil curve with its 95% band
  6. 6Late-discount rate by van, each with a Wilson 95% interval
  7. 7The A/B-test designer: hypothesis, one primary metric, randomised by customer
  8. 8Power analysis: 583 customers per arm to detect 35% → 43% at α = 0.05 and 80% power
  9. 9A smaller effect needs more customers: 6 points raises the sample size
  10. 10Simulate a known +8 point effect (seed 2021): the Newcombe 95% interval covers it, both tests reject
  11. 11Rerun with seed 4399: this run misses the truth, as about 1 run in 20 does by design
  12. 12Don't peek: 10,000 A/A tests show how stopping early inflates false positives
Try it yourself

Screenshots

Every key feature at a glance

Captured by the same script at 1440 × 900 (the landing page in light and dark mode) and on a 390 px phone. Select one to enlarge it; the arrow keys step through the set.

Desktop · 1440 × 900

Mobile · 390 × 844

How these were made

pnpm showcase runs web/e2e/showcase.spec.ts on the system Chrome: it plays each journey at a human pace with an on-screen caption and cursor, asserts what it shows (the nearest van, the order reaching the board, the tracker following the vendor, the sample size and both simulated runs) and records it at 1280 × 800. ffmpeg then encodes the H.264 videos on this page and the GIFs in the README. The captions here are the same text as the on-screen steps.

The recordings use the one-click demo accounts (no password is typed) and the synthetic demo data from a local production build. No AI key is entered: the bring-your-own-key settings are opened and closed, and no AI call is made.