Goals
Agreed with the client before anything was drawn.
- 01A user does the same work on the web and in the app, and their state stays the same.
- 02The first load is fast even on a weak connection.
- 03The frequent actions can be done from the keyboard.
Design & development studio
The Grishana web application
The numbers that mattered to the client — not the ones that look good.
Agreed with the client before anything was drawn.
Everything that was handed over at the end.
The service had started on mobile and had no web version; a user sitting at a desk had to do the same work on a small screen. First-load speed on a weak connection was a problem too.
A web application that does the same jobs as the app in a desktop layout, built on Next.js so pages come from the server and the first paint is fast. A user's state is the same across web and app.
The desktop layout was designed from scratch rather than being an enlarged phone: list and detail side by side, and the frequent actions within reach of the keyboard.
The things this product does now that it could not do before.
A user's state is the same on web and app; work left half-finished on one carries on from there on the other.
List and detail side by side, instead of a sequence of phone screens.
Pages come from the server, so the first paint is quick even on a weak connection.
The frequent actions have shortcuts; a power user never takes their hands off the keyboard.
The route the work actually took, with the time each stage needed.
A review of what users were doing on mobile, and of what was hard to do there.
The desktop layout and the main paths, with a prototype for the most frequent task.
The shared design system and the main pages.
Building the web application, syncing state and tuning for speed.
Testing on slow networks and a staged release.
The tools this project stands on, and still runs on today.
The web version now takes a large share of the service's daily use, and grows on that same design system.
A short call, free and without obligation: we listen to what you need, then tell you how long it takes and what it costs.
