Monthly design Show and Tell – July 2021

The Weekly Chat for design will take place Today, 28th July 2021, 16:00 UTC in the #design channel of the WordPress Slack. 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.

This week’s meeting is a show and tell so come and join us in the zoom, the link will be shared in the design channel. If you’ve got anything you’d like to talk about just comment here or bring along the topic to the meeting.

#agenda, #design-agenda, #meeting-agenda

Design Team Meeting Notes: July 7, 2021

These are the weekly notes for the design meeting that happens on Wednesdays. You can read the full transcript on our Slack channel. 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.

The main focus was an open floor but the following is a summary of topics including links shared.

  • About page was asked to have feedback.
  • @richtabor provided a range of 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/ issues we dove into discussing various things around the editor.
  • The first of these was closing block styles proposed by @michael-arestad (who joined in the discussion). This improves the styles panel; discussion led to more thoughts around the side panel updates that are incoming.
  • During this discussion, some great links were shared by @melchoyce, @shaunandrews, @joen and many others. Here are a few of those:
  • Following on from that contextual padding was talked about.
  • For all the issues linked, feedback is very welcome.

#meeting-notes

Design team meeting agenda for July 7th

The Weekly Chat for design will take place Today, 7th July 2021, 19:00 BST in the #design channel of the WordPress Slack. 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.

There is one topic so far and that’s the about page, so come bring your ideas and input – let’s have an open floor!

#agenda, #design-agenda, #meeting-agenda

Monthly Design Show and Tell: June 2021

Attendees: @karmatosed (facilitator), @kellychoffman, @joen, @beafialho, @javiarce, @melchoyce, @fcoveram, @kjellr

Designs shared

  • @beafialho shared progress on the WordPress News redesign.
  • @fcoveram shared progress on Openverse

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.

Contributions to the Design Team are always welcomed. Please pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” @estelaris or @chaion07 and they will guide you through.

Design team meeting agenda for June 30th

The Weekly Chat for design will take place Today, 30th June 2021, 19:00 BST in the #design channel of the WordPress Slack. 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.

This week’s meeting is a show and tell so come and join us in the zoom, the link will be shared in the design channel. If you’ve got anything you’d like to talk about just comment here or bring along the topic to the meeting.

#agenda, #design-agenda, #meeting-agenda

Design Team Meeting Notes June 24, 2021

These are the weekly notes for the design meeting that happens on Wednesdays.

You can read the full transcript on our Slack channel.

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:

Where#design channel on Slack.

Meeting Facilitator: @estelaris
Note Taker: @ashiquzzaman

Attendees:    @ashiquzzaman,  @kellychoffman, @estelaris, @thisisyeasin, @magdy, @joen, @michael-arestad, @critterverse, @karmatosed,  

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.

Contributions to the Design Team are always welcomed. Please pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” @estelaris or @chaion07 and they will guide you through.

Blog Announcements:

Side-by-Side Image Challenge – Make WordPress Design

Update: Initial Patterns for the Patterns Directory – Make WordPress Design

A Walk Around… The Table Block – Make WordPress Design

Requesting all to read and leave your valuable feedback on these posts. Your comments will help the design team to improve WordPress.

Open Floor:

@magdy thinks 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/ panels can be improved something similar to Quillforms is doing. @karmatosed advised to open an enhancement issue on https://github.com/WordPress/gutenberg/ and Joen agrees that the tricky part is to find the right balance.

#meeting-notes

Update: Initial Patterns for the Patterns Directory

Thank you for the wave of contributions to help kick off the WordPress.org pattern directory. We now have 80+ patterns in the collection

Now that you’ve helped us populate the directory with so many patterns, @melchoyce, @beafialho, and I are going to shift focus to further refining and tidying up the collection for launch. Our goal for this pre-release set of patterns is to provide users with a diverse, high-quality set of designs that share a common thread. 

This does not mean that submissions are closed — just that we’re at a point where we can begin viewing submissions through the lens of curating and filling out the collection as a whole. With that in mind, I’ve pulled together a handful of suggestions to help folks who are submitting patterns between now and launch: 

  • Draw inspiration from history, art, and nature. Like the patterns that are currently bundled with Gutenberg, this set is designed to share the common thread of history, specifically through the lens of art and the natural world. Using these reference points allows us to cover a wide range of topics and styles, while still having a throughline that connects them all. When submitting a pattern for this pre-release collection, please consider having your imagery and text be related to those topics. That will help this feel like a cohesive set. 
  • Challenge yourself to create something new. Before you get started, take time to browse through the directory and ensure that your pattern does not duplicate existing work. For example, the directory includes many Media & Text patterns already, so there probably isn’t room for many more Media & Text patterns at this point. 
  • Write text creatively. For this initial collection, we’ve been avoiding “Lorem ipsum” text in order to help make the patterns feel more real. Try using text as a way to hook into that common thread of history, nature, and art mentioned above. If you have links in your text, feel free to link to WP.org or WordPress.org. You can use example@example.com as an email address if you need one. 
  • Be sure to use CC0 or Public Domain images. Keep the common thread in mind when choosing images. If you need inspiration, previous patterns have had great luck pulling from Rawpixel’s curated public domain collection of images. At this time, let’s avoid modern iconography as we wait for a more flexible icon solution in 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/
  • Aim for accessible color palettes. If your pattern uses colors, be sure that text contrast adheres to WCAG 2.0 guidelines. This will ensure that more people can read your pattern! 
  • Consider a range of screen sizes. Be sure to test your pattern on mobile, tablet, and desktop views. Some patterns using large text tend to break awkwardly on smaller screens. Be sure to test that out, and adjust accordingly. 
  • Ensure your pattern works well in many themes. Be sure to keep your 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. settings as specific as possible: Outside of default colors like black and white, please specify hex values instead of relying on theme presets. Make sure your pattern isn’t using any theme-specific block styles, and be sure to set line-height for text when appropriate.

We’ll continue evolving these suggestions and guidelines over time as the directory continues to grow.

As we move into a more tightly curatorial part of this effort, I’d like to reemphasize that the current process is just for the early, pre-release phase of pattern submission. For example, if you have a pattern that is similar to one that is already in the pre-release collection, the Design team may hold off on including it for now. But you’ll be free to resubmit it directly yourself once the directory is launched.

Again, thank you all for your submissions! It’s exciting to see the directory come to life. 

Design Team Meeting Notes: June 2, 2021

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.
  • Contributions to the Design Team is always welcomed. Please pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” @estelaris or @chaion07 and they will guide you through.

Announcements

WordPress has turned 18
Last week we celebrated the 18th anniversary of WordPress’ launch, a day that we can fondly refer to as WordPress’ birthday.

Since our last birthday we developed our 40th release and now also support over 40% of the web. So it seems fitting that this year’s celebration should be a list of 40 milestones that have helped us get there.

Bug Scrub Schedule for 5.8
As we are at feature freeze for 5.8 release the next milestone is the BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. 1 which is set for June 8. I along with  @lukecarbis are leading scheduled bug-scrubs that usually happen twice a week. For the most part, they’re scheduled for Tuesdays and/or Wednesdays at 4:00 UTC for APAC time zones and 20:00 UTC for US /EU regions, though there are some adjustments to accommodate religious and national holidays. The next one is on June 8, Tuesday at 2000 UTC. Come join if you can as we look to address a few bugs and defects for 5.8 🎉

Proposal to tweak existing icons and add new ones
There is a proposal by @keoshi on the existing icons. The discussion goes back a couple of weeks over Slack that has been documented in the Meeting Notes. We would love to hear your thoughts, concerns, and suggestions on the above. If there are no major disagreements or changes to be done, the next step would be create a PR to submit all of these to the repo.

WordCamp Europe 2021
As we are just days away from WCEU 2021 which is set to take place between 7 and 9 June, we wanted to remind everyone to get their tickets before it runs out. Noting that 2 #design team members talking this year:

  1. @javierarce will present Using Figma in the Design Team Workshop on Monday, June 7 at 18.00 CEST
  2. @estelaris will be part of a panel discussion on How contributors make WordPress – Wednesday, June 9 at 16:00 CEST

CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blog highlights

Discussion

@estelaris suggested that we add a link to the handbook that references the fact that Figma now provides a link to give view access to the WP library. This way we can remove the note about emailing invites. @karmatosed, @kellychoffman, and @melchoyce agreed. Estela will do the update.

Further reading

Design Team Meeting Agenda for June 02, 2021

The Weekly Chat for Make WordPress Global Design will take place on Wednesday, June 02, 2021, 18:00 UTC in the #design channel of the WordPress Slack. 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.

Here’s the list of Agenda items:

  1. Announcements
  2. CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Blog Highlights
  3. Did you read these?
  4. Open floor

This Meeting is held in the #design channel in the Making WordPress Slack Workspace.Leave a comment if you would like something reviewed, discussed, help or something added to the agenda.

#agenda, #design-agenda, #meeting-agenda

Proposal to tweak existing icons and add new ones

A week ago I presented a quick proposal to folks on 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/. to add a few new icons and tweak some of the existing ones. The initial proposal was captured in last week’s meeting notes, but I’ve been working on said icons since and wanted to cristalize the final group of icons on this post.

All of these icons have been added to the Proposals page on the WordPress Components Figma file.

Tweaking existing icons

The suggestion is to make a slight tweak to icons that have human representations, replacing the solid dot (generally reserved for interface elements) for a more open, outlined shape. I personally find this change humanizes the icons a lot, and makes them much more consistent with themselves and rest of the library.

Changes:

  • The solid dot for the heads turns into an outlined shape.
  • Icons affected: people and block-post-author.

Adding new icons

The goal with these is to extend the icon library, and do so respecting the foundational philosophy and icon architecture. The more comprehensive the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. icon library is, the more useful it becomes 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./theme/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 authors. And the more it becomes a common good, the more cohesive the WordPress experience will be, and more people are willing to contribute back to it.

Additions:

  • bug/no-bug – useful in technical contexts such as issues, bug reports, fixes, changelogs, etc.
  • security – using the shield metaphor to convey protection against existing threats, applies to site health and plugins in general.
  • add-card – a generic element to add new elements beyond just the block editor.
  • key – to be paired with the lock icons, or for plugins that support licenses.

Worth repeating that the idea is to add icons that can be used by anyone, in diverse and distinct contexts, and serve multiple purposes.

Feedback

Would love to hear your thoughts, concerns, and suggestions on the above. If there are no major disagreements or changes to be done, the next step would be create a PR to submit all of these to the repo.