WW - Kevin Leung

WW:
Design System

WW offers a scientifically proven program for weight loss and wellness, with Digital, in-person and Virtual Workshops, and Personal Coaching solutions to help meet your goals. For more than 55 years, WW has helped millions lose weight with the latest nutritional and behavior change science.

The problem

WW's guest site is built on reusable components known internally as "slices". In conjunction with the launch of a new product offering, we were given the task to completely redesign and overhaul the design system that was already in place. With the breakneck pace of implementation, no time was given to establish a clear source of truth for designers. A standardized asset library was needed to help designers maintain consistency when working on the site.

A screenshot of the previous iteration of the WW site.

My role

I worked as the lead designer for this project. This team consisted of one product manager, one project manager, one junior designer, one content writer and seven software engineers.

Creating a foundation

Updating the design system didn't simply start and stop with images. Using the atomic design model, the design team at WW started with the foundational elements. We worked to update colors, typography, hover states, form fields and countless other states. This was done to methodically to guarantee that when we worked our way up to a slice level that the elements would be fully ADA compliant and globally consistent.

A fully dynamic design system

Once we established the foundational elements, I went to work and integrated these elements into the slices that make up the WW guest site. Utilizing Figma's auto-layout functionality, I helped to build a standardized library of slices that are fully editable and easily accessible. Whether or not a designer is brand new or familiar with the design system, the library has been set up in a way that anybody can come in and immediately start building out pages that are consistent and clearly connected to a single source of truth.