uds.png

Purpose


The UDS aimed to build a scalable design system that promotes usability and clarity across all Crunchyroll platforms. This involved creating WCAG 2.1 compliant components, providing designers and developers with creative freedom while maintaining alignment within the Crunchyroll brand.

Colors, iconography, and mascot components that live within our Figma design system.

Colors, iconography, and mascot components that live within our Figma design system.

Crunchyroll Logomark Figma components.

Crunchyroll Logomark Figma components.

Apple TV Typography.

Apple TV Typography.

Card Components

Card Components

Meaning


A design system is a tool that can adapt and evolve with the changing needs of a product team. A well-designed system is often referred to as a "source of truth" or a "living and breathing thing" due to its dynamic nature. Like a house on wheels, the design system requires skilled drivers and regular maintenance to function effectively. In the case of the UDS, this maintenance includes updating Figma components, documentation, and communication with team leads. The "fuel" for this system comes from various product teams who request new components, updated guidelines, or bug fixes. To effectively support these requests, the UDS must be designed to handle them seamlessly and efficiently.

LRX card component, with all its switchable attributes.

LRX card component, with all its switchable attributes.

Web component and its variables.

Web component and its variables.

Design documentation for various components throughout the different platforms was made for new or existing product designers.

Design documentation for various components throughout the different platforms was made for new or existing product designers.

iOS Search Bar components and documentation.

iOS Search Bar components and documentation.