Drupal 8.2, now with more outside-in

Over the weekend, Drupal 8.2 beta was released. One of the reasons why I'm so excited about this release is that it ships with "more outside-in". In an "outside-in experience", you can click anything on the page, edit its configuration in place without having to navigate to the administration back end, and watch it take effect immediately. This kind of on-the-fly editorial experience could be a game changer for Drupal's usability.

When I last discussed turning Drupal outside-in, we were still in the conceptual stages, with mockups illustrating the concepts. Since then, those designs have gone through multiple rounds of feedback from Drupal's usability team and a round of user testing led by Cheppers. This study identified some issues and provided some insights which were incorporated into subsequent designs.

Two policy changes we introduced in Drupal 8 — semantic versioning and experimental modules — have fundamentally changed Drupal's innovation model starting with Drupal 8. I should write a longer blog post about this, but the net result of those two changes is ongoing improvements with an easy upgrade path. In this case, it enabled us to add outside-in experiences to Drupal 8.2 instead of having to wait for Drupal 9. The authoring experience improvements we made in Drupal 8 are well-received, but that doesn't mean we are done. It's exciting that we can move much faster on making Drupal easier to use.

In-place block configuration

As you can see from the image below, Drupal 8.2 adds the ability to trigger "Edit" mode, which currently highlights all blocks on the page. Clicking on one — in this case, the block with the site's name — pops out a new tray or sidebar. A content creator can change the site name directly from the tray, without having to navigate through Drupal's administrative interface to theme settings as they would have to in Drupal 7 and Drupal 8.1.

Making adjustments to menus

In the second image, the pattern is applied to a menu block. You can make adjustments to the menu right from the new tray instead of having to navigate to the back end. Here the content creator changes the order of the menu links (moving "About us" after "Contact") and toggles the "Team" menu item from hidden to visible.

In-context block placement

In Drupal 8.1 and prior, placing a new block on the page required navigating away from your front end into the administrative back end and noting the available regions. Once you discover where to go to add a block, which can in itself be a challenge, you'll have to learn about the different regions, and some trial and error might be required to place a block exactly where you want it to go.

Starting in Drupal 8.2, content creators can now just click "Place block" without navigating to a different page and knowing about available regions ahead of time. Clicking "Place block" will highlight the different possible locations for a block to be placed in.

Next steps

These improvements are currently tagged "experimental". This means that anyone who downloads Drupal 8.2 can test these changes and provide feedback. It also means that we aren't quite satisfied with these changes yet and that you should expect to see this functionality improve between now and 8.2.0's release, and even after the Drupal 8.2.0 release.

As you probably noticed, things still look pretty raw in places; as an example, the forms in the tray are exposing too many visual details. There is more work to do to bring this functionality to the level of the designs. We're focused on improving that, as well as the underlying architecture and accessibility. Once we feel good about how it all works and looks, we'll remove the experimental label.

We deliberately postponed most of the design work to focus on introducing the fundamental concepts and patterns. That was an important first step. We wanted to enable Drupal developers to start experimenting with the outside-in pattern in Drupal 8.2. As part of that, we'll have to determine how this new pattern will apply broadly to Drupal core and the many contributed modules that would leverage it. Our hope is that once the outside-in work is stable and no longer experimental, it will trickle down to every Drupal module. At that point we can all work together, in parallel, on making Drupal much easier to use.

Users have proven time and again in usability studies to be extremely "preview-driven", so the ability to make quick configuration changes right from their front end, without becoming an expert in Drupal's information architecture, could be revolutionary for Drupal.

If you'd like to help get these features to stable release faster, please join us in the outside-in roadmap issue.

Thank you

I'd also like to thank everyone who contributed to these features and reviewed them, including Bojhan, yoroy, pwolanin, andrewmacpherson, gtamas, petycomp, zsofimajor, SKAUGHT, nod_, effulgentsia, Wim Leers, catch, alexpott, and xjm.

And finally, a special thank you to Acquia's outside-in team for driving most of the design and implementation: tkoleary, webchick, tedbow, Gábor Hojtsy, tim.plunkett, and drpal.

Acquia's outside in team
Acquia's outside-in team celebrating that the outside-in patch was committed to Drupal 8.2 beta. Go team!

Comments

Hanmant (not verified):

Awesome!!!

August 23, 2016
Mike Herchel (not verified):

Looks amazing. Between experimental modules and semantic versioning, I feel that Drupal's velocity has dramatically increased. Good ideas!

August 23, 2016
phenaproxima (not verified):

Incredible work. This is long overdue in Drupal and I'm proud that it's finally happening. All the props to the UX team!

August 23, 2016
Nilanjan (not verified):

Great to see such big improvement of such great idea of progressive decoupling ...slowly Drupal becomes a platform rather only a CMS

August 23, 2016
thamas (not verified):

These are (or will be) nice things. But it won't be really useful without a fine-tune-able / very granular block management permission system. We have issue(s) about it. They need more presence and more helping hands.

August 23, 2016
zhilevan (not verified):

Wow, it is awesome.
Congratulations Dries :)

August 23, 2016
Paul Driver (not verified):

Clever stuff, keep up the good work.

August 23, 2016
Andrej Galuf (not verified):

Just 3/4 of a year into Drupal 8 and we're already seeing major UX improvements. This kind of change would require a contributed module in Drupal 7. The more I work with Drupal 8, the more I realize how much of an improvement it is.

August 24, 2016
Roy (not verified):

It's exciting to see how changing our process and focus, does indeed give us different results. Proud to be a small part of making this culture change happen: http://yoroy.com/pieces/new-process-new-results. Lets see what we can do for 8.3!

August 24, 2016
Dries:

Thanks for all your help, Roy. Great blog post as well. I just re-tweeted it.

August 25, 2016
Niraj (not verified):

Supper features. Great...!!!

August 25, 2016
Mohamed Z (not verified):

This looks great and it's a game changer. It would be also nice to be able to make theme/layout changes, for example resizing of the search field. This would be the real game changer for Drupal and it will be any other CMS.

August 25, 2016
Leo (not verified):

Fantastic work - this kind of thing will make a real difference to the quality of experience I can offer clients. As mentioned in the article, some design work needed, but I'm impressed at how quickly the functionality is falling into place and that makes me feel a bit more secure with the Drupal platform.

August 25, 2016
Peter S (not verified):

Sites running on 8.x that upgrade will still be administered/look/behave exactly as before - right?

August 25, 2016
xjm (not verified):

Yep, experimental modules are optional and disabled by default, in a special "Core (Experimental)" package. You can learn more about them on https://www.drupal.org/core/experimental.

Eventually we intend to provide this functionality by default in new installs, when it is finished, but there is a lot of work to do first. Even then we will not change an existing site's configuration in a disruptive way.

August 26, 2016
Bobby Ramdin (not verified):

That's an excellent move! Your "outside in" projecting to the business user, loving it. Working with events, magazines this is couldn't be more appreciated in just what seems a tech ocean of possibilities, however we adapt. Nice one for keeping it grounded! Well done Dries, webchick and team, you have re-ignited a much needed flame!
I need to write an article on this ASAP, and think up some scenario's.

Is there thought to making this technology available to more Drupal versions, like 7? I'm going to try it out once I get a moment, and provide some feedback.

August 25, 2016
Erwin (not verified):

When will we get in-place installation of modules?

August 26, 2016

Updates from Dries straight to your mailbox