Design Meeting Notes for 5 June 2019

These are the weekly notes for the design meeting that happens on Wednesday’s. You can read the full transcript on our Slack channel and find the meeting’s agenda here.


Gutenberg phase two

@kjellr let us know that The ability to Group and Ungroup selected blocks was merged in today. Also, temporary “Snackbar” notices have been introduced.

A reminder that the experimental Gutenberg widgets page is live and in the plugin, feel free to leave feedback or follow along.

@mapk would like some more thoughts on category labelling and grouping for blocks.  

And finally: @joen’s “clickthrough” PR to help improve nested block interaction is sorting out some technical details, and will land soon.

For further reading on these points, check out Friday’s update.

@karmatosed reminded us of an additional plan to run a usability testing table for Gutenberg at WCEU, as planned at the WCUS table last year.

Block directory

@melchoyce mentioned there are lots of chatter going on regarding block directory and the comments are helping updating designs in Figma. A new post on this will be up at the end of the week, in the meantime, keep commenting on GitHub.

On the same topic, @marybaum volunteered as a copywriting organizer to audit all the new strings. The audit will be helpful when handling the temp strings to dev, as G 5.2.2. is expected to launch by June 25 or 26. And testing of the new strings should start by early July.


WCEU contribution day tasks

@karmatosed came up with plan based on feedback for the design table at #WCEU.


  • Welcome and guide to everything you need to know to contribute to design: quick under 30 mins – @karmatosed
  • Split into groups!
  • Gutenberg design group – @mapk
  • Figma library organizing group – @tinkerbelly
  • Possibly a testing group for block directory – by itself or done at the same time as triage facilitated by @karmatosed
  • Triage group: this will be done through Slack to give others an opportunity to join in/be visible – @karmatosed

Late afternoon

  • Get back together and have a chance to talk about what was done.
  • Wrap up.

Participants are free to sit in any group and change in between if they want to learn about something else.

Open floor

Experimental plugin

@kjellr developed a plugin that will allow us to experiment with designs. Figma is great for making static comps and simple prototypes. Trac is great for getting polished code published. But as a design team, we don’t have a great place for work that lies in between those two poles. This plugin + repo is a place to try out half-baked ideas in the context of WP-Admin

It works as a plugin – download & Install it – and can be used to:

  1. Try experiments. Download & install the plugin on a test site to give existing experiments a try. They can be activated on the settings page (`General > Design Experiments`). Each experiment includes a link to a GitHub page for discussion and feedback.
  2. Build and submit your own experiments. There are instructions in the repository for this.
  3. Share ideas. Submit mockups or written ideas, and maybe someone will run with it and build out a prototype.

The use of italics

As designers, we are exploring how to build a better text hierarchy for WP-Admin and Gutenberg.

Today we discussed italics and @kellerj mentioned a ticket with examples as to why Avoiding italic text is better for accessibility and readability and there are also talks about changing the use of italics in Gutenberg.

Our next steps are to define when the use of italics is appropriate – @melchoyce and to get a definite consensus on the text treatment for help text underneath form fields

Figma Library Organization

@drw158 gave an update on the library organization in Figma and they are almost done with all of the base UI components in WordPress/components.

Feedback and evaluation would be great (accuracy, consistent naming, constraints testing, etc). Next documentation will be added and deprecate the existing libs and publish new ones. @karmatosed mentioned that deprecated links need to be fixed or relinked also in the handbook.

Icons from dashicons GitHub have been added and there should be a new library called  ‘WordPress Meta’ for Meta components in Gutenberg.