All Projects
Case Study · UI/UX · Service Design · 2024
FlowPulse
A unified service design system for a SaaS workforce management platform — spanning web dashboard, mobile app, and in-venue kiosk.
A unified service design system for a SaaS workforce management platform — spanning web dashboard, mobile app, and in-venue kiosk.
FlowPulse is a workforce management SaaS platform serving hospitality and retail businesses. Their existing product had grown through three separate acquisitions — a web dashboard, a mobile companion app, and a kiosk system for on-site clock-in.
Three different codebases, three design languages, zero cohesion. Employees were confused, managers were frustrated, and churn was climbing.
Redmark was brought in to redesign the entire service ecosystem — unifying the experience across all three touchpoints while preserving each surface's unique interaction context.
The web dashboard was built for desktop power users — a dense, feature-rich interface with deep navigation trees. The mobile app was bolted on later, using different terminology and a completely different visual language. The kiosk was an afterthought — a repurposed tablet with a web wrapper.
A shift worker clocking in at the kiosk, checking their schedule on their phone, and a manager reviewing timesheets on the web were technically using the same platform — but it didn't feel that way.
We identified three core failure modes: inconsistent terminology, no shared component system, and interaction patterns that made sense on one device but failed completely on another.
"We had three teams building three products. Redmark helped us realise we were actually building one service — just on different screens."
Before wireframing a single screen, we spent three weeks in the field. We visited hospitality venues, watched shift workers use the existing kiosk, and interviewed employees who used the mobile app on their commute.
The insight was clear: each surface had a completely different cognitive context. Kiosk users are on their feet, often rushed, with wet hands. Mobile users are passive — checking schedules, not taking action. Web users are deep-focus — building rosters, resolving disputes.
Rebuilt for power users. Density-first layout with persistent left nav, command palette (⌘K), and a new roster builder that reduced scheduling time by 40%.
Redesigned as a passive-first companion. The home screen shows your next shift, outstanding requests, and recent pay. Actions are large, thumb-friendly, and gesture-based.
Redesigned for the 14-second transaction. Large touch targets, high-contrast display, NFC + PIN + Face ID support, and an offline-first architecture.
We built a Figma component library from scratch — 140+ components, 6 token sets (colour, typography, spacing, radius, shadow, motion), and adaptive layout rules that let a single component look correct on a 13" laptop, a 5" phone, and a 10" kiosk tablet.
The system includes a context modifier — a prop on every component that switches it between web-dense, mobile-touch, and kiosk-large modes.
The hardest part of this project wasn't the design — it was the alignment. Three product teams had created deep organisational silos. Our design system became as much an organisational tool as a visual one.
The context modifier pattern was our biggest innovation. By building surface-awareness directly into components, we gave engineering a clean path to a unified codebase without a big-bang rewrite.
We also learned that kiosk design is deeply underserved. A kiosk in a busy kitchen at 7pm is a completely different problem — glare, noise, time pressure, and often-wet hands change every interaction assumption.
"The design system wasn't just a Figma file. It became the shared language between design, engineering, and product. That's rare, and that's Redmark's work."