Try Gutenberg and share your thoughts as you try to re-create a blog post – seemed simple enough. Even though I had missed the deadline for this, I wanted to give it a try to see how it worked, and here are my results.
Disclaimer: I tried using Gutenberg to re-create this post that was on Longreads. It looked pretty simple. Now, to clarify, I was doing this after hours, and after a tough day at work, which I think possibly makes my experience pretty close to what a possible business user may find when they try to use Gutenberg. And it was not great.
After a day lost to something which came up that was unexpected but very serious, my nerves were shot by the time I got started with this empathy challenge. Perhaps this is what a customer experiences in their day, they may have had plans to write that blog post for their business, but suddenly there was an issue with a product, or an unhappy customer or a supplier had let them down, so they ran around putting out fires all day and figured they would get to that ‘marketing’ stuff when they finished the important things.
After installing Gutenberg on my test site, I got down to creating the post and my initial motivation to get it done quickly disappeared. As I tried to replicate the very first thing on the post – centering the title of the article – it was just not possible – I thought ALL things were going to be possible with Gutenberg – so this was not a good start.
The next issue I ran into was trying to add another content block after adding the initial sub-heading
I just clicked below the sub-heading and nothing happened, no new content block appeared, no option to add a new content block, so I ended up looking around the screen trying to figure out what to do next, after a while I saw this:
Ah, a plus symbol, that must add something – so I clicked it and things looked so much better, some success – right so let’s add that image then:
So, I got to add the first image to the post – that nice full-width image you can see on the post I was trying to replicate, and I just could not get it to go full-width like the post I was trying to copy. No matter what I tried. Frustration. These full-width images are all the rage now, everyone is doing it, so why was I being restricted for some reason. I then went to see what some of my peers had managed to do, and actually found someone who had used the exact same post as I had chosen, and they were successful – now I was SUPER frustrated.
Right. Move on I told myself. Let’s see what it was looking like, so I decided to preview the post:
Nowhere near what I was trying to create, so if was using the Storefront theme (as per my demo site) for an eCommerce site, my blog post would be looking pretty different to what I had in my mind here if I was going for the layout of the original post. At this stage, I decided I would try to find a single column theme in the WordPress.org repo to try to recreate that layout – so headed over there and searched using the filters, one column and ecommerce:
And none of the initial themes shown there looked any different to the theme I already had. I tried installing the first one that come up (it must do what I filtered by surely, its the first results), exBlue, and previewed my post again:
Getting there, but now the one column layout was so wide, it made it hard to read the text:
And it was at this stage, after a already crazy day, that my wife asked if I was still working. I can imagine this happens often in the real world of our customers. So I stopped. Defeated.
What I took from it:
- It’s super hard to try using something when there is no documentation you can go to – so you don’t actually know what is and is not possible with the tool you are using
- Our customer’s lives are tough, running a business is tough, using our tools should be simple, not add to that ‘toughness’. Granted, I was trying to replicate something, and maybe Gutenberg is not suited doing that?
Automattic Design 