Bookr Business
Product Designer
Mobile, Web, Design System
I led product design for Bookr Business with a single mandate: evolve a monolithic platform into a scalable ecosystem.
That meant decoupling the business experience from the consumer app and establishing a unified, portable design system that could ship consistently across web, iOS, and Android. My scope covered product strategy, the end-to-end design system, interface design, and accessibility, with a constant focus on visual and behavioral continuity between platforms.
Problem framing
Historically, one app attempted to serve both audiences, which produced load issues and operational complexity. Visually, the language looked similar across web and mobile, yet each platform ran on a different component library. Any new feature had to be built two or three times.
The goal was to separate products cleanly and replace parallel design systems with one shared foundation, so teams could ship faster with fewer defects and a clearer mental model.
Discovery and explorations
I mapped the end-to-end journey as discover, learn, use, decide, and goal. Awareness channels lead people to open the app, a brief orientation builds confidence, core tools cover team, calendar, services, promotions, and profile, and explicit publish moments turn usage into progress tied to clear outcomes.
Component exploration began with cross-platform primitives such as buttons, inputs, selects, sheets, and modals, then matured into macro flows such as Calendar, Booking, Service Builder, Payments, and Staff or Workspace selection.
Unified design system
The design system is built as a layered model. At the core, tokens encode semantics: color palettes with sufficient contrast in light and dark, a responsive type scale, spacing and radius rules, and motion curves that communicate state without distraction.
Where it clarified meaning, we introduced a 3D illustrations library to define key actions and feature states, adding depth and affordance without increasing cognitive load.
Design decisions
The core move was a universal List component that covers the majority of data views, from user directories and staff rosters to booking summaries and appointment metadata.
Paired with a preconfigured Action Sheet for create, edit, and reschedule actions, this reduced surface area, made the app feel coherent, and cut the cost of adding new flows.
The most durable outcome is not a single screen, but the shared way of solving problems.