SkillsCategory

The new WordPress: Tammie Lister on Gutenberg, its design language and the importance of blocks

6 min read
Juliane Mueller

Have you heard about project Gutenberg? It’s the most talked about thing in WordPress. Gutenberg will be the biggest change to WordPress in years. It will bring a new publishing experience with a more modern, simplified content creation experience, with some big changes to the editing interface as well.

Tammie Lister, Experience Designer at Automattic and WordPress core contributor gave a talk about Gutenberg design patterns at this year’s WordCamp Europe in Belgrade. In this deep dive into Gutenberg’s design patterns, Tammie revealed that it’s all about blocks. “You should only have to learn how the blocks work, and then know how to do everything,” Tammie said in her talk.

We sat down with Tammie and talked about Gutenberg, its design patterns, and how important the WordPress community is.

Tammie Lister WordCamp
Photo by Stephen M. Blythe , released under CC BY-SA

How would you explain what Gutenberg is and what’s in your opinion the most exciting feature?

TL: I would say that Gutenberg is the entire publishing experience. That goes from writing a post to actually having that post live and also kind of doing any changes to that as well. And it will be eventually moving to a customisation, themes and the entire life cycle of a content. My favourite feature so far is the new user experience, but I also really like the blog library. That’s really amazing as well.

What are some of the core design principles of Gutenberg?

TL: Core design principles are foundations that we have learned from a lot of app-like experiences, but also I would say ease of use: Being able to understand one interaction and then being able to use it across the whole of WordPress. At the moment there are lots of different ways of doing different things and one of that foundation points is to unify that a little bit. Also trying to give developers something that they can use and build on top for users. And make it easier for people who just want to write a blog post without having lots of different plug-ins and different themes to do that.

In discussion about Gutenberg you often hear about blocks. What are blocks and what makes the Gutenberg experience so different with blocks?

TL: A block is a smooth snack of content, a small bit of content and that can be anything. It can be a widget. It can be ‘about blog’ or a custom HTML. It can be all these different things, but it’s a kind of an organised section of content that you can reuse where ever you want to do.

What’s the advantage of design patterns and how and how can developers and designers harness them in Gutenberg?

TL: Patterns in general are amazing, because we think as humans in patterns. If you remember, when you are learning to draw, people break things down to shapes and that’s how we learn. We actually have an amazing pattern recognition in the brains. It’s human, so it’s a real advantage for that, because it helps us understand its complex interface. Beyond that, having something that we can reuse and everyone can understand in a commonality between things, enables people and designers to really refine that. There is a phrase ‘the single source of truth’ to things like design patterns libraries and this is really true, because this is somewhere you can refine those designs and then you can use them. Updating helps then as well.

We’ve talked a lot about what’s is good in Gutenberg, but is there something you are missing?

TL: I think it’s important to get it tested from people who are just using Gutenberg and to learn about stress cases. We need to know about these stress cases we can make sure that the experiences encompasses those. There are so many different kind of ways that WordPress is used and to be able to take this usage and really understand that is when Gutenberg grows to be the fully fledged. We are in the first phase and after that it’s gonna be where the community takes it, where plug-ins take it, where themes take it. We’ve already seen this with themes having plugin suites. We’ve already seen this where it gets really exciting.

Did you implement the feedback from the community into your project?

TL: You have to. You absolutely can’t design in isolation. I personally have a practice where I look at the reviews and try and respond, because that contact with that feedback is really important. At the WordCamp US we’ve had a big usability testing area and as a project. As a community we are so close to the people that we make it for and we have to have that listening throughout the whole of WordPress. Gutenberg has kind of amplified that. WordPress today has got where it is, because of feedback. And that’s how we got the product so strong and that’s how Gutenberg will be strong as well.

What are the main issues that Gutenberg is going to solve and what is going to happen to the existing WordPress sites?

TL: As with anything with WordPress we have fallbacks. That’s why we need to know about these stress cases. We need to know about the issues and the combinations. We have so many combinations of plug ins and so many different types of WordPress. We limit those kind of problems and we can make sure that we have those fall backs. People shouldn’t be nervous, because as a project we test and we’ve really taken time to. Gutenberg will only go in as a project, when Gutenberg is ready. And as a result for that as phase one it’s ready. As a result of that it’s gonna be that refined system. It’s going to be having that feedback. You really have a complicated combination, maybe a client side. There is a classic editor plugin that can be used, there is also fallback to convert your content in a classic editor blog. So we had these levels to catch people and that’s really what WordPress is about, but we need that feedback as a project to really understand where people are using it, what people are experiencing and smooth out those kind of flows.

What would you like to see people use Gutenberg for in the future?

TL: I think I’m most excited about things I don’t know about, which is I’m excited about someone who is just writing a blog post and really enjoying Gutenberg, but also excited about seeing something I wouldn’t have imagined that Gutenberg is being used for. The unexpected things I’m really excited to see.