Contrib.social

Milestone 0.1.0: Experience Builder Demo

Open on Drupal.org →
Created on 12 June 2024, 5 months ago
Updated 20 September 2024, 2 months ago

Purpose:

  • Hosted demo solution on Drupal.org, start building excitement around the experience builder
  • Help agencies to contribute to the initiative

When: BY DrupalCon Barcelona 2024
Not included:

  • An easy way to install
  • Backwards compatibility, migration
  • A way to save the changes to the page

Requirements:

  • Hosted demo without authentication
  • Updated page building experience that looks modern and is competitive in the market

This first demo will focus on content creation experience from the lens of a Content Creator or a Content Manager. We can use this Blook.li demo as a benchmark, meaning we should have a URL where we can point users to, and they will be immediately launched to the Experience Builder editing experience. In other words, the user can edit a single page with a predefined design system.

In order for this demo to be successful at generating excitement, the user experience should be competitive with competitors like Gutenberg, Plasmic, Builder.io, and Framer. It needs to have a sufficient amount of components, as well as configuration options to be able to handle a realistic page. The demo should mix both unstructured and structured content (i.e. structured fields and components from this example: https://www.figma.com/board/GChEUDKRkzf5g01cyRbGHV/Component-types?node-...).

When user lands on the demo, they should see Experience Builder with this page as the content: https://www.figma.com/design/aADVsc8fdsENnUaKePvVpg/Experience-Builder-D...

In order for someone to construct a page like this, we'd need to have the following editorial capabilities within the Experience Builder:

  • Adding new components
  • Adding new components to a slot
  • Removing components
  • Editing component prop values
  • Re-ordering components
  • Selecting a component variant
  • Attaching images / media

User stories targeted for 0.1.0, and how we're tracking towards them):

  1. 🟠
    As a creator, I want to add components to pages using an intuitive interface, so that I can create engaging and dynamic layouts that effectively communicate my message and engage with my audience. This includes features such as a drag-and-drop interface, customizable settings for each component, and seamless integration with other Drupal features such as media management.
  2. 🟡

    As a creator, when I'm editing content, I want to see a real time preview of what I'm editing. Custom component code should not have to be aware that it may be rendered in the page builder.

  3. 🟡
    As a creator, I want to be able to use images from the Drupal Media Library so that I can create more engaging and unique content.
  4. 🟡
    As a creator, I want to be able to insert new components and change the order of the components, and move them from one place to another on the page. This will require actions for drag-and-drop, clicking with mouse, and keyboard.
  5. 🟢
    As a creator, I want to be able to nest components. For example, I want to render an accordion which contains text within a two-column layout.
  6. 🟢
    As a creator, I want to select a variation of a component. For example, I want to select a dark or light variation of a card component.
  7. 🟢 needs 💅
    As a content creator, I expect to see both a visual and a structural (e.g., a hierarchical tree) representation of my page layout and content (at the same time). I should be able to use the structural layout to edit the content. E.g., change the order of components, delete, duplicate, etc.
  8. 🚫
    As a content creator, I want to edit meta fields directly within the page builder interface. For example, the menu links and URL alias should be editable on the same page as the page builder.
  9. 🚫
    As a content creator, I want to edit fields directly within the page builder interface. For example, the title should be editable on the same page as the page builder. I expect the page title to be displayed in the preview.
  10. 🟢
    As a creator, I want to be able to trial and error when making changes. This can be enabled by undo and redo functionality which can be triggered without saving content. This is not the same as revisioning, this is more like CTRL+Z and CTRL+SHIFT+Z in text editors. Changes in between different save states are only retained as long as the user remains in the Experience Builder.

Prioritized backlog:

  1. Assigned to: utkarsh_33 🐛 The XB annotations and labels should not change size when zooming Needs work (2.)
🌱 Plan
Status

Active

Component

Page builder

Created by

🇫🇮Finland lauriii Finland

Live updates comments and jobs are added and updated live.
  • Needs issue summary update

    Issue summaries save everyone time if they are kept up-to-date. See Update issue summary task instructions.

Sign in to follow issues

Comments & Activities