Sidebar Controls & Component System

“What is G2?” It was a codename for the block toolbar redesign that happened as part of WordPress 5.5, and it’s also been the codename for a followup effort to evolve the design language of block controls. This post is meant to give visibility to the effort since the question came up yesterday.

The initial effort is focused on bringing systematization to blockBlock 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. controls in the editor sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. Here’s a specific example of what the effort is trying to solve for:

Typography tools, concretely, have been expanding with different blocks requiring a slightly different subset (with or without line height, with or without font weight, etc). These groups of controls need flexibility and clarity. Both themes and blocks need to be able to specify which elements are configurable by the user and the interface needs to be able to accommodate different configurations in a pleasing and consistent manner.

That means there are two complementary goals with this effort: an improved design system and more functional control typologies that neatly organize the complexity of information and actions. We can start with some of the basic and most recurrent panels that can provide a baseline for others.

Please feel free to read the full ticket and participate directly on GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/.

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 team meeting agenda for 2 December 2020

This week’s meeting will be held at 18:00 UTC on Wednesday in the #design channel of the WordPress 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/.. You can join the Slack channel by following the instructions in our handbook.

Here are the suggested topics:

  • Housekeeping
    • Call for note-takers and triage facilitators
    • holiday schedule
  • Announcements
    • Release 5.6 is scheduled for 8 December, you can review the field guide
    • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. team posted a wish list for release 5.7
    • The marketing team is working on The Month of WordPress for December, to add something attend a marking meeting on Wednesdays at 2.00 pm UTC in the #marketing Slack channel.
  • Updates
  • Main topic
    • New 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.
  • Open floor

If there is anything you would like to see added to the agenda, please leave a comment also.

#meeting-agenda

Design team Show & Tell for 25 November 2020

The design team is still working on blockBlock 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. development as well as experimenting into other platforms for live design sessions, some of the highlights:

@itsjonq is doing live demos on G2 components on Twitch. He will be announcing any sessions in the Slack #design channel.

@mapk showed us improvements on the query block and we actually discussed solutions like combining steps in one screen or splitting the action into two steps/two screens.

@karmatosed mentioned an issue brought up in the Slack #design channel regarding the libraries that exist in Figma. @karmatosed archived the old Figma libraries and updated the design handbook: Figma tools as well as the WordPress components pages.

@itsjonq consulted the team about his work on project maps and planning for G2 components.

@estelaris reminded the team about adding their nominations on the open call for a new team rep. Nominations will close on November 30 and voting will take place on December 2 during the weekly meeting.

design team members participating in the show and tell for November 2020

#meeting-notes

Design team Show & Tell 25 November 2020

This week’s meeting will be held at 18:00 UTC on Wednesday in the #design channel of the WordPress 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/.. You can join the Slack channel by following the instructions in our handbook.

There is no set agenda for Show and Tell and the design team opens the meeting for anyone who would like to present what they are working on. Mostly, it is members of the design team that take advantage of this, but if you are member of another team and are working on a WP design-related project/feature, you are welcome to join us.

If you would like to present, please leave a comment below.

#meeting-agenda

Design Team Meeting Notes November 18, 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 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.
  • There is a call for team rep nominations. @karmatosed is rotating out of this role, but she’ll still be contributing so it’s not a goodbye! The call is for one 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. who will join @estelaris.
Updates

@hedgefield drew attention to efforts being given to the WP notification center project where developers are discussing and making some early designs. The current focuses are on the admin bar, settings page etc. Feel free to check it out and leave some feedback on the Github page.

@mapk shared the link to the WordPress “Hallway Hangout” a few days back regarding blocks in the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.. A lot of conversation has revolved around the ‘UXUX 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. with prototypes’ and mock-ups shared. If anyone would like to jump in and provide feedback, they can do so in the post comments or on the actual issue in Github.

Discussion

@clorith published a p2 titled Changing up the forum front page and invited folks from Design to provide feedback to improve the overall user experience of the forum. Please feel free to leave comments on the post.

Open Floor

@hedgefield tried to put a spotlight on the ‘log in’ experience when contributors wishing to check their ‘five for the future‘ pledges. The interface would bring them right back to the WordPress.OrgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ homepage with no indication if you are logged in or not including no option to get to your profile. @karmatosed suggested to investigate the path and start documentation for it.

#meeting-summary, #meeting-notes

Design team meeting agenda for 18th November 2020

This week’s meeting will be held at 18:00 UTC on Wednesday in the #design channel of the WordPress 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/.. You can join the Slack channel by following the instructions in our handbook.

Here are the suggested topics:

If there is anything you would like to see added to the agenda, please leave a comment also.

#meeting-agenda

Call for design team rep nominations

In March, the design team had our first call for 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. nominations. The time has come to open up nominations for one rep as I am rotating out. This is a great opportunity for an existing team rep to onboard someone and gives someone the chance to grow into this role and work alongside Estela.

It’s been a pleasure to be a team rep for design, and I am excited to continue contributing in other ways. This is purely a rotation out, not a goodbye. Being able to move in and out of this role is something built into the experience.

So, let’s get on with the exciting possibility and explain a little about the role. For this, I am going to be taking quite a bit from the post in March.

What does a team rep do?

In the WordPress open sourceOpen Source Open Source denotes software for which the original source code is made freely available and may be redistributed and modified. Open Source **must be** delivered via a licensing model, see GPL. project, each team has one or two (or more!) representatives, abbreviated to reps. The role goes way back to 2012 and is an established one across teams. You can learn more about the team rep role here.

A little note, it’s not called team lead for a reason. This section from the updates page explains team reps well:

“Team Rep is a leadership role that is mostly administrative in nature; it is not a Lead role. Letting go of the Team Rep title is not a loss of status, just a handing off of responsibilities. Someone who is a leader in a team can lead whether they are doing the team rep job or not.”

Here are the main tasks:

  • Ensuring a meeting agenda happens along with notes. We have note-takers who are not team reps and post agendas, so this is coordination. The team rep adds agenda items to a shared document.
  • Run the weekly design team meeting in 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/..
  • Co-ordinate the weekly triage meetings.
  • Write a biweekly update post for make.wordpress.org/updates?
  • Give quarterly updates on the team when asked.
  • Call for new team reps when the time comes at the end of year tenure.

As a team rep, other tasks might fall to you in order to keep the team running, but in general, it’s a support and coordination role. On average the estimated time you would need for this role would be a few hours a week. With another team rep though, that time is shared.

This role is open to contributors of any level, not just full-time contributors. Like many good open-source processes, this work is done openly and can be shared. Also, because WordPress is a globally-minded project, if the team rep that is selected can’t make the current time, we can always discuss changing the meeting time.

The process

Taking inspiration from teams that have done this before the suggested process would be:

  • A call for nominations in the comments on this post. Self-nominations are welcome. These will close in on November 30th.
  • After the closing date, another post will highlight those nominated votes will be made on those nominations for a week. Currently, there is one team rep role available and the incoming rep will be working with Estela.
  • The votes will be tallied, the chosen team rep asked to confirm they want to do this process and then announced.

If you want to nominate someone in private, please reach out to me (@karmatosed or @estelaris) on Slack.

Disclaimer: if you get nominated, please don’t feel like you have to say yes! We will add to the polls only the names of the people that are responding positively to a nomination. So feel free to reply with a “Thank you, but no thank you”.

#team-rep

Design meeting notes 11 Nov. 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.

Updates

@paaljoachim is working on a new way to present patterns in the inserter in a bigger, better way, inspired by this article. There will soon be a Figma prototype to give feedback on.

@michael-arestad is working on the blockBlock 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. directory, and has some proposals he’d like feedback on:

@chaion07 and @estelaris will soon work on a post about Asian and Pacific timezones’ Office Hours.

Discussion

@joen would like feedback on this proposal for using system fonts in WordPress. People in chat were very positive about the idea.

#meeting-notes

Design team meeting agenda for 11th November 2020

This week’s meeting will be held at 18:00 UTC on Wednesday in the #design channel of the WordPress 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/.. You can join the Slack channel by following the instructions in our handbook.

Here are the suggested topics:

  • Housekeeping
    • Call for note-takers and triage facilitators
  • Updates
  • Open floor

If there is anything you would like to see added to the agenda, please leave a comment also.

#meeting-agenda