Portrait image

Alexis Gallisá

Twitch Design System

Head of Core Product Design

While at Twitch I have been leading a small team (and a lead developer) in creating the Twitch design system. A css framework, style and accessibility guide which empowers developers/designers across the org to develop efficiently and consistently. This project started as a means to refactor our legacy css system which has been powering twitch for the last 4+ years. Refactoring has eliminated thousands of unneeded selectors, stripped old browser support, and sped up compile times by 3x. New patterns created use BEM naming to improve modularity and flexibility, prioritize layout rendering performance by using aspect placeholder logic and use best practices for accessibility for all users.

The Twitch design system uses a grunt workflow to compile css with libsass/postcss, nunjuck (jinja/django js eqivilant) templates to create documentation, and svgstore support for auto svg sprite creation.