Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improvements for Quick Inserter prioritizing patterns #40117

Open
Tracked by #31153
annezazu opened this issue Apr 6, 2022 · 13 comments
Open
Tracked by #31153

Improvements for Quick Inserter prioritizing patterns #40117

annezazu opened this issue Apr 6, 2022 · 13 comments
Labels
[Feature] Inserter The main way to insert blocks using the + button in the editing interface [Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced Good First Issue An issue that's suitable for someone looking to contribute for the first time Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.

Comments

@annezazu
Copy link
Contributor

annezazu commented Apr 6, 2022

What problem does this address?

Currently, the Quick Inserter prioritizes showing patterns in a few situations thanks to the work done in #38709:

  • We are editing a template either on site editor or post editor.
  • The inserter is at the root.
  • The content being inserted is between some block (not as first block nor as last).

However, there are a few rough points:

  • There's no indication that what you are looking like are patterns themselves when you open the quick inserter.
  • If you search the Quick inserter for a block when it is prioritizing patterns, there's no way to see blocks: https://youtu.be/ywpN_1VRrt4?t=208 You have to open the inserter.
  • The + button still says "add block". See below:

Screen Shot 2022-04-06 at 12 47 42 PM

What is your proposed solution?

I think there should be a few enhancements, pending design thought:

  • Consider updating the + button to have it show as "add pattern" when it's prioritizing patterns.
  • Provide a way upon searching the quick inserter to still add in an individual block.
  • Consider adding in some sort of intro text to the Quick Inserter panel to clarify that these are patterns one is looking at.

cc @jorgefilipecosta

@annezazu annezazu added [Type] Enhancement A suggestion for improvement. [Feature] Inserter The main way to insert blocks using the + button in the editing interface Needs Design Feedback Needs general design feedback. [Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced labels Apr 6, 2022
@jorgefilipecosta
Copy link
Member

Hi @annezazu,

Provide a way upon searching the quick inserter to still add in an individual block.

This is already happening if one searches for a block one can insert a block:
image

Is this behavior not working as expected in your tests?

@jorgefilipecosta
Copy link
Member

Regarding "Consider updating the + button to have it show as "add pattern" when it's prioritizing patterns." I opened a PR to do that thank you for catching this issue 👍

For "Consider adding in some sort of intro text to the Quick Inserter panel to clarify that these are patterns one is looking at." I think we would need some design help, maybe @jameskoster or @jasmussen have some insights?

@annezazu
Copy link
Contributor Author

annezazu commented Apr 25, 2022

This is already happening if one searches for a block one can insert a block:

Ah ha. There's some inconsistency but I can replicate this works for some blocks. For example, here's what happens when I search for quote or heading:

Screen Shot 2022-04-25 at 3 04 59 PM

Screen Shot 2022-04-25 at 3 05 50 PM

This is with a test site using WP 6.0-beta2 and Gutenberg 13.1.0-rc.1.

@jameskoster
Copy link
Contributor

"Consider adding in some sort of intro text to the Quick Inserter panel to clarify that these are patterns one is looking at."

Perhaps we can make it more obvious by optimising the dimensions for patterns. At the moment the previews aren't all that helpful because they're so small. I don't know if that means switching to a single column, or making the popover larger.

There's some work to be done around which patterns we surface too. In template editing, the patterns should be contextual to the current template. Also, does it make sense to expose header and footer patterns so prominently if the current template already includes a header and footer? I hope these are the sort of things that will make this feature feel more useful.

@priethor priethor mentioned this issue May 27, 2022
22 tasks
@Addison-Stavlo
Copy link
Contributor

Note another improvement regarding prioritizing patterns could be related to - #41397. Since right now prioritizing patterns over blocks when searching for template part variations like "header" results in options that just add blocks directly to the template, bypassing all the features provided by the template parts these patterns are expected to be contained in.

@mjsdiaz
Copy link

mjsdiaz commented Jul 22, 2022

I would prefer to have the same experience each time. It’s confusing to suddenly see patterns when I was expecting blocks.
I would like to always see blocks first with a button or such to switch to the patterns.

Or even better, there could be a choice to set it to one or the other, just as we can change other editor settings (full screen, code vs. visual)

@burnuser
Copy link

Different order of pattern and blocks in site- and post-editor reported as WCAG violation:
#47113

@annezazu annezazu added this to Polish Apr 28, 2023
@priethor priethor moved this to 💻 Needs development in Polish Apr 28, 2023
@annezazu annezazu removed this from Polish May 1, 2023
@jameskoster
Copy link
Contributor

The quick inserter should still surface blocks, even if/when Patterns are prioritised. This is a very frustrating experience:

A screenshot of the quick inserter. In the search field the user has typed 'Image'. The only results are patterns

@jameskoster
Copy link
Contributor

Perhaps the upcoming pattern-centric building experience (#50739) makes this feature (prioritising patterns in the quick inserter) defunct?

@richtabor
Copy link
Member

Perhaps the upcoming pattern-centric building experience (#50739) makes this feature (prioritising patterns in the quick inserter) defunct?

Yes, I agree.

What are the conditions to get patterns in the Quick Inserter? I think the Quick Inserter should always be the same experience, surfacing blocks with "Browse all" opening the Inserter.

@youknowriad youknowriad added the Good First Issue An issue that's suitable for someone looking to contribute for the first time label Jul 15, 2024
@jameskoster
Copy link
Contributor

Perhaps we should reframe this issue in that direction. What do you think @annezazu ?

@annezazu
Copy link
Contributor Author

I'm having a hard time understanding what direction is being referenced here for some reason.

I think the Quick Inserter should always be the same experience, surfacing blocks with "Browse all" opening the Inserter.

What does this mean exactly? What's "the same experience" in this case? I'm guessing that means removing the work to surface patterns contextually but want to be sure. Ultimately, game to shape this in whatever way makes the most sense to designers because I agree. It remains very frustrating not be able to just add a block when patterns are prioritized.

@richtabor
Copy link
Member

What does this mean exactly? What's "the same experience" in this case? I'm guessing that means removing the work to surface patterns contextually but want to be sure.

Yes, keep the quick inserter surfacing blocks with "Browse all" always opening the Inserter with the Blocks tab selected. That way when you press the blue + inserter within the standard editing experience, it performs the same actions.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Inserter The main way to insert blocks using the + button in the editing interface [Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced Good First Issue An issue that's suitable for someone looking to contribute for the first time Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

8 participants