FSE Program Back to Basics Summary

This post is a summary of the sixteenth call for testing for the FSE outreach program. As always, I want to highlight those who helped to bring others along with them in this latest effort: 

  • @piermario for creating an Italian translation so members of the Italian speaking WordPress community can participate.
  • InstaWP for allowing the outreach program to use their tooling for free, resulting in a much lower barrier to entry to help test and more room for creativity in coming up with the test itself. The features focused on for this test would have been much harder for individuals to set up without the tooling offered. 

High-level summary

Because this call for testing allowed for folks to explore different areas as much or as little as they wanted to, feedback was mainly caught up in the minutiae of larger features and experiences. Throughout each of these individual points, it’s very clear that an effort to take a step back and stabilize the following would go a long way in particular:

  • Better organization for block transforms so the options presented feel logical and relevant without accidental dead ends where you can’t switch back to the original blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.
  • Addressing efforts to improve the overall drag and drop feature to make it more predictable, smooth, and well integrated with tools like List View. This includes allowing an easy way to drag and drop images side by side with each other

Outside of the above, Patterns and Document Settings both received very little if any critical feedback, reflecting the strength of the current experience. For any designers and developers who want to see someone walk through the experience, I want to also mention the following videos from @paaljoachim to check out as you see fit:

Confirmed Bugs

The following bugs were found in the current experience, all of which were new: 

The transforms all worked as expected, however some of the transforms were not super intuitive at first but I think made sense after I understood what they were doing. The transform to columns on multiple clicks of it ended up creating many many columns blocks wrapped inside each other. It was not clear why columns was an option to transform to, but now I am assuming it is so that you can quickly wrap an element into a columns block.

@chopinbach  in this comment.

Another time, when I was looking to transform a heading, the “preview” would sometimes be cut off. You can see this in the below video, especially the preview for transforming it to a paragraph. What’s odd is that hovering up and down over the different options, it sometimes displayed correctly and sometimes not.

@clubkert in this comment.

It is a mystery to me when or why this happens. It seems to happen more when I drop to the end of the post, but it also happens when I drop the row between two paragraphs.

@robglidden in this comment.

Feature Requests 

At a high level, most feature requests related to better organization for block transforms as folks ran into various dead ends and clunky steps to switch between blocks: 

For the final item around having a way to revert to an original image, this stands out as particularly important to consider when one looks ahead at the various options potentially added to image alterations in the future, from duotone to object fit options. 

Changing a paragraph into any blocks can easily be reverted back into a Paragraph Block, except when it is changed to a Code Block. While one can easily unwrap a quote back to a paragraph, or revert a pullquote, a preformatted, a verse, a heading, or a list back to paragraph block. The same effortlessness is gone once the paragraph is transformed to a Code Block. Here one is faced with unintuitive options to operate on the Code Block (quote, preformatted, group, columns, custom HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites.). To transform the Code Block into a paragraph, it needs to be changed into a Preformatted Block first.

@franz00 in this comment

I cannot remove a crop on an image, only replace it with the original from the media library. I would like to be told a new image was created. It would be nice if the image block would be smart enough to have a “revert to original” button and know which image in the media library to revert to.

@robglidden in this comment.

General Usability

As mentioned in the high level overview, both drag & drop and block transforms were key items that recurred throughout this call for testing. This was particularly true when thinking about usability since, at times, transforms felt smooth and obvious whereas at other points it led you through what one described as a “labyrinth”. Drag and drop felt similarly inconsistent with the ability to both easily move a large collection of blocks in one moment and the next being unable to add a block to an empty Columns block. 

Text transforms generally worked fine, but feels a bit like a labyrinth. As there are different transforms based on what the current block is. It feels a bit random.  

@paaljoachim in this comment.

The transform to columns on multiple clicks of it ended up creating many many columns blocks wrapped inside each other. It was not clear why columns was an option to transform to, but now I am assuming it is so that you can quickly wrap an element into a columns block…Changing blocks to another type and eventually not being able to change back to the original type was somewhat frustrating, but not a big deal.

@chopinbach  in this comment.

It is sometimes strange when you want to move a section somewhere else in the list view with the mouse. The positioning is not always cleanly possible.

@hage in this comment.

One thing I noticed was the cover block gave me an option to convert it to an image block (which made sense). The other options were column block or group block. When I tried the group block, it didn’t actually transform into a group block. It created a group block on top of (or around? not sure what the right terminology) the existing cover block. This actually seemed useful. But isn’t what I would have thought by “transform.”

@clubkert in this comment.

Moving images is done successfully both by drag & drop the blocks in the List View, and by using the move up/down chevrons in the image’s Block Toolbar. But the image movement is failed when I use the Move to option in the image’s Block Toolbar. Or perhaps my expectation isn’t inline with its designated usage.

@franz00 in this comment

#fse-outreach-program, #fse-testing-summary