( Teamfront / January 2024 – Present )
ServiceMonster Platform Redesign
The redesign took an aging, feature-heavy field service management platform and turned it into a modern, visually cohesive product on both web and mobile, while preserving the depth its established user base depends on.
- My role
- Lead UI/UX Designer
- Timeline
- January 2024 – Present
- Category
- Enterprise SaaS Product Design (Web and Mobile)
- Status
- Redesign, delivered
Tools Figma, Align UI Design System, Design Tokens, custom mobile component system
Generated schematic, not a screenshot. Real imagery to follow.
( The account )
Context
ServiceMonster is an all-in-one SaaS CRM and field service management platform for home service businesses in the United States: carpet cleaning, janitorial, restoration, HVAC, plumbing, pest control, and general contracting companies. It is the system those businesses run their day on. Leads, customer accounts and job sites, work orders, technician scheduling and dispatch, marketing campaigns, invoicing, payments, reporting across 55+ report types, and franchise management all live in one web application, with a companion mobile app that connects the office to the crews in the field.
The platform was well established and functionally deep. What had not kept pace was the interface carrying all of it. Years of incremental feature additions had accumulated on a dated UI, and the design debt compounded into something users felt daily: 15+ modules that each looked and behaved slightly differently, workflows that cost more clicks than they should, and data presented as flat tables when business owners needed insight. Meanwhile a newer generation of field service management tools was competing on exactly the experience ServiceMonster had stopped investing in.
The work covered both surfaces. On web, a full-platform redesign across the existing module set (Home Dashboard, Leads, Accounts, Orders, Scheduling, Marketing, FMS, Reports, Dashboards, Quick Add, Marketplace, Payments, and Settings) rebuilt on the Align UI design system, alongside a set of capabilities the platform did not have at all: a two-way texting and chat center, SMS marketing with a campaign flow builder, reviews and reputation management, an automation engine, an embeddable WebChat widget, and an AI Agent integration. The web work is documented across two environments, staging and production, with the full-platform module set in staging and the communication, marketing, reviews, and automation suite in production. On iOS, an end-to-end redesign of the mobile app across three role-based personas: Admin, Supervisor, and Technician.
The problem
The redesign had to solve problems on two fronts at once: the state of the interface, and the gaps in what the platform could do at all.
- Outdated and inconsistent visual language. Buttons, form fields, tables, modals, and navigation patterns varied in style, spacing, and behavior across modules. Users re-learned interaction patterns as they moved between Leads, Accounts, Scheduling, and Reports, which added cognitive load and made the platform feel less trustworthy than modern competitors.
- Bloated navigation and information architecture. With 15+ major modules and dozens of sub-features, the sidebar lacked clear hierarchy and the relationships between modules were hard to read. Users could not easily see how leads flow into accounts or how orders connect to scheduling.
- High interaction cost on daily tasks. Creating an order with an appointment, adding a lead, or setting up a campaign meant navigating to a specific module, opening a form, and moving across several page transitions. There was no unified quick-create path for the work people did most.
- Data without insight. Dashboards and reports presented flat, text-heavy tables with no comparative metrics and no visual KPIs, so owners had to mentally reconstruct their pipeline, utilization, campaign performance, and financial health from raw numbers.
- Fragmented customer communication. There was no centralized hub for SMS conversations, team chat, customer texting, or review responses. Users switched between tools and tabs to text a customer, send an e-signature request, or request a review, which meant missed messages and delayed responses.
- Missing capability areas. The platform had no SMS marketing or campaign flow tooling, no reviews module despite online reputation being a primary lead driver in home services, minimal workflow automation for repetitive tasks like appointment reminders and invoice follow-ups, and no AI-powered support for after-hours inquiries.
- Buried configuration and weak first-run guidance. Chat setup, notification preferences, auto-replies, keyword triggers, departments, scheduled texts, and signature templates were hard to locate or took too many clicks. Screens lacked meaningful empty states, so users opening a feature for the first time met a blank screen instead of a next step. Franchise management and the Settings module carried the same density problem in their own ways.
- One mobile interface serving three different jobs. Admins, Supervisors, and Technicians relied on the same underlying platform but needed very different workflows. The app forced Admins through technician-centric flows, buried lead management, and handed Technicians a complex interface when they needed field-ready tools, all inside a dated dark-blue and teal visual language with no onboarding.
What I did
The approach was to fix the foundation first and let the rest follow from it. On web, that meant rebuilding every module on Align UI, a token-based design system, so consistency, scalability, and design-to-development handoff efficiency came from the system itself rather than from module-by-module discipline. Shared drawers, modals, form patterns, data tables, navigation, and status systems meant a pattern solved once in Leads was already solved in Accounts and Orders. On mobile, where no such foundation existed, I built a custom component system from scratch for the redesign, including service item cards, address and contact detail modules, badge components, and site cards.
On that foundation, the web platform was organized around the operational lifecycle of a service business, from lead capture through account and site management, work orders, dispatch scheduling, invoicing and payments, and follow-up marketing, with dashboards and 55+ reports reading off that spine. Two structural moves cut across it: a global Quick Add drawer that collapses the most common daily workflow into one guided flow from anywhere in the app, and a centralized communication hub that pulls texting, team chat, e-signatures, review requests, and automated messaging into a single inbox instead of scattering them across external tools.
The mobile app took a different organizing principle. Rather than one interface stretched across three roles, I designed it as three role-based experiences on shared components: Admins get lead pipeline and client relationship tools, Supervisors get scheduling control and team oversight, and Technicians get a stripped-down field workflow built around the actual shape of their day, clock in, work the job, document it, clock out.
Outcomes
- Unified 15+ web modules and 55+ report types on the Align UI token-based design system, replacing inconsistent per-module styling with shared drawers, modals, form patterns, navigation, and status systems.
- Reduced interaction cost on the highest-frequency daily workflow through the global Quick Add drawer, collapsing account, order, and appointment creation into one guided flow with the dispatch calendar embedded.
- Surfaced business intelligence that was previously buried in raw tables, through widget-based dashboards with real-time KPIs, comparative period metrics, and visual charts across sales, repeat rate, accounts, orders, scheduling, and marketing.
- Eliminated the need for external communication tools by consolidating SMS, team chat, e-signatures, review requests, and automated messaging into a single inbox.
- Added capability the platform did not previously have: SMS marketing with a visual flow builder and keyword automation, reviews and reputation management with Google review request, monitoring, and response, an automation engine for appointment reminders and invoice follow-ups, an embeddable WebChat widget, and an AI Agent integration for 24/7 lead capture and scheduling.
- Delivered a role-optimized iOS experience where each persona's screens match their actual work, giving Admins a lead pipeline and streamlined order creation, Supervisors scheduling filters and a consolidated activity timeline, and Technicians a focused daily timeline, persistent in-job time tracking, a Finance tab for earnings visibility, and integrated on-site documentation.
- Established two scalable design foundations, Align UI on web and a custom component system on mobile, so engineering can ship new features with predictable UI behavior.
What I learned
At this scale, the design system is the project. With 15+ modules and 55+ report types, no amount of screen-level craft would have produced a coherent product, and every hour spent on Align UI tokens and shared patterns paid back across every module that came after. The most useful thing I did was resist the pull to make individual screens beautiful before the foundation could make all of them consistent.
Designing for three personas taught me that role-based access and role-based design are different problems. The legacy app had the first and not the second: everyone reached the same screens with different permissions. Once I wrote the problem set separately for Admin, Supervisor, and Technician, it was obvious that a Technician standing in a customer's hallway between jobs and an Admin reviewing the lead pipeline at a desk should not be looking at variations of the same interface. Sharing a component system while diverging on structure gave each role a screen shaped by their day without fragmenting the build.
Adding capability and repairing debt in the same project turned out to reinforce each other more than I expected. The new areas, the Chat Center, SMS marketing, reviews, and automation, were designed on the system from day one, which meant they set the standard the older modules were being rebuilt toward. Having a live example of what "done" looked like made the redesign of the legacy modules a clearer target than a spec would have been.
( Tags )
- Web
- Mobile
- iOS
- Enterprise SaaS
- Field Service Management
- FSM
- Home Services
- CRM
- Work Order Management
- Scheduling
- Dispatch
- Franchise Management
- Marketing Automation
- SMS Marketing
- Campaign Flow Builder
- Reviews and Reputation Management
- Two-Way Texting
- Chat
- E-Signature
- Invoicing
- Payments
- Reporting
- Dashboard Design
- Data Visualisation
- KPI Design
- Data Tables
- Information Architecture
- Interaction Design
- Design Systems
- Align UI
- Design Tokens
- Component Architecture
- Persona-Based Design
- Role-Based UX
- Legacy Modernization
- AI Product Design
- Visual Design
- ServiceMonster
- Teamfront