Contrib.social

Adopt UI Patterns 2 to prepare developers and users for Experience Builder

Open on Drupal.org →
Created on 3 December 2024, 5 months ago

Problem/Motivation

We live in an exciting time for drupalers. New generations display builders, based on SDC, are coming, and Experience Builder → is currently discussed to be included in a future version of Drupal CMS.

However, when Experience Builder will be released (late spring 2025 at best), it will face the current state of existing SDC themes: messy templating, bad UI logic, incomplete or incorrect definitions... They are kind of OK for low-level Twig templates manipulation, but they are not good enough for display building tools like XB, with dynamic previews and typed data injection.

I noticed that because we will ship UI Patterns 2 → very soon.

Like Experience Builder, UI Patterns 2 is based on SDC and expects correctly built SDC components to make them work with Drupal API, in Drupal UI. But it is not a new display builder, it converts SDC components to configurable plugins (blocks, layouts, formatters...) to be used with existing display builders (Manage Display, Layout Builder, Paragraph Layout, Views...):

I have created many issues to help SDC theme owners about those problems:

But they are not enough because, as previously stated, without display building, there is not so much incentive to change code which is good enough when calling components only from Twig templates (node.html.twig, block.html.twig, field.html.twig...).

So, we need a solution to prepare the ecosystem to avoid such disappointment.

Proposed resolution

UI Patterns 2 is nearly ready, the first Release Candidate is planned for Christmas, final 2.0.0 is planned for January.

Including UI Patterns 2 in Drupal CMS, as soon as January 2025 will allow:

  • SDC-based themes owners to adapt their components to make them work with display building tools
  • also, it will teach Drupal CMS users (site builders or content contributors) to manipulate SDC components from the UI they are already comfortable with (blocks, layouts, formatters, views..). It will educate them about the philosophy, and they will only have to learn the (superior) UI/UX when Experience Builder will be available.

So it will be more comfortable and progressive change management.

We believe UI Patterns 2 has the quality level expected for Drupal CMS:

  • is a module in development since mid 2023, built by a team strong of 8 years of experience in working with UI Components and design systems in Drupal, and led by me, pdureau, co-maintainer of SDC in Core.
  • is already used in production by agencies since September 2024, with tremendous success. It is already covered by 94 phpunit tests and the code coverage is still growing.
  • has no documentation yet, but will be fully documented, using the new Drupal documentation system, in the next 3 weeks.
  • has only one packagist dependency, which is already a soft dependency of Drupal Core (for JSON API & SDC), and the only packagist dependency of Experience Builder
  • has many features suitable for Core inclusion: 🌱 [Meta] List of related core issues Active . We will propose them for Drupal 11.2
  • has a Release Candidate issue to check compatibility with XB : 📌 [2.0.0-rc1] Compatibility with XB Active . It is a very small issue, we are confident we will get along.

What do you think about this proposal??

✨ Feature request
Status

Active

Component

General

Created by

🇫🇷France pdureau Paris

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @pdureau
  • Comment 5 months ago →
    🇫🇷France nod_ Lille

    This will also allow themes to be much more reusable, making it possible to deploy a SDC-based theme configuration through a recipe

  • Comment 5 months ago →
    🇫🇷France pdureau Paris
  • Comment 5 months ago →
    🇦🇺Australia pameeela

    @pdureau thank you for this proposal! Just FYI, we are just one day away from a commit freeze for the RC release of Drupal CMS on Monday, and from there, we won't be able to add any major new features until after version 1 is released on Jan 15.

    Right now, the leadership team and track leads are pretty focused on getting ready for this, as you might imagine! Happy for any discussion to occur in the meantime, just wanted to let you know, in case it is a bit quiet in here for a while :)

  • Comment 5 months ago →
    🇫🇷France pdureau Paris

    Thanks Pamela for the notice. I totally understand the situation. Let's focus on delivering the first releases of both Drupal CMS and UI Patterns 2, and let's talk again about possible synergies when possible.

  • Comment 3 months ago →
    🇫🇷France pdureau Paris

    Congratulations for Drupal CMS 1.0 🥳

  • Comment 3 months ago →
    🇺🇸United States dalemoore

    I would like to co-sign this request. I first started out trying to integrate components in our new flagship site a few months ago, and started using Single Directory Components for the job. I love this new addition to Drupal, but incorporating them into the site is painful. Having to create a new Twig template every single time you want to call values from a field, block, or whatever as an SDC is cumbersome to say the least. I was finding myself repeating the same Twig code over and over across content types, fields, etc., which Twig's extend capability is helpful with, but it means what's setup in the Drupal UI under Manage Display or in Layout Builder is no longer 1:1 with what's in the Twig template. It feels very "un-Drupal"-like working this way. We really need something like UI Patterns in Core to get the most out of their use. Experience Builder is many more months away and while it seems to be able to eventually control the entire layout of a site, not just the content area like Layout Builder, it remains to be seen if everyone would adopt it. And I imagine it will take many years for it to fully replace everything if that's the goal. Putting something like UI Patterns in Core will work for now. Just my 2¢.

  • Comment 3 months ago →
    🇺🇸United States Kristen Pol Santa Cruz, CA, USA

    Note that the Experience Builder 1.0 is targeted for July.

  • Comment 3 months ago →
    🇫🇷France pdureau Paris

    Note that the Experience Builder 1.0 is targeted for July.

    And UI Patterns 2 is targeted for next week 😉 (February the 4th)

    The 2 projects are not in competition, UI Patterns 2 is not a display builder like XB but a plugins provider for the current display builders (Block layout, Manage display, Layout Builder, Paragraph Layout, Views...).

    6 months is a long time away, so it gives us time to help the SDC ecosystem to be compatible with display building and site builders to get use of the concepts. If you check the current state of SDC themes, most of them will not work well with display building because of missing variables, unknown variables, template logic issues, JSON schema mistakes... It will hurt Experience Builder(or any other new generation display builder) adoption.

    So, I maintaining my proposal :)

  • Comment 3 months ago →
    🇦🇺Australia pameeela

    Hey @pdureau thanks for coming back to this!

    For my part, I don't really understand what it would look like to adopt this for Drupal CMS. I do realise that the two are not completely incompatible, but there are large parts of UI Patterns that would be somewhat obsolete with XB (in terms of providing plugins for other display builders like LB that won't be needed).

    So given that as you say, it's not a display builder, what would this look like?

  • Comment 3 months ago →
    🇫🇷France pdureau Paris

    So given that as you say, it's not a display builder, what would this look like?

    It provides SDC components for the existing display builders:

    • Block Layout: as blocks
    • Manage Display: as field formatters
    • Layout Builder: as blocks, layouts and field formatters
    • Views: as styles, rows and field formatters

    So, it doesn't offer a brand new "experience". It just plugs SDC to the existing UI tools. That why I believe it will be a nice and softer transition from old school display building.

    UI Patterns 2.0.0 was released yesterday by the way. Here is the documentation: https://project.pages.drupalcode.org/ui_patterns/

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024