ImageX: Drupal 7 vs. Drupal 10: An Objective Visual Comparison of Some Popular Website Features

Authored by: Nadiia Nykolaichuk.

Drupal 7 was released 13 years ago, during the Jurassic period in the world of modern software. However, as of April 2024, there are 322,700+ websites officially listed on drupal.org as still running on Drupal 7, which sadly makes it the #1 installed Drupal major core version but, luckily, this number is steadily reducing.

Talking Drupal: Skills Upgrade #8

Welcome back to “Skills Upgrade” a Talking Drupal mini-series following the journey of a D7 developer learning D10. This is episode 8.

Topics Resources

Chad's Drupal 10 Learning Curriclum & Journal Chad's Drupal 10 Learning Notes

The Linux Foundation is offering a discount of 30% off e-learning courses, certifications and bundles with the code, all uppercase DRUPAL24 and that is good until June 5th https://training.linuxfoundation.org/certification-catalog/

Hosts

AmyJune Hineline - @volkswagenchick

Guests

Chad Hester - chadkhester.com @chadkhest Mike Anello - DrupalEasy.com @ultimike

The Drop Times: A Conversation with Dominique de Cooman on Drupal, Mautic, Open DXP and Dropsolid

Join us as we delve into the realm of Dropsolid with Dominique de Cooman. Discover the driving forces behind their innovative integration of Drupal and open-source technology, and gain insights into the evolving landscape of digital experiences. From their founding principles to navigating Drupal's future, Dominique offers a candid exploration of Dropsolid's journey and its impact on the digital realm.

Dries Buytaert: Evolving Drupal's Layout Builder to an Experience Builder

Image removed.

Imagine a world where installing Drupal instantly offers a creative experience that allows you to build and style pages right out of the box, without any need for additional modules or configuration.

The introduction of Drupal's Layout Builder in 2018 was an important milestone toward this vision, but it was just the first step. Layout Builder provides site builders with a powerful drag-and-drop interface for creating and arranging content within customizable layouts.

Despite its success, there is a clear and pressing need to improve the existing Layout Builder. The numerous community-developed modules enhancing Layout Builder highlight the need for a more comprehensive solution.

That is why at DrupalCon Lille last year, I was excited to announce the "Next Generation Page Builder" initiative, aimed at improving and expanding the Layout Builder to provide a truly intuitive, out-of-the-box page-building experience.

Since announcing the 'Next Generation Page Builder', led by Lauri Eskola (Acquia), a Drupal Core Committer, we've done extensive research and planning.

Inspired by user feedback, we decided to make two changes. First, we decided to broaden our focus: not only will we improve the page-building features of Layout Builder, we will also integrate basic theming capabilities, enabling users to style their pages effortlessly without having to edit Twig files. Second, reflecting on this wider scope, we renamed the initiative from 'Next Generation Page Builder' to 'Experience Builder'.

In recent months, we explored several options for how to create such an Experience Builder, including accelerating development of the Layout Builder, switching to Gutenberg, adopting Paragraphs, or using the newly open-sourced Plasmic.

After thorough analysis and discussions with key stakeholders, including Automattic's Gutenberg team, the Drupal Core Committers decided the best approach is to expand the Layout Builder while also incorporating the best elements of Paragraphs.

Looking to the future, I hope the Experience Builder becomes the preferred Drupal tool for layout design, page building, and basic theming. Our main goal is to create a tool that site builders love, with an amazing out-of-the-box experience. By integrating key features from Paragraphs, we also aim to create a unified solution that reduces fragmentation, accelerates innovation, and ensures Drupal remains at the forefront of site building.

Our future success hinges on expanding Drupal's usability to a wider audience. Our CMS capabilities are often better than our competitors', but aren't always as user friendly. In the Drupal 7 era, Drupal was the OG (Original Great) of low-code but today we are being outpaced by competitors in terms of ease of use. Without user experience improvements, we'll lose ground. The Experience Builder initiative is all about introducing more people to the power of Drupal.

I feel strongly that a unified Experience Builder is one of the most important initiatives we can undertake right now.

Developing an Experience Builder is a big task that will require substantial effort, extensive collaboration, and significant expertise in user experience and design. As Drupal Core Committers, we are driven by a sense of urgency to advance this initiative. We are committed to moving quickly and iterating rapidly, but to succeed, we also need your support. There will be many opportunities for the community to collaborate and contribute to this initiative.

For more information, please check Lauri's latest blog post on the topic. Additionally, I will discuss this further in my upcoming DrupalCon Portland keynote in a few weeks.

Drupal Core News: Working toward an Experience Builder

At DrupalCon Lille 2023, Dries announced a new strategic initiative to build a Next Generation Page Builder. The goal of the initiative was to improve and expand Layout Builder to provide a truly intuitive out-of-the-box page building experience.

We have started defining what experience would look like by identifying user journeys from beginning to end, from customizing Drupal to match a brand and content strategy to creating and editing pages. We have identified that to provide the desired experience, we need to define a standardized way for builders and creators to transform designs into optimized digital experiences. To realize the Ambitious Site Builder vision announced by Dries in 2022, we are providing visual, browser-based tools that require minimal technical expertise. This will make it easier for users without prior knowledge about Drupal or coding to implement a digital experience with Drupal. Our working name for this is Experience Builder to highlight that the module seamlessly integrates a page builder and a theme builder.

With the Experience Builder, site builders can create fully customized pages and themes using no-code/low-code tools in the browser. It provides site builders, developers, and content creators a single platform to collaborate. Content creators are empowered to create and update content without having to reach out to a developer. Site builders can balance brand consistency and creative freedom by selecting which visual editor controls to expose to the content creator. As a result, anyone in your organization can easily build and update sites, accelerating time to market while remaining brand compliant.

To keep the out-of-the-box experience simple for non-technical users, Drupal will continue to optimize the experience for site builders without the need of building custom, code-based headless front ends. We are actively exploring ways for Drupal to enable JavaScript developers to work with Drupal without the need of managing a large custom code base. Meanwhile, we will still deliver capabilities that enable headless use cases and retain much of the work that has been done to enable headless use cases so far.

How should we build the Experience Builder?

The Drupal core committer team has decided to expand on our existing solutions. Incorporating the best features of Paragraphs into an expanded Layout Builder will provide a solution that can significantly surpass the existing options explored. We are still evaluating if there are smaller components that exist in other open source projects that could be utilized by the Experience Builder.

What options did we consider?

We researched the existing Drupal based page building solutions, as well as other open source projects to decide how we should realize the Experience Builder. We evaluated Paragraphs, Layout Builder, and Gutenberg using six criteria: expertise required to realize our vision, effort required to realize our vision, effort required to migrate existing sites, future-proofness of the solutions, how well it matches with our persona, and ability for market differentiation.

Gutenberg was the primary option that we considered adopting from outside the Drupal ecosystem. With the help of the Pitchburgh fund, I had couple long days of working sessions with a group of Gutenberg maintainers, as well as the team behind Drupal Gutenberg. We learned that there are many parallels between the problems the different teams are aiming to solve. However, Gutenberg is primarily built for the content creators, which is at odds with our promise to build a platform for the Ambitious Site Builders. Gutenberg would provide us a fast way to enable content creators, but would slow us down delivering on our vision for site builders.

From the Drupal-based solutions, Paragraphs has the largest user base. Site builders attribute this to its relative simplicity and flexibility to implement nearly any kind of design system. However, Paragraphs focuses solely on component composition and content composition, and therefore doesn't enable non-technical builders to control the display of structured data, or the page as a whole.

Layout Builder originally focused on providing site builders with a way to display structured data from entities using more complex layouts. For this reason, the out-of-the-box experience hasn't been optimized for content creation. As a result, some sites using Paragraphs also choose to use Layout Builder as a tool for builders to customize the page layout, leading to a less integrated UX.

All of the solutions we evaluated came with trade-offs. The core committer team decided to prioritize how well the solution would match with our Ambitious Site Builder persona and having an ability for market differentiation. Based on our research, evolving Layout Builder, and enhancing it with capabilities that exist in Paragraphs today best meets these criteria. This approach requires a lot of expertise and effort to realize our vision, in particular UX design, but makes it easier to migrate existing sites and integrate with other Drupal APIs and use cases.

Next steps

We have identified three lanes of work to implement the Experience Builder:

  1. Creating a revamped user experience that is optimized for creating pages using components, as well as defining the layout for structured data.
  2. Implementing a new mechanism for defining components, alongside blocks. Components can be defined through the UI as no-code components, or as code components. The experience for creating code components will be similar to Single Directory Components.
  3. Implementing a browser-based theme builder that enables site builders to implement themes custom to brand without leaving the browser.

Expected timeline and call for help

The core committer team is convinced that a unified Experience Builder is one of the most important initiatives we can undertake. We are committed to moving quickly and iterating rapidly, but we need your support to succeed. We know that with the help of the community, we are able to develop a proof of concept and demo of the new user experience later this year. The first release as a contributed module is targeted for the first half of 2025.

If you are willing to help fund this project, you can reach out to Lauri or Dries. If you are willing to help with the implementation itself, we are planning to set up a recurring meeting. Join the #layouts channel on Drupal Slack for updates and opportunities to contribute!

Subscribe to