The VanaGreen admin console now installs as a phone app

The admin console in VanaGreen, the area where a manager or company admin sees customers, users, support tickets, and monitoring, was designed for desktop from the start. That makes sense: it's where things get configured, not where minute-to-minute work happens. But in practice, many of the people who use it check something on their phone often (a status, a new ticket, a customer list) between other things, not sitting at a desk.

Until now, that meant a browser, a bookmark hard to find among dozens of tabs, and an interface that, while functional, had never been seriously tested on a small screen. We changed both.

What changed

The admin console now has its own manifest and service worker, separate from the field app (the one operators use at the scale, with document scanning and digital signature). In practice, this means a phone can "install" the admin console like any other app: it appears on the home screen with its own icon (the company logo), launches instantly, without the browser's address bar, and stays completely separate from the field app, even when running on the same phone.

No App Store or Google Play needed. Installation happens straight from the browser: on Android, a banner or a menu option offers "add to home screen"; on iPhone, the same action is done from Safari's share menu. Once installed, the app behaves like any other: its own icon, fast launch, no more hunting for the right tab.

The responsive fixes, the less visible part

Installing as an app doesn't help if the interface underneath doesn't work well on a small screen. This was the less flashy, but equally important, part of the work.

The table component used throughout the admin area (customer list, user list, tickets) had its own horizontal scroll, which on a phone produced an unpleasant effect: two overlapping scrollbars, one for the page and one for the table, hard to control with a finger. We removed the table's own scroll, letting the whole page behave predictably.

The second problem was at the page-title level. On the monitoring screens, for example, the page title sits next to a range selector (180 pixels wide) and an export button. On desktop they fit side by side easily, but on a phone in portrait they crowded together, wrapped onto two ugly lines, or got cut off at the edge. We adjusted the headers across several admin pages (monitoring, support tickets, tenant list, user list, manager-tenant links) so they lay out correctly regardless of screen width.

Why it matters

None of this is a new feature in the classic sense. No new button appears, no workflow changes. It's the difference between "can be used from a phone, if you insist" and "is actually comfortable to use from a phone." An admin quickly checking a support ticket while waiting somewhere, or a manager glancing over customer status between two meetings, shouldn't have to fight a site that never thought about their phone.

It's the kind of detail that never shows up in a sales pitch, but that's felt every day, at every app open. And that, added up with many similar details, makes the difference between software people tolerate and software they actually enjoy using.