A Few Tiny Steps Towards an Improved Writing Space at WordPress.com
A cleaner, more refined experience for the WordPress.com editor.
Today we’re proud to unveil some design changes to the WordPress.com editor. It has the same great features you’ve come to expect, but with a cleaner, more refined experience — and a few new improvements, like a distraction-free writing mode.
Welcome to our new distraction-free writing experience. We hope you enjoy it.
To give you a tour, I chatted with the two people who helped to create it. Joen Asmussen and Matías Ventura are two Europe-based computational designers at Automattic who have been designing different aspects of the WordPress.com experience over the past six years. It’s certainly come a long way from its very first prototype:
The editor as it looked with the launch of the WordPress.com redesign, late 2015.
… and we also know there’s still a long way to go!
JM: Much of what we know about design is grounded in experiences in the physical world, and you can learn a lot about a designer from the objects that they admire. I understand that your favorite designed object is a … door handle?
Joen: Hah, yes indeed! Or perhaps clarification is needed — one of my favorites. A guiding principle of mine is that the best design is invisible. It is functional to the point that you forget how it works: you just use it. The door handle is a design that has been honed for who knows how long — it’s easy to forget that it was once designed from scratch. And everyone knows how to use a door handle. That makes it a great design.
JM: What inspirations do you take from those objects to the work you bring to a digitally based product?
Matías: I think that same clarity of purpose and the ability to adapt to whatever complex ideas a person wants to express or achieve is something digital tools should seek to provide. The WordPress editor is a good example of this goal, because it needs to be immediately evident for someone who wants to just write yet also capable of fulfilling a varied spectrum of needs.
Joen: Products are never finished, and there are always aspects that can be refined or improved, the ultimate goal being to make using the product easier, faster, second-nature. If we can refine the editor to the point that its usage becomes second nature, we’ll have something great.
***
Today, we know that design is more about iteration than it is about perfection, but that absolutely does not stop designers like Joen and Matías from iterating with the spirit of perfection. And with the new set of refinements launching today on WordPress.com, one can definitely see that commitment to craft in action. Those refinements include:
- A new distraction-free writing mode.
- Your recent drafts available in the top toolbar.
- Better clarity on the saved state of a post.
- Permanently visible publish/preview buttons.
Together, we hope they will they help fine-tune the writing experience. (And if you have a self-hosted WordPress site with the Jetpack plugin, you’ll also be able to use the new editor features.)
The new editor experience we are launching today.
JM: What are you most excited about with this improved writing experience, and what do you hope most for the writer when they’re using it?
Joen: Everything has a right place. In this iteration, we’ve tried to find those places for the preview and publish buttons, as well as the post settings. By making the buttons permanently visible and the sidebar optionally toggled, my hope is that the combination will provide a seamless flow for both the person who just wants to write, as well as the person who needs to configure their post settings.
All the settings for your post or page are now pop out of the right side of the screen.
Matías: I’m glad we were able to bring back the notion of a distraction free environment that puts the content in the center. I’m also fond of the recent drafts menu next to the “Write” button, as it provides a quick way to carry on with your unfinished posts. These editor refinements have the potential to let your work on WordPress keep you deeply in the productive state of flow.
You now know the immediate status of your work as it is written to the cloud.
Your drafts are easily accessible, and always visible to work on quickly.
JM: Are there any other design evolutions or revolutions coming down the pipeline for WordPress.com that you can speak about?
Joen: There’s a group of us focusing on editor improvements right now in the WordPress community at large. The key bits are embracing “blocks” as a way to attach more advanced layout options to each section of a post, so people can easily and quickly write richer articles than they could in the past.
Matías: We want to make it easy, and pleasurable, to create any kind of content with the editor. I believe that the essence of design is about the intersection of culture and technology — and we’re doing just that with this improved writing experience. It is a privilege that this effort is being done within the diverse open source community of WordPress, it means you not only own your content but you also have ownership over the tools with which it is created.
JM: Thanks so much for your time, Joen and Matías! I’ve enjoyed using the new distraction-free writing experience and can tell you I definitely got this post finished a little faster than usual. You’ve given me new focus.
WordPress.com News 
It looks great but will take some time getting used to.
LikeLiked by 11 people
Congrats! I already noticed the changes and like them a lot! Looking forward to what else you are going to do with the editor.
LikeLiked by 6 people
I still prefer the traditional editor in the WP-ADMIN.
LikeLiked by 42 people
I wasn’t too crazy about it at first, but the changes aren’t so bad! Will just have to get used to everything being on the right instead of the left.
My only problem is that when I’m at the bottom of a post I’m working on (especially a longer one), it doesn’t always scroll to the bottom? I feel like I need more scrolling space down there. Not sure if that makes sense. I didn’t have this problem before the change.
LikeLiked by 8 people
We are aware of a problem with the text editor in Firefox, and will be pushing a fix to that shortly. Thank you!
LikeLiked by 11 people
Awesome, thanks!
LikeLiked by 2 people
This issue should be fixed!
LikeLiked by 2 people
Agree that traditional editor in WP-ADMIN beats this so-called ‘Improved editor’.
Every time I give it try, I have to fire up the traditional editor to get to the tools and options I use all the time as they are not in the ‘improved editor’, or I just can’t find them.
LikeLiked by 31 people
What bits are difficult to find or missing?
LikeLiked by 4 people
I’m going to be honest, the position and size of the publish and schedule button is completely wrong. It is even more difficult not to accidentally hit publish when you are trying to set up a schedule (even worse when using a touch screen and not a mouse) and given this is the one button you are going to use every single time you are writing a post it needs far more prominence in the design.
Also, why don’t the tools scroll down the page when you are writing long posts. To have to return to the top of the post to run the spell check or insert a link is just plain silly.
LikeLiked by 13 people
We’d like to revisit the publish button to see if we can improve it. Stay tuned!
They should — which browser are you using? Thank you.
LikeLiked by 5 people
Now that’s interesting. Yesterday that most definitely wasn’t happening. Now, they do stay visible at the top but yesterday they just scrolled off the page.
LikeLiked by 5 people
We pushed a fix very recently 😉
If you’d like to schedule with a button less close to the publish button, you can use the scheduling tool in the Post Settings sidebar.
LikeLiked by 5 people
That said, having a publish now button and a separate scheduling button would probably make like easier.
LikeLiked by 3 people
I see this as screen real estate saver for smaller mobile devices. For those who have been blogging for last few years, WP-Admin., works fine for my edit needs. I can see for those learning wordpress.com for blogging in past year or so, overwhelmed with too many buttons, choices.
I don’t see the Edit backend in terms of “distractions”.
LikeLiked by 14 people
Thanks, great that’s its still incremental innovation. Step by step going towards change makes most of us less resistant. 80% old 20% new
LikeLiked by 3 people
I find myself needing the access I get from WP-Admin rather more but I think the bigger thing is the needs of the mobile blogger are different from one using something like laptop or a traditional desktop pc which can’t be easily replaced by this more mobile friendly set up. You see this even on sites revamped for mainly mobile users where the desktop experience is somewhat reduced.
LikeLiked by 10 people
I like the new design. It is indeed clutter free, less distractions. Will need some time to getting used to the new interface.
I was thinking if there is or could be like a category altogether, which could be used as a draft folder. I mean hidden from the public view, where all drafts could be sorted and saved into. As such, I believe the categories that are in a blog show up on the site. Is there a possibility to create a category but not have it show up on the website? What say?
LikeLiked by 4 people
I’m not sure if hiding the settings, and putting it on the right instead of left should be called an improvement. I mean, what’s the difference?
And I don’t see any improvement concerning some tools that are only available in the WP-ADMIN editor, like inserting a poll.
Guess, I will still switch between the two, depending on my needs.
LikeLiked by 2 people
I’m fine with the wp-admin editor. I’ve tried the new editor in all its iterations and haven’t liked any of them. Any way I can get rid of the message about switching to the new, “improved” editor?
LikeLiked by 5 people
The post tools and features moving to the right hand side, is a welcome change. Thank you. I have some feedback:
The category list is showing up in alphabetic sort order. This is unlike how it shows up in the classic editor. Although the search filter is nice, but please see if you can provide an ability to keep the same classic sort look for categories. Otherwise it will be very hard to adjust.
Please change the “beep beep bop” terminology. You must have seen countless number of people complaining about it.
Setting the Featured Image makes it show up at the top of the editor (in a very large size). This takes up too much of the screen space for no good reason. This was one of the first gripe I had which made me not use the new editor. The same is still the case. The featured image at the top of the screen is really useless because it is also there on the right hand side (exactly like how it is in the classic editor). Please consider not showing the featured image at the top of the screen in the editor view.
LikeLiked by 7 people
Some good feedback items here, I’ve passed it on to the team!
LikeLiked by 5 people
Now that’s interesting…!
LikeLiked by 2 people
Looks better, but I agree with those who say this is best for writers on mobile devices. On my desktop, I prefer the WP-Admin space and don’t find it cumbersome at all—except that now the option to go there is at the bottom of the My Sites menu. Maybe that is to help newbie writers avoid a space that might be confusing to them. It’s all good, as long as you don’t take away the WP-Admin from us.
LikeLiked by 7 people
The revised editor showed up for me a few days ago and almost immediately I discovered distraction-free mode. Which I really like! But I like more that I *so easily* discovered it. Bravo!
LikeLiked by 2 people
As with all things it will take a bit of getting use to however it would have been nice to get a bit of notice. I signed in and there it was…. a bit confusing without an introduction.
LikeLiked by 2 people
It took me by surprise but I do like the changes. Can I bring up something related to the word press editor? I often work out of coffee shops using their WiFi and with that the wp-editor becomes very slow and often unusable. That’s due to slow WiFi. My workaround is to write in Microsoft Word off line, and then publish to word press, often as a draft. It would be great if I could use the wp-editor off line and then download when I want to. Might that be a future possibility? Its just a suggestion.
LikeLiked by 3 people
Great feedback. I know it’s not Word, but would our new Google Docs add-on work for you? You can also try the Desktop app, which should run faster as it runs off your local machine.
LikeLiked by 4 people
Thanks. I think the desktop app might be what I need to use. I also was not familiar with the google docs add-on.
LikeLiked by 2 people
I still at tims like to use the old WP editor, but otherwise, before the change, I liked that editor. Especially on a touch screen. This one is taking some getting used to for me, but I do like it when on my laptop, but now more frustrating on a touch screen.
LikeLiked by 2 people
I really like it. In my humble opinion, it looks cleaner and in a way, it feels more natural. Don’t know if I made much sense.
LikeLiked by 1 person
I like the revisions link on the new editor and the scheduler adjacent to publish –
LikeLiked by 1 person
This is great. Looks really nice. So cool to have this option or use the new Google Docs add-on integration. Great to see continuing improvements to the platform.
LikeLiked by 2 people
Where have the categories and tags moved to? Up till this update they were available on posts but now they have disappeared! Also the options take up all the screen space in portrait mode on Tablet, I’m having to work landscape (and keyboard takes up all the room) or continually switch to desktop mode!
LikeLiked by 3 people
I don’t understand why there are no styling buttons in the HTML editor. Why is that?
LikeLiked by 3 people
Watch this space 😉
LikeLiked by 6 people
Back to the way it used to be. Love it. Thanks.
LikeLiked by 3 people
One more feedback.
The editor processes html table and short codes, right within the Visual tab. It then throws lots of additional and unnecessary HTML tags in the html window. This is unlike how the classic editor reacts. It adds clutter and make it an unusable experience. Please look into it.
LikeLiked by 3 people
The new design felt strange at first since I was already used to all the options being on the left, but I love how I can access (and know how many at first glance) my drafts with the new interface. Haven’t used the distraction-free design yet, but it’s tempting me!
LikeLiked by 2 people
I like this one! Thanks! Keep up the great work!
LikeLiked by 2 people
It’s pretty. I do like how it’s clutter free. But, it doesn’t show my specific theme’s “post options”, so that requires me to log back into the classic version to use these options.
LikeLiked by 1 person
Hi Emily – which theme are you seeing this problem with – I’d love to look into this more and see if we can get it sorted out. Thanks!
LikeLiked by 2 people
I run the “Duet” theme.
So the 2 things missing are:
1. show in featured slider
2. disable two column format on this post
Thanks!
LikeLiked by 1 person
Thanks for the details Emily. We still have a little more work to do around custom options for themes like this.
LikeLiked by 2 people
I wish the editor also had free fonts we could write with or was presented with the font available on the theme as the old writing editor.
LikeLiked by 5 people
“Also, why don’t the tools scroll down the page when you are writing long posts. To have to return to the top of the post to run the spell check or insert a link is just plain silly.”
Commenting on this statement… I use Safari or Firefox and my toolbar does not come down with the text box. Sometimes there is a bar across what I am writing and I cannot find my place to continue with the post.
LikeLiked by 5 people
This is a very much welcomed features! Subtle but increased workflow and efficiency. I’m already a big fan of Medium’s writing tools and looks like WordPress is going the same way too, which is nice by the way. Thank you!
LikeLiked by 3 people
One thing that still irritate me much is the ability to select the images based on the ‘uploaded to this post’ like the classic editor. I have several contributors and editors working on posts and sometimes when I left the draft for a while, it’s gonna take a while to find the images already uploaded.
LikeLiked by 4 people
I’m hoping this pull request to add a “This post” filter to the media modal will merge soon.
https://github.com/Automattic/wp-calypso/pull/10466
LikeLiked by 8 people
That’s exactly what I’m looking for!
LikeLiked by 1 person
Will have to get use to it.
Is it possible to add feature that allows you to put in colums and tables in our posts ?
LikeLiked by 3 people
Great Design. Looks much better and comfortable.
LikeLiked by 3 people
Thanks
LikeLiked by 3 people
Seems look much better. Thanks for sharing
LikeLiked by 3 people
this is great
LikeLiked by 2 people
Not really feeling it but it does look cleaner. I would love to see the team work on something I have known many of us have expressed in the past. An automatic signature.
I close all my posts the same way and it is so redundant to write and then add the links Every Single Time.
If this has been done and I am the only idiot that is unaware please let me know.
LikeLiked by 1 person
I just wanted to add my voice to those saying whatever changes you make please don’t get rid of the old editor!
I do all my writing in Word because I want a local saved copy and it just works more smoothly. Then I paste into the WP editor and do all my formatting, adding photos, etc.
I do a lot of this online stuff on my tablet, and I actually find the old editor to be much more responsive. The more modern version tends to have odd delays and be kinda jerky, even though it’s apparently designed for mobile devices. Plus I vastly prefer the post preview to come up in a new browser tab, rather than as an overlay on the editing page. I often flip back and forth between them several times when polishing up a post right before publishing. Having to reload the preview each time is cumbersome.
This is not a complaint. Just a beg to keep both editors available so we have a choice and can find which works best for us individually.
LikeLiked by 5 people
Great but is the button “Get Shortcut” still missing? The one so practical in the old fashioned way..
LikeLiked by 1 person
Are you referring to the shortlink feature? That should still be there, in Post Settings, under Sharing. But only after you’ve published a post. Screenshot.
If that’s what you’re referring to and still not seeing it after publishing, let me know which browser you’re using, and I’ll take a look, thanks!
LikeLiked by 3 people
Yes that seems like spot on, thank you. Never fell for the former but allways got back to the old tool, ui.
LikeLiked by 2 people
I like the placement of the trash button in lower right corner in its own section. I always feared I’d click on trash by mistake. No more worries.
LikeLiked by 1 person
This much improves the Author Experience (AX) for WordPress.com. While WordPress is lauded for ease of use, the WordPress.com interface can be confusing and intimidating for new users. I teach WordPress classes, and while we concentrate on self-hosted WordPress, we touch on WordPress.com. It’s important to differentiated WordPress.com and WordPress.org and WordPress as Open Source Software, as Community, and as ecosystem.
You’d think that registering at WordPress.com would be a friendly and inviting experience, but it’s rather confusing for new users. Most WordPress trainers skip over this, but since WordPress.com accounts offer many benefits, it’s a central doorway into the ecosystem. Most of my students are totally lost after registering, and we just give them a tour, and move on to WordPress.org for the real deal…
This new UX for the default WordPress.com editor helps clear things up. Users just want to post content, they don’t want to spend hours trying to figure out a navigation system that pulls them in more directions than they can digest. Clarity is indeed the key word for this design, clearly presenting content editing, preview, and settings in an intuitive manner.
LikeLiked by 2 people
I figured I put this here BC I can’t find out where to put this.You keep changing up your website has messed me up when I tried to put up a new post up it kept bringing something else up. So when I tried to upload my post it wouldn’t do it but it finally did after like 5 tries after trying to fight this thing that kept coming up. Feeling disappointed. Just letting u know this. I like this site alot
LikeLiked by 1 person
One thing that’s missing, is the underline icon beside the B and i icons.
Underlining for hyperlinks, whether given as http addresses, or embedded into words / phrases, is crucial in identifying them as links (especially if embedded into text).
Not everyone is familiar with the keyboard shortcuts, or systems used on tablets (like the iPad); besides which, my iPad, for example, sometimes refuses to cooperate – and it’s only just over 1 year old!
Please (pretty please, with cherries on top) reinstate the underline icon 🐵
LikeLiked by 1 person
So far I like the new editor. I like how it prompts me to take care of the categories and tags part of my post first, so I get that out of the way. It used to be something I’d leave until the end and sometimes almost forget. Thanks for the update, posting is less of a chore now.
LikeLiked by 3 people
i’ve heard it explained as a good interface is like a good wait staff. they are there if you need them and otherwise, they stay out of your way. the new wordpress does a pretty good job of pulling that off.
LikeLiked by 2 people
What about basic features that the new editor lost, like the control for changing text direction beetween left to right and right to left?
LikeLiked by 1 person
Thanks for reporting this. We are tracking this issue here.
LikeLiked by 2 people
I do love the clean look of it and it is easier to use, so thank you.
LikeLiked by 1 person
Thank you very much for the hard work. I really do like like the changes a lot.
LikeLiked by 1 person
Whilst I generally prefer the traditional WP admin editior. The new editior certainly looks like it has a lot of promise.
LikeLiked by 1 person
Nice
LikeLiked by 1 person
wow.. nice work
LikeLiked by 1 person
As long as you don’t get rid of the old editor, I’m fine with it.
LikeLiked by 3 people
Thanks👌
LikeLiked by 1 person
Well, it sounds great.Thanks:D
LikeLiked by 1 person
Yay!
LikeLiked by 1 person
It’s nice and worth to try it
LikeLiked by 1 person
1. Certainly an improvement, getting the side bar out of the way.
2. The buttons on top should have tool tips to tell you what they are.
One, a star, brings back or removes the side bar, but why not say so? People are afraid to press an unknown button, it may destroy work!
3. Which is the preview? The small button saying view page? It shows nothing! Or the eye?
And how do you get back to the editor from a preview?
4. I would welcome the tool list to appear also on the HTML page.
5. Someone wanted columns and tables – in fairness these are there already via HTML and I already use them.
6. Finally, your support team have promised to look intio for me a far more serious problem, that the visual editor removes codes.
7. OH! and a warning — do not use the Avast browser, it cleans out the editor. I use opera.
LikeLiked by 2 people
I forgot. Also I am glad the tool bar no longer scrolls out of view.
LikeLiked by 2 people
I’ll be honest with you. I blog primarily on my computer, and I prefer your old editor. Whenever the new one appears I cringe and do whatever I can to click my way back to the original. Its design doesn’t bother me in the least.
On one hand I want to give your new editor a chance. On the other, I’m really reluctant to use it. Right now I want to avoid it until and unless it becomes my only option.
LikeLiked by 1 person
I’m so excited to try this. In the past, I’ve found I keep going back to the “original” editor, even though I truly love change and updates. Ready to give it a shot again Keep up the good work!
LikeLiked by 1 person
Is it only me who’s experiencing this irritating bug with the new editor? Every time I type a new line, it gets hidden BEHIND the opaque “Saved” bar that Joen, Matías, and other developers have put in the bottom of the writing space. When are you going to fix this annoying big thing? It’s making the whole writing experience very distracting, as I’m like a blind person typing and manually scrolling down with my mouse every 2 seconds.
LikeLiked by 1 person
Thanks for reporting this. We have deployed some fixes today to improve the behavior here.
LikeLiked by 3 people
I’ll have to read this post in more depth tomorrow, but it looks interesting.
Is there a way, or will there be a way, to specify runaround in respects to a photo? I come from a design background, so I wanted to left justify a photo and have the text runaround the photo in a pleasing matter in my blogpost, but I didn’t see any options for setting that up.
I’m also interested in subheadings and being able to add a tag line under the title of a post. Will that be something that will eventually be easy to do in your WYSIWYG editor?
Thnx!
LikeLiked by 1 person
wow .. sounds great
LikeLiked by 1 person
I use Chrome and also having trouble at the bottom of the page. It is very annoying and is really affecting my flow. Please also push a fix to Chrome. Making blog posts now is frustrating rather than fun.
LikeLike
Thanks for reporting. We deployed fixes to this behavior today. Sorry about that.
LikeLiked by 2 people
http://Www.ndaru@.com
LikeLike