dialpad design system
Dialpad Design System
SITUATION
Without a design system, designers and engineers wasted time on duplicative work.
ROLE
I started the design system as an 80/20 project. I was the only designer working on the system and continued to contribute to it throughout my time at Dialpad.
RESULTS
The newly-established design system realized efficiencies across the discovery, design, and build phases of product development.
process
Dialpad didn’t have a design system or shared library. Most new design projects were built by digging for older files and copying elements into a new project file – a tedious and error-ridden process. Design files never resembled shipped projects because designers and engineers had different names for patterns and components.
To address these problems, I set out to create a design system. I made and presented a case for building a design system to secure executive buy-in. I researched design system efforts across the industry.
Using atomic design theory
After successfully advocating for a system, I organized and built the component library based off atomic design theory. By starting with the smallest design elements, or atoms, I was able to resolve the bulk of inconsistencies. This provided a solid foundation to build larger and larger components. Using this approach, I was able to establish component coverage for 80% of the product within a matter of weeks.
Establishing efficiency and consistency
After creating a base UI kit, I evangelized the system across the organization. Securing user buy-in came easily once designers realized how much time they saved and how much more energy they could devote to higher-level thinking. I kept an open backlog for the team to add components they wished to see in the system.
The system continues to boost efficiency, consistency and productivity at Dialpad.