Our performance budget, the fonts and assets it rules out, and what we gave up to keep the app light.
The phone on the desk
There is a phone on the desk of everyone who works on KinHolo. It cost less than a hundred dollars new, it is a few years old, it has two gigabytes of memory, and it is the phone the app has to be good on. Not tolerable. Good.
That is not charity. Across the markets we build for, a phone like it is normal, and a family app that only works on the newest handset is not a family app. It is an app for one member of the family.
The budget
A performance budget is a set of numbers you refuse to exceed, chosen before the work starts so that nobody has to argue about them later. Ours, for the phone on the desk:
- Cold start to a usable screen: under two seconds, with no network. The cached household state paints first; the network is consulted afterwards.
- Install size: as small as a single high-resolution photo. Every megabyte is a download somebody pays for.
- No frame dropped on the main lists, with a hundred items and the app in the background for a day.
- Nothing that needs a good connection to render. Fonts, icons and the logo ship with the app.
What the budget rules out
The budget does most of the design decisions for us, which is the point.
Custom icon fonts and image sprites. Every icon in KinHolo is a small vector drawn in the brand’s stroke weight, and the logo is redrawn as a vector from the brand sheet rather than shipped as an image. It stays crisp at every density and costs a few hundred bytes.
Photography in the interface. Empty states are drawn, not photographed. A photo that looks calm on a flagship looks like a loading problem on a slow connection.
Animation for its own sake. Screens transition, ticks fill, bars grow. Nothing loops, nothing plays in the background, and everything respects the system’s reduced-motion setting.
A theme switch. We ship the light theme only. Adding a dark theme would double the surfaces we test on the phone on the desk, and we would rather ship one theme that is right than two that are nearly right.
What we gave up
Some things we wanted did not survive the budget.
We wanted a live speech recogniser for adding items by voice. The models are large and the phones are small, so voice capture uses whatever the platform provides: the keyboard’s dictation key on phones, the browser’s speech API on the web. It is less magical and it works everywhere.
We wanted a socket for real-time updates and settled for polling a version number while a screen is open, because a held-open connection is expensive on a metered network and fragile through the proxies many mobile operators use.
We wanted country names from the operating system, and found that the reduced internationalisation library on older Android returned the wrong ones. The names are now baked in at build time, in every language the app supports.
How we keep it honest
The phone on the desk is part of the definition of done. A screen is not finished until it has been used on it, at the narrowest width we support, with the network switched off. Most of what we learn from that phone makes the app better on every other phone too. A cold start under two seconds on a slow device is instantaneous on a fast one, and a household does not notice speed. It notices the absence of waiting.
Want the next one?