Portfolio

Demo

SnackBox

A responsive web app to record what people take, keep an eye on stock and settle the accounts of an office snack box.

Type
Technical demonstration · responsive web app
Status
A public demonstration with fictional data
Technology
HTML, CSS and JavaScript; GitHub Pages
The monthly SnackBox dashboard: total for the month, consumption per person, a low-stock warning and a detailed list of entries. (opens in a new window)
The monthly SnackBox dashboard: total for the month, consumption per person, a low-stock warning and a detailed list of entries. Tap the image to see it at full size.
Recording on a phone: after choosing their name, the person taps the product they took. (opens in a new window)
Recording on a phone: after choosing their name, the person taps the product they took. Tap the image to see it at full size.

The starting point

SnackBox was built for a common situation: a box of snacks and drinks in an office, paid for on an honesty basis. Without a tool, somebody has to write down what people take, do the sums at the end of the month and notice in time what needs buying.

What was done

  • Recording in two taps: choose the name and the product, on a phone or on a tablet next to the box.
  • Stock per product, with a warning when it's running out.
  • A monthly dashboard per person, with CSV export.
  • Cash, payments and the shopping list in a management area protected by a PIN.

Decisions that made a difference.

No accounts for the people taking snacks.

People choose their name to record a snack. A PIN protects the management area.

Designed for use on a phone.

Recording happens standing up, next to the box, so the phone is the main screen.

The demonstration is separate from the original.

The public version is isolated from the system where the idea was born and uses fictional data only.

Data and privacy

The demonstration uses fictional data only, stored in the browser. In a version for a company, the records live in a secure backend, with access only for whoever runs the box, handled as required by the Swiss Federal Act on Data Protection (FADP) and, where it applies, the GDPR.

See the project

Open the demonstration (opens in a new window)

In the management area, the demonstration PIN is 1234.

Would you like something similar for your business?

Tell me what you use today and what you would like to simplify. I'll explain what I'd recommend and what the project would include.