SaaS Office’s app and portal.

The platform

An app for office buildings.

SaaS Office publishes a platform that brings together an office building’s services: meeting rooms, catering, concierge, incidents.

Occupants use the mobile app, and each property manager gets a web interface in its own colors.

Trade-off

One app for everyone, or one interface per use?

The product serves four audiences with different needs and different devices: occupants, property managers, service providers and visitors.

In return, three interfaces had to evolve in parallel without drifting apart. That’s what made the shared design system essential: the same tokens and components everywhere, with one theme per client.

Mobile app

Badge and rooms first.

Badging in and booking a room are what occupants do every day, so they’re at the top of the home screen. The directory and the concierge are one step further.

A reported incident can be followed in the app, without going back through the building’s front desk.

Design system

One design system for web and mobile.

Web and mobile had grown up separately, each with its own components and little habits. I brought them together in a single design system, starting with tokens, then components, documented in Figma with all their states.

Along the way, I reworked the contrast: several grays and the blue used for prices didn’t meet AA. I darkened them to the threshold, no further.

The web and mobile teams now work from the same mockups. A new feature is designed once, for both.

With the team

With PMs and developers.

Decisions are made in workshops with PMs and developers, then we ship sprint by sprint, with a demo each time.

I also get my hands into the code (HTML, CSS, JS) when it helps. If a mockup doesn’t hold up for real, I see it before the developers do.