Circuit - DEHN's design system of the lightning and surge protection professionals

Circuit

Circuit is DEHN's design system. It enables consistency, reduces redundancy and creates a shared language in and between cross functional teams.

At DEHN, we understand the importance of maintaining a consistent design across all our products while still staying as flexible as possible in the development process. Circuit, our innovative design system, is the solution. It ensures uniformity, minimizes redundancy, and promotes seamless collaboration across cross-functional teams, creating the best possible end result for our products.

However, while Circuit provides the structure and framework needed to create a consistent user experience, it is also essential to embrace flexibility. This allows us to break design rules when necessary, enhancing our products when the situation demands it.

To create a successful design system, it is crucial to collect every component over time and consider every possible combination, describing both their appearance and functionality. This is an ongoing process to which everyone involved in the project should contribute—from developers to designers and everyone in between.

In this way, our design system can provide the consistency across products that is vital to our business, while also allowing for necessary improvements and adaptations. This approach ensures that every product DEHN creates is the best it can be, making the development process both efficient and effective.


  • Electrons
  • Atoms
  • Molecules
  • organisms

Wayfinder

This website has been set up to provide a central location where all relevant information and resources of Circuit can be easily accessed and updated. In practice, however, it can happen that the files and subsystems of the design system and especially the repositories and libraries of the product teams, which are only linked to the system, are spread over several locations. To better organize and streamline access to these resources, we have compiled a list of all relevant links on this page.

Figma

The provisionally completed system. All components in the main branch of the respective file have been completed, at least from a design perspective. Drafts and elements that are still under discussion can be found in sub-branches.
Circuit Figma library


Product teams

Digital Commerce

As part of the Digital Commerce project, extensive libraries were created in Figma and Storybook.