Skip to main content
Mediacurrent logo
Hero Background Image

Blog Post

Design System Integration with PatternKit

May 21, 2018

The UI Patterns module is gaining a lot of traction as an effective way to integrate design patterns and components with Drupal 8, but what if you are still using Drupal 7? The PatternKit module is a viable solution for your site.

Traditionally, integrating components from Pattern Lab or another design system solution requires a developer to create Drupal templates that map data to components. With PatternKit, the data mapping is handled in the Drupal UI. The user can select the type of component they wish to add to a page and complete the available fields for that element, cutting out the creation and maintenance of an intermediate template file.

Besides the fact that these modules are currently available for different versions of Drupal, there is also a difference in the way the UI Patterns and PatternKit modules are integrating design systems. The UI Patterns module turns your design patterns into plugins for your Drupal 8 site, which will create fields even if the component is not used on the site. The PatternKit module is focussed specifically on data mapping in the UI, so that fields and entity types are only created when a component is used. 

When PatternKit is ported to Drupal 8, the mapping approach might make this module a better choice for enterprise level sites.

Additional Resources
Inclusive Development: Using Style Guides to Improve Website Accessibility | Blog
UX Design Evolution: Top UI/UX Design Trends for 2018 | Blog

Related Insights