A real-life roadmap for building a design system — Pt III
In parts one and two of this series, we took a deep-dive into the benefits of building and scaling a custom design library (Hook) and web component library (WUI & Atlas). This final chapter outlines how we’ve used these tools to improve design handoff and forge a strong partnership between designers and engineers as we roll out a new architecture for our enterprise dashboard.
Removing the Guesswork 🕵️♀️
A common pain point during a feature’s lifecycle often surfaces when the handoff of a design spec breeds assumptions from the designer and engineer alike. Design assumptions about feasibility or complexity can lead to questioning, debates, and overall time lost. Engineering assumptions about a design can lead to bugs, UX inconsistencies, tech debt-incurring workarounds. …
A real-life roadmap for building a design system — Pt II
In case you missed it, be sure to check out Part I: Translating design principles into scalable code. Here we’ll take a look at how we built a custom web component library that powers our content management application and supports React, Angular, and framework-free projects.
The Challenge 🍝
The JW Player enterprise dashboard is a robust product that many of our users rely on for their daily workflows. …
A real-life roadmap for building a design system — Pt I
Welcome to the first installment of a 3-part series outlining how JW Player’s small team of front-end & design nerds leveraged a homegrown design system and web component library to modernize our suite of products.
If you’re new to this realm, I encourage you to start with some prerequisite material like Emma Bostian’s Design Systems Foundations to get up-to-speed.
The goal of this series is not to provide design philosophy or help you integrate with giants like Material Design, IBM Carbon or AirBnb, though they were each considered in our research. …
About
