WordPress community has been actively participating to help make the new editor for WordPress. There’s lots of activity both in Slack and at GitHub. It’s an incredible time to contribute.
Here’s the meeting summary for this week’s editor team meeting (agenda here) in #core-editor Slack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel.
Let’s keep working on the UI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. prototype — Gutenberg UI prototype. Some ideas for improvements discussed in the meeting are mentioned below:
- Five of them: I (@mrahmadawais) suggested that we should try to consolidate the multiple toolbars, so there aren’t five.
- Text vs. Block Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.: Mel (@melchoyce) also felt that Gutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ UI prototype does feel heavier, she also suggested that the text shouldn’t feel like a block.
- Blocks Or Not: I tend to agree with her considering it’s hard to think about aligning text across multiple blocks — maybe it’s the
block feeling. That said, Weston (@westonruter) said that the different toolbars can be contextual to the block being edited.
- Selection: @aduth pointed out that selecting all isn’t doable at the moment.
- Accessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility): @iseulde suggested the docked contextual toolbars make more sense from the accessibility point of view.
- Survey: @androb ran a survey — People found the Editor with light colored toolbars to be easy to use.
- Accessibility:@afercia pointed out that about accessibility standards — contrast ratio should be at least 4.5:1.
Ease of Use
- Copy/Paste: @dave_navarro noted that Gutenberg UI prototype isn’t an intuitive UI when taking data from multiple sources (newswire, press releases, etc..) especially with a lot of cutting, copying, pasting involved.
- Safety Net: A few folks suggested that simple fall back editor should be there as a safety net.
- Rich Content: @joen pointed out that one goal of the project is to make it easy to write posts and help people write truly rich posts with ease; which doesn’t mandate inline toolbars or heavy block outlines on hover.
- UX UX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it. Question: Do we need every paragraph and every image to be its own block?
- The power of Blocks: @sirbrillig suggest that the power of blocks actually comes up in dealing with complicated block type things which previously had to be shortcodes.
- Text Block: Consider having a growing “text” block, instead of multiple small paragraph blocks.
- Word Count: Looks like many folks would love the “word count” to still be visible somewhere on the screen. — suggested by @androb
Eliminate the Preview
- No Preview: @dave_navarro said that the step of hitting preview and switching to another tab to see what it looks like is what he would like to eliminate.
- Ella’s approach for outlines: Let’s that is, have none, or very faint ones that fade out super fast.
Editor Mode + Layout Mode
- Two Modes: I (@mrahmadawais) think, perhaps there can be two modes of the new Editor A) For Writing B) For layout.
- Use Case Specific: @sirbrillig agreed that in the case of long-form writing an editor mode would probably be more appropriate than a full-page preview of the layout. But it depends on the use-case.
- Full-bleed Images: How would you do a “full-blood image with peephole scrolling” with a theme layout? — Joen (@joen)
- Multi-Modes: That option might be worth exploring only after we’ve exhausted the current “block-first UI” approach — @joen
Apart from all this, flexbox is being considered for the front end design, but there’s a good deal of discussion about IE compatibility and stuff.
Joen (@joen) pointed out that some great work has been done by @chopinbach, @johnpixle, and @annaharrison 👏
Let’s test Andrews great new prototype! — show it to your neighbor, use it yourself, take it through its paces. Take notes, and let’s reconvene!
P.S. If I missed anything, let me know in the comments.