AERIS BY IROBOT | Systems & Delivery
Building a Scalable Design System
Role: UX Manager and Design System Leader
Scope: Design System Strategy, Dev Handoff, Accessibility, Visual Consistency
Team: UX, Engineering, Product, Brand
KEY OUTCOMES: 30% faster dev cycles · WCAG compliance
The Challenge
When Aeris was acquired by iRobot, the existing e-commerce platform needed more than a visual refresh; it required a complete rebrand. The updated site had to align with iRobot’s brand guidelines, meet WCAG 2.1 AA accessibility standards, and launch under an aggressive timeline during peak sales season.
But the foundation was brittle. Layering a new brand atop the existing platform was not feasible. To meet the deadline and ensure long-term scalability, we needed a rebuild strategy rooted in systems thinking, aligning product, brand, and engineering teams around a shared, scalable design language.
Inconsistent UI patterns
Slow development cycles due to lack of reusable components
WCAG violations & non-semantic markup
No centralized design documentation or structured dev handoff
Acquisition-driven relaunch on aggressive timeline
My Leadership Role
As UX Manager, I led the end-to-end development of the Aeris by iRobot design system, coordinating across three distinct teams: our internal UX team, iRobot’s brand and product teams, and the Aeris development team based in Europe. This work required high-level coordination across multiple time zones to align vision, execution, and delivery across disciplines.
Key Responsibilities:
Defined a token-based visual language for color, spacing, and typography
Audited 50+ screens to standardize primitives and identify reusable UI patterns
Aligned three cross-functional teams (Design, Development, Brand) around a unified system
Embedded accessibility and performance best practices into every layer of the design system
Facilitated weekly cross-team standups to sustain velocity and address blockers in real time
System Architecture
To reduce design debt and accelerate feature roll-out, we adopted the Atomic Design methodology, a proven industry standard for creating scalable and maintainable design systems. This approach allowed us to break down the UI into fundamental components, promoting consistency and reusability across the platform.
Governance and Maintenance:
Established bi-weekly design system review sessions with developers and stakeholders to assess new component requests and updates.
Implemented Agile UX methodologies to integrate design system tasks into sprint cycles, ensuring continuous improvement and alignment with development workflows.
Developed comprehensive documentation to guide usage and facilitate onboarding of new team members.
Design Ops & Handoff
To streamline execution and reduce friction between design and engineering, I led the implementation of a dual-source Figma workflow that clearly separated design exploration from implementation-ready components. I collaborated directly with developers to establish a shared system of language, structure, and QA practices, reducing handoff time by 30% and minimizing implementation errors across releases.
Key Outcomes & Leadership Impact:
Implemented a dual-source Figma strategy to manage source-of-truth tokens separately from visual explorations
Standardized naming conventions between design and code (e.g., btn-primary, surface.default.inverted) to ensure alignment across teams
Documented reusable CSS classes and design rules, embedding code snippets directly into component specs
Reduced design-to-dev ambiguity, accelerating delivery velocity and improving design consistency across 30+ templates and flows
Why It Matters
This design system initiative was more than a technical upgrade; it was a strategic transformation that:
Enhanced cross-functional collaboration, bridging gaps between design, development, and brand teams.
Improved accessibility compliance, ensuring the platform met WCAG 2.1 AA standards.
Accelerated development cycles, reducing time-to-market for new features.
Established a scalable foundation, enabling future growth and adaptability of the platform.
By implementing a robust design system, we not only improved the current state of the Aeris platform but also set the stage for sustainable growth and innovation.
Outcomes & Impact
Faster Development
30% faster development cycles due to reusable component library
Full Accessibility
100% coverage of WCAG 2.1 AA criteria for color, keyboard, and content hierarchy
Visual Consistency
Improved visual consistency across the entire e-commerce experience
Scalable Architecture
Built-in scalability for future products, reviews, and checkout flows
Let’s Connect
I help teams scale thoughtfully, lead with clarity, and deliver design outcomes that matter.
Reach me at rudy [at] rudyland dot com or via LinkedIn.