This is a meta-issue for tracking Miscellaneous UI issues for the Layout Builder module. Please open tasks for new issues using this one as the parent.

CommentFileSizeAuthor
#15 screenshot-2018.08.08-01-17-48.png168.93 KBscottsawyer
#12 layout-builder-highlight-section.png111.06 KBpixelite
no_background_when_dragging.png388.45 KBxjm
unsaved_changes.png125.19 KBxjm
cancel_layout.png138.02 KBxjm
placeholder_gobbletygook.png102.45 KBxjm
missing_sidebar_title.png94.67 KBxjm
unexpected_float.png681.88 KBxjm
block_labels.png76.75 KBxjm
manag_layout.png83.34 KBxjm

Comments

xjm created an issue. See original summary.

xjm’s picture

xjm
she/her
Primary language English
commented
Issue summary: View changes
larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented

Added #2936085: Remove 'display title' or make it unchecked by default for Field Block to children

xjm’s picture

xjm
she/her
Primary language English
commented
Issue summary: View changes
xjm’s picture

xjm
she/her
Primary language English
commented
Issue summary: View changes
xjm’s picture

xjm
she/her
Primary language English
commented
Issue summary: View changes
xjm’s picture

xjm
she/her
Primary language English
commented
Issue summary: View changes
larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented
Issue summary: View changes
xjm’s picture

xjm
she/her
Primary language English
commented
Parent issue: » #2884601: Add a Layout Builder to core
Related issues: +#2916877: Update Layout Builder CSS to match updated mockups

Note that there is also #2916877: Update Layout Builder CSS to match updated mockups which may cover some issues.

tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented
Component: layout.module » layout_builder.module
tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented
Issue summary: View changes

Linked issue summary https://projects.invisionapp.com/boards/KH3EPJMFNWR4Z

pixelite’s picture

pixelite
Primary language English
Location Montreal
commented
StatusFileSize
new layout-builder-highlight-section.png111.06 KB

I reviewed the updated designs from #11 and have some additional feedback (based on watching site builders use the layout builder for the first time):

The text "Add Block" is confusing to site builders who are not clear on the difference between custom/programmatic blocks or field content placed as a block. Other projects like WordPress's Gutenburg use a + symbol with the label "Add block" there for accessibility.

The interaction of clicking "Add Section" and then having to go to the right panel to choose a layout, and then having the layout appear on the page, is confusing. Some users click "Add Section" and then scroll down and get lost. Greying out the rest of the page temporarily to show the connection between the settings tray and the page layout would be useful. Something like this:

Layout builder interface

aaronmchale’s picture

aaronmchale
Primary language English
Location Edinburgh, Scotland
commented

I would definitely be in favour of a views-style message for unsaved changes, I made some changed to the configuration of some sections on a layout, and couldn't figure out why my changes weren't applying until I realised I forgot to save the layout, as silly as I feel I can't be the only one.

Version: 8.6.x-dev » 8.7.x-dev

Drupal 8.6.0-alpha1 will be released the week of July 16, 2018, which means new developments and disruptive changes should now be targeted against the 8.7.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

scottsawyer’s picture

scottsawyer
Primary language English
Location Atlanta
commented
StatusFileSize
new screenshot-2018.08.08-01-17-48.png168.93 KB

Another UI issue I discovered is if you add a view block with the settings to hide if no results ( as in, contextual filter based on the node ID "Action to take if filter value does not validate" = Hide View ), there is a blank space for the view in Layout Builder. In my case, I have 4 views, but one is set to Hide View. If they were all set to Hide View, I would have no way of knowing which block I was currently working with.

Layout Builder Views Block issue

What might make sense is to have an outline of each block when placed in the builder. Also, it should have a way to see the block name, maybe when you hover over the block, the block name is displayed?

aaronmchale’s picture

aaronmchale
Primary language English
Location Edinburgh, Scotland
commented

I agree with everything in #15 I have experienced this same issue and it becomes quite difficult to work with.

tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented

Can you make a dedicated issue for #15? Thanks!

scottsawyer’s picture

scottsawyer
Primary language English
Location Atlanta
commented
Related issues: +#2992410: Provide placeholders for empty blocks (for example, an empty Views listing)

No problem:

https://www.drupal.org/project/drupal/issues/2992410

tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented

I opened #2994909: Highlight active element while working with dialogs in Layout Builder for #12.

tedbow’s picture

tedbow
he/him
Primary language English
Location Ithaca, NY, USA
commented
Related issues: +#2085201: Use sensible block categories (rather than module-name categories)

I think #2085201: Use sensible block categories (rather than module-name categories) no is more important because layout builder adds more blocks and more users will see the list of the block and categories because configuring layout overrides will expose this to many more people than the block UI current does.

dead_arm’s picture

dead_arm
she/her
Primary language English
commented
Issue summary: View changes
Related issues: +#2960714: Improve ::generateSampleValue() for common field types, +#2929783: Review Layout Builder UI terminology, +#2920006: Research accessibility of drag-and-drop grid interfaces., +#2824026: Bartik floats image type fields left regardless of formatter
tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented
Category: Task » Plan

Thanks for opening/finding all those issues!

yareckon’s picture

yareckon commented

Opened an issue talking about Edit Mode and the bad discoverability of field formatters in Manage Layout that comes from relying on it. #2997821: Discoverability of Field Formatters Settings is Bad Using Layout Builder
Its hard to find where the formatters went

tedbow’s picture

tedbow
he/him
Primary language English
Location Ithaca, NY, USA
commented
Related issues: +#2968500: Change inline blocks workflow in Layout Builder to match mocks

Adding #2968500: Change inline blocks workflow in Layout Builder to match mocks which is really the same as #2998851: Make inline block creation a primary, distinct action in Layout Builder

I think @samuel.mortenson is going to mark #2998851 as a duplicate

andrewmacpherson’s picture

andrewmacpherson commented
Issue tags: +Accessibility

Tagging for a11y so I don't lose this. Though I think a separate "[Meta] layout builder accessibility" plan will be handy, I have a big brain-dump coming about that.

Version: 8.7.x-dev » 8.8.x-dev

Drupal 8.7.0-alpha1 will be released the week of March 11, 2019, which means new developments and disruptive changes should now be targeted against the 8.8.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented
Issue tags: +Blocks-Layouts

Tagging

rlmumford’s picture

rlmumford
Primary language English
Location Manchester
commented

Added this UI bug for blocks that have forms in them

#3056025

tim.plunkett’s picture

tim.plunkett
he/him
Primary language English
Location Philadelphia
commented
Status: Active » Closed (outdated)

Closing this meta since all bugs raised here have individual issues now.