WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.36k stars 4.13k forks source link

Interact Mode (interact with site without leaving editor) #65293

Open Sirjazzfeetz opened 1 week ago

Sirjazzfeetz commented 1 week ago

What problem does this address?

In the site editor, all links and buttons are inactive:

image

image

Clicking "view site" by opening a new tab or navigating back via the site icon, does get around this:

image

image

The Problem: You can't see nor feel how a site actually functions; simulate user navigation and interaction. There is no direct experience. Managing another tab or navigating menus, increases total number of clicks. Being forced to exit the editor hurts workflow. Returning to the classic user interface and menu can confuse. There's too much context switching.

What is your proposed solution?

As shown, classic mode has already solved this problem. But I don't want to keep switching back to classic. Site Editor (sidebar menu) navigation provides indirect experience, which seems a step back from the direct experience of classic. So a quicker, seamless way to toggle between editing and testing. A cursor mode, "browse" or "navigate" or "interact", alongside edit/select:

image

mtias commented 1 week ago

Check out #23328 and #36667 for some background history

Sirjazzfeetz commented 1 week ago

Thanks @mtias, I see you initially (Dec 19) suggested this feature, but quickly changed focus to work on navigation structure, then displaying that in the site editor sidebar. Understandable, since a visual grasp of site structure was required and wasn't suited to the top menu, plus the side editor was a mess at the time and deserved such focus. However, during the development of this "browse mode" (live Feb 23) the navigation 'cursor mode' was removed, and the browse 'cursor' mode issue closed.

mockup from 2020 by MichaelArestad:

image

To reiterate, there's still no direct experience or real-time navigation and interaction possible;

The Interactivity API is for the frontend of blocks, not for the block editor. This means the API is not expected to be used inside the edit function. It’s a way to create interactive user interfaces for site visitors. Having said that, we’d like to explore whether some directives could be reused across the frontend and the editor to unify the whole block developer experience.