Building Shared Design Infrastructure to Scale Product Delivery
TOXSquare | Scalable Atomic Design System | PlayStation
At PlayStation Visual Arts, I identified the need for and created TOXSquare, the studio’s first scalable design system, establishing a shared foundation for an expanding ecosystem of internal products.
As the sole UX designer, I led the system strategy, architecture, visual language, component design, documentation, and governance in close partnership with engineering. By introducing reusable components, design tokens, and automated workflows, TOXSquare reduced design and development time, accelerated adoption across supported products, and created a foundation that allowed design and engineering decisions to scale across the organization.
Design System Strategy
Visual Design, Architecture
Documentation & Governance
Software Developer
Cross-platform
6 Months
Challenge
PlayStation Visual Arts had no shared design system for its internal product ecosystem. As teams built tools independently, UI patterns, interaction conventions, and implementation approaches evolved separately across products.
Without a common foundation, designers and engineers repeatedly solved similar problems, creating inconsistent experiences, duplicated development effort, and growing design debt. As the product ecosystem expanded, this model became increasingly difficult to maintain and scale.
The opportunity was to establish the studio’s first shared design system, creating reusable infrastructure that could align design and engineering while allowing teams to build products faster and more consistently.
Business Goals
Establish the studio’s first scalable design system and shared product language.
Reduce duplicated design and engineering effort through reusable, production-ready components.
Accelerate product development by giving teams a validated foundation for common interface patterns.
Improve consistency and usability across an expanding ecosystem of internal tools.
Create sustainable governance and automation practices that allowed the system to scale without proportional increases in maintenance.
Impact Metrics below:
Based on comparative usability testing, stakeholder analytics review, tool reporting, and user satisfaction surveys.
60%
Reduction in Design Time
100%
Adoption Across PSVA Products
50%
Reduction in Development Time
The Project
Discovery Insights:
As the internal product ecosystem expanded, teams were repeatedly solving the same interface and implementation problems without a shared foundation. Components were recreated across products, design decisions were interpreted differently by engineering, and inconsistencies accumulated as the organization scaled.
The core challenge was not simply the absence of reusable components—it was the absence of a shared system for making, documenting, and implementing product decisions.
Solution Strategy:
Rather than building a component library in isolation, TOXSquare was designed as shared infrastructure connecting design standards with engineering implementation.
The system established:
Reusable foundations and components standardize recurring interface patterns across products.
Design tokens and automated workflows to connect design decisions with implementation and reduce manual translation.
Documentation and governance to give teams clear guidance while allowing the system to evolve as new product needs emerged.
Strategic Insight:
The scaling problem emerged from decision fragmentation. A shared system could encode decisions once and make them reusable across products and teams.
Validation & Outcomes
TOXSquare was validated through implementation across internal products, ongoing design-engineering feedback, and comparative measurement of design and development workflows. Adoption provided the strongest validation: teams could apply the shared system to real product needs without sacrificing the flexibility required by individual tools.
Results:
Reduced design time by 60% through reusable components and shared patterns.
Reduced development time by 50% by standardizing implementation and reducing duplicated engineering work.
Achieved 100% adoption across supported products and teams.
Improved design-engineering alignment by creating a shared source of truth for recurring product decisions.
Decision Tradeoffs
What Was Intentionally Simplified:
The initial system prioritized high-frequency components, foundational tokens, and recurring interaction patterns rather than attempting to standardize every interface variation. This created immediate value while keeping the system manageable and easier for teams to adopt.
What Was Postponed:
Advanced theming, broader automation, and specialized component variants were deferred until adoption patterns and product needs provided enough evidence to justify additional system complexity.
What Was Not Built:
TOXSquare was not designed to prescribe every product decision or eliminate team-level flexibility. Product-specific workflows remained outside the system when standardization would have created unnecessary constraints or compromised the needs of individual tools.
Lessons Learned
Leadership Lesson | Design Systems Scale Decisions, Not Just Components:
Building TOXSquare reinforced that the value of a design system extends beyond interface consistency. By aligning design standards, engineering implementation, documentation, and governance, recurring product decisions became shared infrastructure rather than repeated work.
The system scaled because teams could reuse patterns and the decisions behind the components, reducing ambiguity, accelerating delivery, and creating a stronger foundation for future products.
“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