DLUX

The DLUX design system was born out of necessity during a period of rapid growth at ZapLabs. As our team scaled, we faced the challenge of maintaining consistency across products while fostering collaboration between design and engineering. DLUX became more than a toolkit—it was a shared foundation that unified our processes, empowered our teams, and enabled us to deliver cohesive, user-centered experiences at scale.

Goal
Develop a library of reusable, scalable components to reduce redundancy and promote consistency across products.

What’s a design system?

A design system unites product teams around a common visual language. It reduces design debt, accelerates the design process, and builds bridges between teams working in concert to bring products to life…Design systems enable teams to build better products faster by making design reusable—reusability makes scale possible. - Invision

Design Approach

Audited existing products to identify inconsistencies.
Collaborated with cross-functional teams to redesign patterns.
Created a shared Sketch library for reusable components.
Developed detailed guidelines for design and engineering teams.
Integrated patterns into existing features in alignment with engineering timelines.

My Role
I led the initial creation of the DLUX design system, defining the MVP roadmap, designing core components, and building out foundational pattern libraries. Over time, I transitioned to mentoring junior designers, delegating responsibilities, and refining processes to support a growing team.

Collaboration with Engineering
After launching our first major feature, a global navigation system, we worked closely with front-end leadership to address workflow challenges. This collaboration resulted in adopting vanilla JavaScript markup for portable components, setting the stage for integration with frameworks like React.js.

Example code block in DLUX

DLUX proof of concept

Evolution and Execution
By 2019, we modernized the library to include updated UI components, improved accessibility, and reimagined patterns to overcome legacy code limitations. Each component was rigorously tested in production before being added to the system.

Guiding Principles
To align with our user's needs, we established five principles:

Be Useful
Be Clear
Be Where Our User Is
Find Confidence
Respect Relationships

Outcomes

DLUX was an incredibly humbling project. I had the opportunity to wear many hats and work with many stakeholders. Below is a list of some of the notable achievements that the product team and I accomplished.