Design meeting team notes December 2, 2020

These are the weekly notes for the design meeting that happens on Wednesdays. You can read the full transcript on our Slack channel and find the meeting’s agenda here. You can join the SlackSlack 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 by following the instructions in our handbook.

Housekeeping

We have an open call for note-takers and triage facilitators. These both are great ways to get involved for new contributors but everyone is welcome to help out. Let us know if you are interested in the comments.

The team is also looking forward to a holiday break, a post about this will follow the notes.

Announcements

Release 5.6 is scheduled for 8 December, this is the first all-female team release and both @mrahmadawaisand @estelaris are part of the release team.

The #core team posted a wish list for release 5.7

The marketing team wants your input for The Month of WordPress, they meet on Wednesdays at 2.00 pm UTC in the #marketing Slack channel.

Updates

@ibdz has recently reincorporated to the work on the visual regression report for color schemes with the #core-css team.

@hedgefield continues working on mockups for the notification center project and it should be ready to being prototyping soon. There are still several issues going in the WP notify repo, if anyone wants to follow up.

Main topic

The call for design team repTeam Rep A Team Rep is a person who represents the Make WordPress team to the rest of the project, make sure issues are raised and addressed as needed, and coordinates cross-team efforts. closed on 30 November and we only had @chaion07 nomination. Since he had several +1 from the team, we decided to name him next design team rep and will be replacing @karmatosed. There is an announcement to follow.

Open floor

@hedgefield asked about the progress on G2. For those unfamiliar with it, G2 is the next iteration of the post editor UIUI 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.. At the moment, @joen and @itsjonq are working on the project. Here is a calendar of the current status and there will also be a summary of the work being done. In the meantime, you can read more about it in @itsjonq‘s blog.

@ibdzalso mentioned that the WP Notify project is inviting designers to challenge the direction now.

#meeting-notes

#5-6-release, #color-schemes, #g2, #team-rep, #wp-notify

Design Meeting Notes for 29 January 2020

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

Housekeeping

There is a call for volunteers for the Get Involved table at WCAsia. If you are attending, it will be a great opportunity to give back.

Updates

GutenbergGutenberg 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/ updates

@mapk is working on moving any design-related projects to the board on GitHub. If anyone wants to get involved and help shape the design of Gutenberg 5.4, there are several tasks that they can work on.

@kjellr invited the design members to attend the New Bi-Weekly Block-based themes meeting which will be a great opportunity for Design, CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. and Theme teams to discuss the theme-related impact of full-design editing work in Gutenberg. Agendas and notes will be posted to the http://make.wordpress.org/themes

This was a short meeting due to #core and privacy meetings happening at the same time. We’ll be back again next week, in the meantime, please leave your comments.

Design meetings are:

  • Core/metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. triage: Monday 17:30 UTC
  • Gutenberg triage: Tuesday 17:00 UTC
  • Design Team: Wednesday 19:00 UTC

#meeting-notes

Call for advanced bulk / row actions for object-to-object relationships

During last week’s multisiteMultisite Multisite is a WordPress feature which allows users to create a network of sites on a single WordPress installation. Available since WordPress version 3.0, Multisite is a continuation of WPMU or WordPress Multiuser project. WordPress MultiUser project was discontinued and its features were included into WordPress core.https://codex.wordpress.org/Create_A_Network. meeting the need for a new design pattern related to list tables was expressed. The intended functionality would require some kind of advanced bulk actions and row actions that would provide a second step to choose one or more related objects from a dropdown.

Before describing the requirements in more detail, the actual use-cases from the discussion are outlined:

  • Network Admin > Plugins list table: It should be possible to bulk-select plugins, then choose a new bulk action “Activate on site/s…” and then select one or more sites from a dropdown/autocomplete field on which to activate the initially selected plugins. In the same manner a row action “Activate on site/s…” should exist with a similar way of then selecting the site/s to activate the pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party on.
  • Network Admin > Themes list table: This would need a similar functionality like what has been described for plugins above, with both a bulk and a row action called “Enable for site/s…”.
  • Network Admin > Users list table: It should be possible to bulk-select users, then choose a new bulk action “Add to site/s…” and then select one or more sites from a dropdown/autocomplete field to which to add the initially selected users. A similar row action should be added as well.

While all these use-cases are about selecting related sites, the new design pattern should by no means be restricted to that. Such a pattern could benefit many other list tables in WP Admin as well. Some of the use-cases could be (without any intention to actually implement them though):

  • Posts list table: It could be possible to bulk-select posts, then choose a new bulk action “Set taxonomies…” and then select one or more taxonomies from a dropdown/autocomplete field to set these taxonomies for the initially selected posts. A similar row action could exist too. The functionality is technically already available through QuickEdit, so this example would not be useful in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., but in general it still makes a valid use-case.
  • Posts list table: It could be possible to bulk-select posts, then choose a new bulk action “Set post format…” and then select the post format from a dropdown/autocomplete field to set the initially selected posts to. A similar row action could exist too.
  • Users list table: It could be possible to bulk-select users, then choose a new bulk action “Assign role…” and then select the role from a dropdown to assign this role to the initially selected users. A similar row action could exist too.

The initial thought during the multisite discussion was to have some kind of popover open when an advanced bulk action is selected or an advanced row action is clicked. This popover would contain the dropdown/autocomplete field to select the context for the action to perform. However, this is likely not to be the optimal approach here. Another approach would be to dynamically include the dropdown/autocomplete field on the right side of the actual bulk actions selection, which is what Advanced Bulk Actions does, a plugin that was recently created. This plugin could possibly serve as inspiration, however it does not currently provide an autocomplete functionality which would be required due to the possibly high amount of items selectable. Furthermore the autocomplete does make for a good example of REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/. usage in WP Admin.

The three images below indicate the desired functionality in three steps, here following the second approach described, for the third example mentioned above (Network Admin > Users list table):

Bulk Actions Context Flow 1

1. A bulk action that requires context (indicated by three dots) is selected.

Bulk Actions Context Flow 2

2. A contextual autocomplete field appears.

Bulk Actions Context Flow 3

3. One or more sites can be selected before hitting the Apply button.

The goal for this new design pattern should be to be able to define any kind of object-to-object relationship (whether one-to-one, one-to-many, many-to-one or many-to-many) from a list table, by assigning one or more objects from the list table to one or more related objects of any type, which would be defined per individual bulk / row action.

While functionality like this could be included in an interface similar to QuickEdit for posts, it appears that having dedicated bulk and row actions might be more specific and fitting for such a use-case. This will still need to be discussed in detail though.

We would like to ask the design team for their feedback so that we can implement advanced contextual bulk actions in a proper way with the best possible user experience.

#core, #design

I’ve just posted a potential CSS roadmap for…

I’ve just posted a potential CSS roadmap for core over on Make/CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. For those of you who don’t follow along there, I’d love your eyes and thoughts.

#core, #css

Made a ticket for something that has bee…

Made a ticket for something that has been on our radar since 2.7 was in development, but just never got any kind of prioritization because it was minor compared to more serious UIUI 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. things. That said, since it’s kind of minor, would be a nice thing to whip out.

Ticket #17028 – Move the “last edited at” text and saved/updated/published notices in post/page editor
1. The timestamp of the last save is currently displayed at the bottom right of the editor box. It would make more sense for this information to be tied to the Publish box instead.
2. The yellow alert boxes that appear at the top of the page are weird. a) They should appear closer to the button that caused the action (general usability/accessibilityAccessibility 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) best practice), so probably by the Publish box. b) Once you edit anything on the screen, the “post updated” (or saved, etc) text should go away, because it is no longer current.
Am thinking we could combine these two things into one flexible status message that’s located in or adjacent to the Publish box.

#alerts, #core, #trac