Viacom Design Language System
Role Product & Visual Design
Year 2018-2019
The challenge was to create a unified design system that scales across multiple brands, while maintaning similar patterns to help users easily navigate between brand experiences.
01 / How do we build a system that can support 9+ brands who all have their own unique personality?
We created a global white label system, called Webplex. It acts as the foundational framework that scales to all of Viacom's brands.
02 / Components
Components, such as cards, color patterns, buttons and type styles are shared by brands across the Design System. In code, we easily can style brand sites using CSS variables based on the component patterns created within Webplex.
03 / Scaling with Code
We worked closely with our developement team to ensure our Design System was scalable in code. Together, we created a system that lets designers easily brand a site by editing one single CSS file, which updates styling across all pages seamlessly.
We worked closely with our developement team to ensure our Design System was scalable to code. Together, we created a system that lets designers easily brand a site by editing one single CSS file, which updates styling across all pages seamlessly.
04 / Application
