X-post: Dev requirements for learn.wordpress.org

X-post from +make.wordpress.org/meta: Dev requirements for learn.wordpress.org

Design meeting agenda 29 July 2020

This week’s meeting will be held at 18:00 UTC tomorrow 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.

This week the design team will have a Show & Tell meeting via Zoom in lieu of the weekly meeting. If you have something you would like to share, showcase, or are working on and would like input from the design team, please add a comment below.

The Zoom link will be posted on the #design Slack channel on Wednesday at 18:00 UTC. For those unable to attend a Zoom call, a link to the video and summary will be posted as meeting notes.

#meeting-agenda

Design meeting notes July 22

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.

First up, @noahrshrader updates us on the progress of the Design Library in Figma.

Since last week:

  • Revised current components to get them closer to specification
  • Updated the Getting Started page to reflect current workflows
  • Improved some of general aesthetics
  • Adjusted the main text font to be closer to what’s in the product (now SF Pro Text; was SF Pro Display)
  • Added new components: Card, Color pickers, Blocks (a couple of the common ones)

Coming up:

  • Revise approach to the Proposals page. With the combined library, I’d like for it to be inclusive of all scenarios
  • Add missing components (from the list on the Components page in Figma)
  • Add additional starter blocks
  • Clean up organization of Components (some of this has already been started)

In the queue:

  • Incorporate CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. patterns

Next up, another 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/ update from @michael-arestad.

Gutenberg 8.6 RCRelease Candidate A beta version of software with the potential to be a final product, which is ready to release unless significant bugs emerge. was released two days ago. Expect the releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software. today. Highlights: Video position controls for the Cover 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., updated block patterns, and tons of fixesThe WordPress 5.5 deadlines are approaching. We have a potential patch next week to update block patterns before RC1.

In progress work:

Then, the docs team is looking for help making new videos of all the Gutenblocks for the documentation. If you want to help, reach out in the #meta-helphub channel.

Next, discussion centered on the 5.5 About page design @estelaris is working on. Check out those drafts on Figma and leave comments if you have more suggestions!

Next week is another Show and Tell Zoom meeting instead of a regular design meeting, if you have something to show, leave a comment below.

#meeting-notes

Design meeting agenda for July 22

This week’s meeting will be held at 18:00 UTC tomorrow 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

Gutenberg Phase 2 Friday Design Update #57

Happy Friday. Gutenberg 8.5 was released last week on July 8 just in time to get into WordPress 5.5 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..

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/ 8.5

No more cloned element while dragging and dropping.

  • Easy upload from external sources.
  • Add an edit button to the gallery images.
  • Move zoom control to toolbar of Image 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..
  • Polish the document 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. controls.
  • Redesign the transform menu.
  • Redesign the canvas inserter. 

Work in progress

New sidebar menu to navigate within FSE. This new menu concept will make FSE navigation much easier. Pulling it into a new sidebar menu makes a lot of sense here.

Block patterns went through a few revisions in time for WP 5.5. These revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision. help tighten up the overall design aesthetic. The Quote pattern below is a great example.

An Accordion block is being discussed. There’s been several requests to get a native form of this block into CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Here’s how that might look.

List view design updates. The List View is another term for the Block Navigator. With all the upcoming features, a redesign is underway.


Get involved

Now is a great time to get involved. While the work on this project is intense, it is always important to glean new perspectives from other WordPress users and community members. Just drop into any of the links provided above to read up on the details, contribute, and leave feedback.

Thanks for reading, staying informed, and contributing anywhere you can!

#design, #gutenberg-weekly, #phase-2

Design Team Meeting Notes July 15, 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 can still use more volunteers for note-taking and triage leading. Please leave a comment below if you’re interested.

Monthly ‘Show and Tell

Monthly ‘Show and Tell’ will take place on the 29th. Even though everyone has been busy with the releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software. of 5.5 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. 2, we will still have the session.

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/

@michael-arestad brings Gutenberg updates: Here are the plans for Gutenberg in July. Getting everything ready for 5.5 is a major focus this month.

  • 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. patterns are just about ready to go. The initial patterns have been selected and all that’s left are a few tweakshttps://github.com/WordPress/gutenberg/projects/41. Props to @nrqsnchz.
  • A new 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. paradigm is in the works. Definitely take a look and let us know what you think.

WordPress Figma Libraries

@noah reports on the update for WordPress Figma Libraries:

Colors

  • There are two palettes: Primary, which is what we’ve been migrating towards and Classic which comprise many of the colors that are still used in both the editor and WP admin.

Remaining:

  • Improve naming conventions
  • Validate palettes
  • Include documentation around use

Typography

  • The main text styles have been identified, along with their accompanying values, such as size, weight, line height, etc.

Remaining:

  • Final review values for each text style
  • Include documentation around use

Icons

  • Currently, we’re supporting three icon libraries: Primary (G2), Material and Dashicons. Only the Primary and Material icons are available in this library, with Primary having precedence. Dashicons are intentionally downplayed with an explanation and link to the standalone library.

Remaining:

  • Finalize componentization of Material icons

Components

  • Many of the common components have been built and reviewed against what’s currently in the WordPress components package. I have also been going back through and fact-checking against what’s in the latest build of the Gutenberg 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.
  • As you peruse the Components page, you’ll notice a dot to the left of the component name that’s either outlined or green. If green, those components are good to test, and I would encourage everyone to do so. Does the construction make sense? How does it hold up as you use it? Is it accurate?

Remaining:

  • Include remaining components from the Components list (this list is in Figma)
  • Include documentation around use
  • Promote testing and use of these components

Views

  • Completed components will eventually be grouped in clusters (atomic organisms) and added into templates/views. You can already see this with the block inserter and editor headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. clusters.

General

The following is a list of items outside of what was mentioned above.

  • Add Getting Started documentation (next week)
  • Add Proposals documentation (next week)
  • Clean up component frames (improve consistency, balance and organization)
  • Migrate utilities outside of library

Discussion

  • Project related documentation – On TrelloTrello Project management system using the concepts of boards and cards to organize tasks in a sane way. This is what the make.wordpress.com/marketing team uses for example: https://trello.com/b/8UGHVBu8/wp-marketing. board, we have the Figma reorganization and updates to the handbook.
  • For the Handbook- Currently there are no updates as most of us have been focusing on 5.5.

Open Floor 

  • @folletto pointed out that in Gutenberg 8.5.1 the new inserter panel when opening it closes the settings panel, and then it doesn’t reopen. Was this already discussed? @youknowriad & @nrqsnchz shared the link to PR 20951 with something similar. @folletto opened a PR to discuss the behavior of the issue.
  • The ‘About Page for 5.5’ in the form of the ticket was discussed in detail.

#meeting-notes

Design Meeting Agenda 15 July 2020

This week’s meeting will be held at 18:00 UTC tomorrow 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:

Meeting Agenda

  1. Housekeeping
    • End of the month Show and Tell
  2. 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/
  3. Open floor


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


#meeting-agenda

Design meeting notes July 8

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.

First up, housekeeping. We are always inviting members to be part of our note taking and triage team, if you are interested, leave a comment!

Next, @michael-arestad brings us 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. Version 8.5.0 has been released today! It is the last releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software. going into WordPress 5.5. It’s packed with features including:

  • New 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. editor design
  • Block Patterns – nice work @nrqsnchz
  • Expanded Design tools
  • Better Drag and Drop
  • Possibility to upload external images on image blocks
  • A11yAccessibility 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): Allow disabling arrow navigation across blocks
  • Anchor support added into most static blocks
  • Over 1500 “editor experience” improvements.

What’s next in Gutenberg? Here’s a post from @annezazu that’s worth some of your time. In progress work:

This is just a handful the items representing the work being done. If you’re interested, check out the Task Coordination messages in today’s #core-editor meeting. Look into the work in progress to see where you can give some feedback or ask questions if something is not clear, it will help designers to develop better components and blocks for us to have more fun with Gutenberg.

@noahrshrader is working on our Figma libraries. A post about this effort went up a few days ago, and a new Figma library file is being set up here. As you browse the library, you’ll notice green dots next to component names. Green indicates that it’s ready for use. Everyone is encouraged to hop into the file and take a look around. Feel free to leave comments in Figma and we’ll be happy to address/resolve.

The docs team would like feedback on the new external linking policy draft for commercial blogs.

@sageshilling is working on a Media Library image tray for this ticket that she would like feedback on. A lot of good points were discussed during the meeting already, but if you have more you can leave your comments in this doc.

That’s all for this week, quite an update! Remember we have CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. triage on Mondays and Gutenberg triage on Tuesdays in the same Slack channel.

Design meeting agenda for July 8

This week’s meeting will be held at 18:00 UTC tomorrow 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
  • 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/ development
    • Progress of the Figma libraries restructuring
  • Calls for help
  • Main topics
  • Open floor
    • If you have any tickets for 5.5 that still need to be reviewed, please add them in the comments.

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

#meeting-agenda

Design Team Meeting Notes July 01, 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.

First, Housekeeping. We can still use more volunteers for note-taking and triage leading. Leave a comment below if you’re interested.

Next, @michael-arestad brings 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:

  • Gutenberg 8.5 RCRelease Candidate A beta version of software with the potential to be a final product, which is ready to release unless significant bugs emerge. will be released on Monday and will be the releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software. going into WP 5.5.
  • @noah has been busy working on the Figma library
  • The new template issue could use some feedback
  • Image editing is available with this update
  • @annezazu published for the FAQ for the FSE outreach experiment.

Requesting everyone to provide any feedback that can be given to the new template issue as the team is busy right now pushing as much as to be prepared for WordPress 5.5.

@noah and @ibdz reports on the update for WordPress Figma Libraries:

  • Updates are on the way to incorporate the new 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. Editor patterns, as well as some general cleaning to make these more relevant
  • @noah is building out the new elements in a page called “In Progress” in the Components and Patterns files. Various icon libraries is also being brought into a centralized location, which can be found here: https://www.figma.com/file/3O5hl33MYt8YPWcRWWuwNv/WordPress-Icons
  • @noah will write a p2 post on ‘Improvements to the Figma Libraries

@ibdz has been exploring some workflows to automate the process. Currently testing and experimenting with React-Figma but the result is still far from expectation.

Discussion

In regards to HelpHub @estelaris wrote a p2 post trying to define users and categorizing the articles into 4 big pillars (these are not final yet). @mapk suggested the following categories:

  • WP basics – overview, features, history, glossary, semantics, contributing.
  • Technical documentation: installation guides, requirements, best practices, technical how-to, security, troubleshooting.
  • Support documentation – dashboard structure, user permissions, screens, media screens.
  • Project related documentation – customization, themes & plugins, design how-to’s (blocks):

Open Floor 

  • @joen created a new WP-Admin color scheme “Modern”. It’s ready to merge and brings high contrast blue colors as well as some consistency with the new Block Editor colors. The patch attached to the ticket purely provides an optional color scheme called “Modern”, and it is not a default scheme. If it were to become default in 5.6, it needs to go through the ringer on many levels. It primarily does 2 things:
    • brings darker background color to the menu, and a lighter text color, increasing contrast.
    • adds a new spot color, a rather luminous blue that has great contrast properties against white.
  • @ryrlle brought in a Github PR that adds a “private content” container block so that the organizers can share content only with people who have bought tickets. For example, online event organizers want to be able to share Zoom links without worrying about zoom-crashers. @estelaris is looking for input on the editor view of the block.
  • @joedolson is currently working with @nrqsnchz and @ryelle towards the issue associated with 49999.
  • We are also seeking feedback on the tickets 50169 & 48894.

#meeting-notes