When:
to
Room:
Room 6
Tags:
development & coding, modern javascript, user experience, accessibility, & design
Track:
SVG
m&b icon_new brand
coding & site building

Drupal, the first design-system native CMS

Drupal, the first design-system native CMS

Pierre Dureau (Pdureau)

Drupal Core is accelerating its adoption of design-system related API started in 2023 with SDC, revolutionizing its theming workflow. Inspired by UI Suite proposals, our beloved Drupal is becoming the first design-system native CMS.

Prerequisite
Some notions about Web Design Systems.
Some knowledge about Drupal theming.

Outline
Design systems are a great way to streamline the web development process and ensure consistency across different applications by documenting shareable UI artefacts. However, implementing a design system in a Drupal theme was challenging until now.

Fortunately, new design related API are landing in Drupal Core: SDC for UI Components in 2023, Icon API in 2024, Style Utilities in 2025…

We will have a look at the current state of those API, their usage in Core and Contrib, and where we are heading next.

We will see how those new API are decoupling the theming from the Drupal app, improving the front-developer experience and productivity, and making themes reusable and shareable.

Finally, we will have a look at the display building tools of today and tomorrow, to understand how to use such a Drupal theme directly in Drupal API and Admin UI, without any glue or workaround.

Following my “Design System, the Drupal way” talk in DrupalCon Atlanta and my promotion as Core Committer - Front-end Manager, this talk show how the proposals shared there are becoming an ambitious 20 months roadmap for Drupal Core.

Learning Objectives
- Understand the full scope of a Web design system
- Implement a design system in a Drupal theme (increased maintainability)
- Use a design system implementation directly in Drupal admin UI (increased productivity)

Experience level
Advanced