An idea Joen and I have discussed a lot recently is providing users with a way to zoom out a level from the thing they’re editing in order to make more sweeping changes to the composition of their document.

This affordance can be a very useful tool when working with something like a template, where you might want to move a block over longer distances.

The notion of zooming out and revealing more of the “canvas” also creates an opportunity to introduce other features that perhaps do not fit in (or work so well) in the regular view. Pattern suggestion springs to mind as an obvious candidate.

A new Mode?

One way to add this feature to the Site Editor would be through a new Mode. Accessible through the menu in the top bar, or via an individual block’s toolbar, it would put these powerful features at a users fingertips in a variety of common flows.

Here’s a quick video mockup to demonstrate.

As the new Mode is engaged a number of changes occur:

1. Root level blocks are reduced in size, spaced out, and their Toolbars are hidden.
2. These blocks can be clicked to return to edit mode, or – if dragged – easily moved around the document.
3. When a block is selected in this mode, any contextual block patterns are exposed via a carousel.
4. Children of root level blocks are locked and cannot be manipulated.

Clearly there is a lot of work still to do here, but I think it’s an exciting concept because despite being such a powerful feature, it could be relatively straight-forward to implement in a piecemeal fashion.

Perhaps the initial iteration is only accessible while editing templates. Subsequent iterations can include pattern discovery for template parts, and then other block types. Finally the Mode can be introduced to the post editor as well.