Design meeting notes 13 Nov 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. You can join the Slack channel by following the instructions in our handbook.

@karmatosed starts off with two suggestions to keep us working more organised and focused.

Firstly, one of the common issues when starting to contribute or finding your way to is to discover what is going on and what the context behind it is. @michael-arestad suggest to add our focus projects to the Handbook, like full site editing for gutenberg for instance, it will be easier to read up, and could also include a timeline if known, links to where the work is happening and who is involved.

This could go hand in hand with the Make blogposts, that maybe the Handbook page can curate. The lead on a project would have the responsibility of keeping the info up to date as the project progresses. Meta has something similar at https://make.wordpress.org/meta/projects/

Secondly, @karmatosed suggests iterating and bringing our Trello board back from not being at the heart with a new workflow structure:

  • Inbox
  • Needs design
  • Needs feedback: this will be what we pull weekly meeting from
  • Building
  • Blocked
  • Icebox

The icebox could become a place where ideas go to die, but as @foletto remarks, that will happen anyway with some ideas no matter how we sort the project.

This also frees up the labels from being part of the workflow, and allows them to be used the way they are intended to.

Both suggestions will go up as proposal on the Make blog for further discussion.

A discussion about Github vs Trello spun off of this idea that will be continued at a later time.

Next, @mapk brings Gutenberg updates. Gutenberg 6.9 is almost out! Lots of things being worked on. Do note that the Gutenberg plugin v6.5+ needs WP 5.3 now.

For WP 5.4, there are some Gutenberg focuses left this month https://make.wordpress.org/core/2019/10/29/whats-next-in-gutenberg-november/. @mapk and @shaunandrews will run some usability tests on the new nav block, which is almost done.

Then, some interesting reading material was shared:

@hedgefield noted he would ask the team at Yoast that worked on this Gutenberg-based storytelling page if they had any wishes or suggestions to improve the workflow next time around.

And finally, @melchoyce would love some feedback on this idea for multi-block layout patterns for the block editor: https://github.com/WordPress/gutenberg/issues/17335

#meeting-notes

Design meeting notes for November 6, 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. You can join the Slack channel by following the instructions in our handbook.

Housekeeping

Because of time changes around the world, meeting times will be moved back by an hour. The new meeting times are now reflected in the welcome box on make.wordpress.org/design/ and are as follows:

Monday triage: 17:30 UTC
Tuesday triage: 17:00 UTC
Wednesday meeting: 19:00 UTC

Updates

Gutenberg

@mapk shared a recent update from @matveb about Full Site Editing. It’s a good primer to help people get started with contributing to Gutenberg Phase 2.

Design Experiments Plugin

@karmatosed invited folks to use and test the Design Experiments Plugin, where a few of our current projects can be found for testing.

The team also discussed where would be the best place to leave feedback on these experiments, and it was agreed to include a link to a post so folks can learn more about each experiment and know where they can leave feedback.

Open Floor

@joyously shared a bug in Gutenberg that affects the Media + Text block when RTL text alignment is enabled and an issue about the block inserter visibility when a left aligned pullquote is present in the new Twenty Twenty theme.

@mapk shared @francina‘s feedback on the About page.

@richtabor asked for feedback on a concept for adding block patterns on a document in Gutenberg.

#meeting-notes

Design meeting notes for Oct 30 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. You can join the Slack channel by following the instructions in our handbook.

Firstly @karmatosed would like to know if we are all OK with the design meeting time staying at 18:00 UTC in the winter. So far it seems so.

Next, @mapk reports that Gutenberg 6.8 is out with a performance boost and some cool new features. A monthly post detailing the next focus tasks will now also be published, with the post for November Gutenberg dev focus being up. Also, there is news about the efforts to support full site editing with Gutenberg.

@drw158 would like some feedback on a proposal to improve the button design that was merged in WordPress 5.3. Looks like an improvement already, but there are some factors to consider. Good discussion was had, results will be posted in the linked trac ticket.

@itsjonq has done work on designing a page header component, something in the Gutenberg style that could be used by folks using the wordpress/components library.

Finally, @boemedia wonders if there will be any remote contribution at this year’s WCUS. @karmatosed will write a post about that later. Everyone that will be at WCUS in person, have fun!

#meeting-notes

Design meeting notes for October 16, 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. You can join the Slack channel by following the instructions in our handbook.

Gutenberg

Gutenberg 6.7 was just released. Lots of bug fixes, a few experiments, and button gradients.

@mapk shared priorities for this week, feedback is :

  • Gradients: Theme support, classNames, custom UI
  • Full site editing: Site Title block, rendering engine, temporary template editing UI and start working on the multi-entity saving UI
  • Improvements to the link UI
  • Complex block interactions, which also require improvements to the selection mode, and better drag and drop

Storybook

During the chat @itsjonq brought up a discussion about storybook, which is a UI development environment. It’s a bit dev heavy, but for those interested you can learn more on the Storybook site. Q shared a great example of a date picker.

WP design guide

Q received some wonderful feedback last week about the importance of adding internationalization to the guide. It’s now been updated to support multi-lingual. You can checkout the starter Japanese one.

Anyone who is interested can reach out to become a contributor on the project. Just let @itsjonq know.

Gutenberg version in Core

@mapk would like feedback on whether we should state “Gutenberg version” or “Block Editor” version. Feedback would also be helpful on the best place to put that.

Repurpose ‘Hello World’ post

@nrqsnchz would love feedback on an issue about making a Gutenberg tutorial from the default Hello World post.

Testing WordPress 5.3 Release Candidate

@joyously shared an issue with select dropdown arrows having some visual issues. Slack link. A great reminder that during RC it’s helpful to test as broadly as possible. If you’re able to test that’d be awesome!

#meeting-notes

Design meeting notes for October 7, 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. You can join the Slack channel by following the instructions in our handbook.

Housekeeping

@karmatosed posted on make.wordpress.org/design details for the new handbook page for WordPress components. Everyone is encouraged to check it out and learn more about editing, adding and using the components.

Updates

WordPress Design Guidelines

@itsjonq shared the work he’s been doing on the WordPress Design Guidelines. The goal is to enhance and improve the current guidelines on WordPress.org.

These new guidelines can be found on https://wp-design-guidelines.netlify.com/foundations/. As of today, the guidelines only include Identity, Typography, Iconography and Colors.

In addition, the guidelines are open for everyone to contribute and add feedback and suggestions. The GitHub repo is located at https://github.com/itsjonq/wordpress-design-guidelines.

The team thinks the new guidelines would be a great resource for WordCamps, in particular the upcoming WCUS and WCTokyo. The importance of having this resource translated to other languages was raised and there’s already an issue to explore that.

Everyone is welcome to try the new guidelines and leave any ideas, thoughts or feedback on GitHub.

Figma Components Library

@drw158 shared an update on the Figma components library. The “master components” have been moved to a new page and have been locked, to prevent accidental edits.

But fear not, there’s a new “Sticket Sheet” page where we can all copy/paste and also see all of the components.

#meeting-notes

Design meeting notes for Oct 2nd 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. You can join the Slack channel by following the instructions in our handbook.

Firstly @mapk updates us on Gutenberg developments. Gutenberg 6.6 is live! The Inserter has a really nice help panel to preview blocks now. And lots of bugfixes. Priorities for Gutenberg development are discussed every week in the #core-editor channel, great for anyone wanting to stay up-to-date and lend a hand.

Next, @melchoyce is working on the About page for WordPress 5.3 and beyond. Work is being done to make the page more modern and welcoming, and more dynamic in terms of making it, using variables and consistent patterns to make it possible to change styles without a lot of manual work. The layout will probably be generic across each release, with colors and illustrations adding unique elements each release. Feel free to add feedback to the Figma file.

And finally, @itsjonq pitches a plan to improve the design team handbook pages with an open-source overhaul, offering code snippets and such, to make the experience more user friendly. His plan is to have it ready by WCUS. Feedback and volunteers are welcome, a Make post on the subject will be written soon. Exciting!

#meeting-notes

Design meeting notes for September 25, 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. You can join the Slack channel by following the instructions in our handbook.

Updates

Gutenberg design updates

The team pulls through some final issues and pull requests for the next big WordPress release 5.3 (due 12 November).

If anyone can help test these and provide any feedback that is needed, that would be awesome!

Twenty Twenty theme update

The sub page view in Twenty Twenty.

This new default theme has been designed by @anlino and a group of dedicated contributors have been working hard on it.

@paaljoachim raised there are some issues that could do with design feedback.

Especially the following tickets could use some design feedback:

Please leave your feedback or additional ideas in the comments below the corresponding ticket and help the design of the new default theme move forward!

Test the new theme!

It would be really helpful if people install the theme and take it for a test drive. You can download the latest version from Github.

HelpHub update

@estelaris is still focussing on the homepage and exploring lists instead of using the grid, which may solve many of the issues that HelpHub has.

View the first iterations in Figma and kindly give your feedback on:

  1. how you feel about the list approach.
  2. whether to use sidebar on homepage or not as it seems repetitive (is it accessible enough to only use link on the homepage).
  3. any other suggestion.

If you don’t have an account, please post a request for access in the design Slack channel.

#meeting-notes

Design meeting notes for September 18th, 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. You can join the Slack channel by following the instructions in our handbook.

Updates

Gutenberg

Gutenberg 6.5 has been released. Look for an update post tomorrow with details. This is the last full version that will be merged into WordPress 5.3, but please keep in mind that we’ll be working on new improvements weekly in the Gutenberg plugin. This update includes a new social block, border radius changes, changes to the block mover icons, and much more.

We’d love if you’re able to test!

Full site editing

Matias wrote a post about possibilities with the future of Gutenberg + WordPress. Well worth the read.

HelpHub

Estela Rueda shared a Figma design with updates to the Table of Contents page. Feedback is welcome! If you need access to Figma please let us know.

Discussion

  • Andrea Fercia shared a Trac issue related to tab structures not using tab semantics. Discussion is welcome in the ticket 🙂
  • JB Audras brought up a discussion related to extending the timeline for higher contrast form fields and buttons. The discussion related to finding a balance where we can push some changes sooner for Accessibility purposes. The team will followup in Slack with any further points as we seek to figure out what we can ship sooner.

#meeting-notes

Design meeting notes for September 4, 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. You can join the Slack channel by following the instructions in our handbook.

Updates

Gutenberg design update

  • Block patterns – Work is happening to breach into how to organize/design block patterns. This has been a long time discussion, and lot’s of dev-side improvements have been happening. An issue will be created shortly to get the design discussion going.
  • Gradients in buttons – Another Pull Request that needs design review for preset gradient functionality in the button block.
  • Usability testing videos – Last month usability testing was conducted, and the videos from that will be shared as a post in the next day or so.

Discussion

About pages

There’s been a post that proposed creating structure and strategy around the About pages. The goal is to have a smoother process around these pages, and they are an opportunity to showcase great design.

Ideally we could use Gutenberg in future releases to create the About pages for those releases. The obstacles seem to be dev related in terms of time needed. Lookout for a post sharing next steps this week.

WordPress 5.3 design feedback

There are several Trac issues that need design feedback for the next release of WordPress. The first one implements darker form field borders throughout WP-Admin. The second issue proposes some new, more accessible, button treatments. Ideally these should be evaluated together. Some discussion was shared on Slack, and further thoughts can be dropped into Trac.

Block Directory

There’s an issue to discuss where search should live in the block directory. Some additional discussion was shared in Slack, further ideas can be dropped into the Github issue, feedback is absolutely welcome!

Color swatch discussion

A question was raised in Slack related to selecting a color within the Color Settings of a block. When a color is chosen it’s hard to tell what the color is because the checkmark takes up most of the swatch area. In particular this makes it hard to tell if the selected swatch is a gradient. An issue was opened to discuss further.

#meeting-notes

Design meeting notes for August 28, 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. You can join the Slack channel by following the instructions in our handbook.

Housekeeping

There’s a new About Page in every WordPress release. @karmatosed posted an article to discuss this page. Please leave your thoughts in the comments at the bottom of the post. We will discuss this further in next week’s meeting.

Updates

Gutenberg design update

Gutenberg 6.4 was released this week. What’s new?

  • Af few Cover block enhancements
  • A new typewriter experience
  • Circle cropping on images!

And lots more.

@mapk could use some design eyes on the upcoming Replace Image dropdown.

The team is also working on multi-selecting non-consecutive blocks.

For anyone with some theming experience and CSS knowledge, there’s a discussion about whether to use inline styles or classes for gradients. Give your feedback in ticket if this is something you’re interested in!

Weekly Gutenberg ticket triage on Tuesday’s

If you want to help out with Gutenberg design: each week at 17:00 UTC, @mapk organises a triage session in the Design Slack channel.

@shaunandrews asks for feedback around the nav block settings.

Helphub update

@estelaris started gathering requirements from notes and Github and is ready to make mock ups of some templates.
She has some questions about the use of the anchor tag on the title: does it need to be visible? @melchoyce and @shaunandrews say yes, they use it to easily bookmark the url. According to Estela, the docs team is not aware of this use. A short discussion follows, and @itsjonq shows a great example of how this is used on Github. The people attending the meeting suggest proposing this as an alternative to the # that’s now used. If you have thoughts or idea’s on this, please leave them in the comments of this post.

Github shows a link icon when you hover a title

Mobile view issues for Helphub

The mobile view homepage for the helphub has issues, due to the large space that’s taken by the blue search section. There appears to be nothing else on the page. @mapk proposes to look at this site-wide, as other pages have this issue too. We therefore need a broader solution for mobile display. According to Mel Choyce, every instance of the blue banner is a different code base. If you have thoughts on this, please leave your comments here or in the ticket for this issue.

Open floor

Call for discussion around the full screen modal

@shaunandrews would love to see more chatter about the pattern of the full screen modal and its potential use. Read the Slack discussion on this topic and add your thoughts there or on the ticket.

#meeting-notes