TOXSquare - Scalable Atomic Design System, PlayStation Visual Arts
Project Summary: Drove the strategy and implementation of a scalable design system for TOXSquare to address fragmented UI patterns, duplicated engineering effort, and growing design debt across products. By establishing a shared foundation of components, tokens, and automation workflows, the system improved cross-team consistency, accelerated delivery, and enabled the product ecosystem to scale without proportional increases in design or engineering overhead.
My Role: Design System Strategy & Architecture / UX & Visual Design / Design Leadership / Documentation & Governance
Led the creation of a shared design language that aligned design and engineering teams and scaled across multiple products.
Software Developer
Cross-platform
6 Months
Challenge
Inconsistent UI patterns and decentralized implementation practices were causing design and engineering teams to repeatedly solve the same problems. This fragmentation increased delivery timelines, introduced visual and interaction inconsistencies, and made onboarding new team members more costly. Without a scalable system, design decisions did not compound over time, they reset with each new feature or product.
Business Goals
Reduce design and engineering rework by eliminating duplicated UI patterns
Improve delivery velocity through reusable, production-ready components
Increase UI consistency to strengthen user trust and product coherence
Enable the platform to scale across teams without increasing maintenance burden
Execution Summary
Execution began with a comprehensive audit of existing products to identify duplicated components, inconsistent patterns, and high-frequency UI elements. These insights informed prioritization of foundational tokens and components that would deliver the greatest impact. Design explorations were validated in close partnership with engineering to ensure feasibility and alignment with front-end architecture. Automation workflows were introduced to generate and maintain tokens, reducing manual upkeep and reinforcing consistency across products. Iterative feedback from product teams ensured the system supported real workflows and reduced friction during implementation.
Impact Metrics below:
Based on comparative usability testing, stakeholder analytics review, tool reporting, and user satisfaction surveys.
60%
Reduce Design Time
100%
Increase in adoption rate
50%
Reduce Development Time
The Project
Organizational Context:
As TOXSquare expanded its product surface area, multiple teams were building and maintaining interfaces independently. While this allowed short-term velocity, it introduced long-term challenges: inconsistent user experiences, duplicated front-end work, and increasing difficulty maintaining quality at scale. The design system initiative was introduced to create a shared language between design and engineering and to support sustainable growth across the platform.
Strategy Insight:
The core challenge was not the absence of components, but the absence of shared decision infrastructure. Rather than treating the design system as a static library, the strategy focused on building a living system that encoded design decisions, reduced ambiguity, and supported both design and development workflows. The goal was to ensure that design quality scaled automatically as the organization and product suite grew.
Decision Tradeoffs
What Was Intentionally Simplified:
The initial system focused on foundational tokens and high-impact core components, prioritizing adoption and usability over exhaustive coverage.
What Was Postponed:
Advanced theming and role-specific variations were deferred until the core system proved stable and broadly adopted.
What Was Not Built:
Highly specialized components and one-off interaction patterns were excluded to avoid fragmenting the system and increasing long-term maintenance cost.
Outcomes:
Improved delivery velocity by enabling teams to ship features using pre-validated components
Reduced duplicated UI patterns across core products, lowering design and engineering rework
Increased consistency across the platform, strengthening user experience coherence
Shortened onboarding time for new designers and engineers through shared patterns and documentation
(Metrics were tracked through internal audits, delivery timelines, and qualitative feedback from design and engineering teams.)
Lessons Learned
This project underscored that successful design systems aren’t just libraries, they are shared operational agreements that reduce friction across teams. I learned that early alignment with engineering standards and automated token workflows can dramatically reduce maintenance costs and foster cross-team trust.
“Merilly has repeatedly demonstrated an unparalleled ability to turn complex problems into elegant, user-centric solutions. I'm thrilled to have had the chance to work with a top-tier UX Designer like Merilly and she has truly changed the way I approach project initiation and planning.”
Becca Abel
Senior Software Engineer | Sony Entertainment Interactive