When we started building the new AI Phone Agent at Switch, it quickly became obvious that our old design patterns couldn’t keep up. The app had grown over years with quick fixes, so designs across different mobile tabs looked and behaved differently. Adding a new web app as well as AI-focused flows like chat would have made things even messier.
As the sole designer, I took on a full design system overhaul. My goal was to give us a solid foundation so we could ship AI features quickly, consistently, and with less friction for both users and engineers.
- Fragmentation: UI patterns diverged across platforms, making the experience feel inconsistent.
- Slow handoff: Engineering spent up to 2 weeks implementing/QA’ing new features due to no reusable components.
- Shipping with new AI angle: New onboarding and pricing flows (for global rollout) lacked established patterns.
We built and implemented a cross-platform design system that:
- Standardized design tokens (type, spacing, color) across mobile and web.
- Established reusable component libraries in Figma and code (shadcn for web, native frameworks for mobile).
- Standardized onboarding and pricing flows so they could scale globally.
My general process for the overhaul was to cleanup, redesign, document, and handoff gradually. First I mapped out everything we already had, then rebuilt the foundations, and set up rules to make sure the system could scale beyond the AI Agent project.
1. Engineer Collaboration: Worked closely with devs to research components libraries and decided on shadcn for web and native mobile frameworks for mobile; this ensured the system was scalable in production across existing and US markets.
2. Audit & Prioritization: Audited every existing component, noted duplicates and inconsistencies, and prioritized what needed to be rebuilt for the AI Agent launch.
3. Well-Documented System: Provided clear visuals of designs of the existing vs new UI components and documented specs so all internal stakeholders could adopt the system consistently.
The overhaul gave us a consistent, scalable system across mobile and web. The AI Agent launch shipped with patterns that felt intentional instead of patched together, while new tabs were refreshed with new UI within weeks. From onboarding to AI call summaries, everything spoke the same design language.
.png)
- Handoff and QA dropped from 2 weeks to 1–2 days per major feature release.
- We could release weekly AI updates without design bottlenecks.
- The new system was adopted by all teams and markets, creating consistency for users globally.
- A strong design system doesn’t just clean up the UI — it speeds up how the whole team works.
- Designing for AI means designing for the edge cases: retries, errors, and scheduling mistakes are just as important as the easy or “happy path.”
- Leading this solo taught me how to balance hands-on component work with getting buy-in and adoption across engineering.
