Venu Sports Design System initiative
Project
In-house Design systems
Credit
Lia Napolitano - VP, Design
Mika Albornoz - Senior Product Designer
What I did
Design System
Strategy
Component Design
Mentoring
Front-End-UI
Tooling
Documentation
Platforms
Web
iOS/tvOS
Android/GoogleTV/FireTV
Roku
Android Auto
SmartTV
Low-powered Devices

Venu Sports was a proposed sports-focused streaming service in the United States, to be operated as a joint venture between The Walt Disney Company, Fox Corporation and Warner Bros. Discovery. As the lead designer in our company's Design Systems, I
led the initiative to build our design token systems. My journey began with the creation of
design tokens and component designs, developing strategies to ensure consistency and scalability across our
products.
I collaborated closely with Product Designers, VP of Design, Product Managers and developers to set up the design system and establish pipelines to efficiently ship packages. My role encompassed a wide range of
responsibilities and this case study explores these responsibilities.
Design Token Migration and UI Overhaul
- Problem: The previous design had inconsistent visual elements, leading to fragmented user experiences.
- Solution: Led the migration of design tokens (starting with colors and typography) to support a comprehensive UI refresh, ensuring uniformity across all platforms (Mobile, Living Room, and Web).
- Impact: Created a visually cohesive and modernized design language, significantly improving user experience and team alignment during implementation.

Monorepo and Automated Release Pipeline
- Problem: Releasing UI updates and tokens manually caused delays and inconsistencies.
- Solution: Implemented a monorepo structure with automated versioning and releases using semantic-release and GitHub Actions.
- Impact: Cut release times and improved developer efficiency by eliminating manual steps.

UI Component Updates and Cross-Platform Consistency
- Problem: Developing UI components was slow due to inconsistent design tokens and lack of integration across web, iOS, and Android platforms.
- Solution: Integrated new design tokens into Figma component libraries and codebases, enabling multi-platform updates and consistent design implementation.
- Impact: Accelerated UI component development, reduced rework, and ensured consistency across platforms, improving collaboration between design and engineering teams.

Collaboration and Cross-Functional Teamwork
- Problem: Misalignment between design and development caused delays in implementation and UI reviews.
- Solution: Introduced regular design reviews and syncs to align component releases with development timelines.
- Impact: Reduced review cycle times and improved feedback loops, resulting in faster implementation of the new design.