You don’t need edit access to use the Figma libraries, you can copy components from there into your own drafts. If you’re a contributor with the ability to grant edit access, please be mindful, and downgrade to view access once the initial need for edit has waned.
Buttons blockBlockBlock 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.
Social Icons block
A simpler default color palette
From HTTPHTTPHTTP is an acronym for Hyper Text Transfer Protocol. HTTP is the underlying protocol used by the World Wide Web and this protocol defines how messages are formatted and transmitted, and what actions Web servers and browsers should take in response to various commands. to HTTPSHTTPSHTTPS is an acronym for Hyper Text Transfer Protocol Secure. HTTPS is the secure version of HTTP, the protocol over which data is sent between your browser and the website that you are connected to. The 'S' at the end of HTTPS stands for 'Secure'. It means all communications between your browser and the website are encrypted. This is especially helpful for protecting sensitive data like banking information. in a single click
New Robots APIAPIAn API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.
Lazy-load your iFrames
Ongoing cleanup after update to jQuery 3.5.1
Kudos to @hedgefield Tim Hedgefield for serving the role of the design lead for WordPress 5.7 release.
CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. Blog Highlights
To get involve: – Core Editor weekly Wednesdays @ 14:00 UTC in #core-editor focused on all-things GutenbergGutenbergThe 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/. – Block-Based Themes meeting twice monthly on Wednesday @ 16:00 UTC in #themereview focused on preparing for Full Site Editing.
Updates
With the release of WP 5.7 also comes an end to this term of release leadRelease LeadThe community member ultimately responsible for the Release.. @hedgefieldand was confused during this time as there wasn’t much documentation for guidance. He learned a lot from talking to previous leads – @estelaris and @karmatosed. With the learning of the process, he compiled a guide for the design Handbook.
During the 5.7 release, the design team ran joint meetings between the design and accessibilityAccessibilityAccessibility (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) teams. Since they were helpful, the team agreed to run them monthly during quiet times and weekly during releases.
@chaion07 is continuing a conversation with @estelaris on the Triage Summary Format. Expect a p2 on as soon as the draft is ready. The tentative timeline for the p2 is 2 weeks from now.
As for the DST time, last time the team decided to follow the UTC time and didn’t change the meeting time as it is very confusing for everyone.
@estelaris will make a post before the end of the week regarding DTS time, if anyone objects or has any other ideas, please add them there.
Open Floor
@estelaris mentioned PR #29709, although it has been closed now, she believes it is food for thought regarding the impact every small change to the block editor is making on users.
Happy Friday everyone! This will be my last update through the end of the year. I’ll reconvene in January again. I wish everyone happy holidays and a wonderful New Year.
It was also decided in the #core-editor meeting that there will be no GutenbergGutenbergThe 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/ releases or meetings for the remainder of the year. We’ll pick these back up in January.
Navigation blockBlockBlock 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.
While the Nav block has found its way into the pluginPluginA 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, it’s also being iterated upon to improve basic UX interactions.
@karmatosed is exploring the Menu screen in wp-admin which is in the early stages right now. There are mockups ready for design feedback. Please drop in on the ticket and leave your thoughts.
Block Directory
A recent post was written by @melchoyce that really brings together some plans for the next phase of the Block Directory.
Now’s a great time to get involved. While the work on this project is intense, it’s 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 and contribute.
Thanks for reading, staying informed, and contributing anywhere you can!
There are two things: @boemedia is stepping down as a team repTeam RepA 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.. She still be active as WordPress contributor. We want to thank her for being a team rep and her work/support.
Second, today is the last meeting of the year. We will take a holiday break and return on 6 January as our first meeting of 2020.
Updates
GutenbergGutenbergThe 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
@mapkt reported that due to holiday break, there will be no #core-editor meetings or Gutenberg releases until 8 January.
The tentative deadline for 5.4. is March, which means we will have about 6 to 8 weeks to work. Not all the items posted on the list will make it, but it will be good to start tracking them. A few suggestions to be considered now are background support to columns, color and typography items.
TrelloTrelloProject 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. and Handbook Organization
Trello and handbook changes are rolling out. Props to @michaelarestad who dove right in with a new page for full site editing! Because this is a work in progress, he expects comments and issues that can help improve it.
Topics of Interest, using tags/categories and ways to surface
The blue box is a bit leaner
@karmatosed has a question regarding the “Calls for Design” as it exists on the menu bar. Since it hasn’t worked as well as our Trello board for soliciting work, would it be better if we move it to “Topics of Interest”, swap it out of “Focusses” pages or update the “Calls for Design” page? Please add to the comments as we will revisit the item next week.
Call for WordCamps
If you are attending or running a WordCampWordCampWordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more., particularly a design contribution day, it would be great to call it out in advance in the make/updates post each week. And feel free to post agenda/notes or requests in the #designSlackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel.
List of Active Contributors
This topic is out of order from Slack chat. @karmatosed asked how others will feel to maintain a spreadsheet of active contributors that help with design to add badges to their profiles. A11yAccessibilityAccessibility (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) has this and they review it from time to time. The list could be linked in the handbook for easy access and to allow people to add themselves. Add feedback in the comments.
Updates
GutenbergGutenbergThe 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 were given by @mapk. The focus area for this month is highlighted here:
Great news from today’s chat #core-editor revealed that the Navigation blockBlockBlock 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. is super close.
@mapk is pushing to get text color features moving as well. There is already a PR on text color features by @jeffreycarandang. At the moment is blocked by another issue related to RichText, but from a design perspective, it’s on track. The plan is to bring the issue up to the a11y team’s bug scrub to get their feedback.
Another PR that is close is the “Replace Media”. It should resolve some media replacement confusion and be more explicit.
People can leave comments on any of the mentioned PRs or check out the label Needs Design Feedback in GitHubGitHubGitHub is a website that offers online implementation of git repositories that 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/.
Exploring some of the hover/selection states in Gutenberg blocks
Hold off any feedback or comments as a post in GitHub issues with context and more mockups will come later. If anyone wants to get involved, reach out to @michael-arestad.
Block Style System
@itsjonq resumed a proposal to an issue on WordPress/Gutenberg titled “Block Style System”: There is a gap within the system + ecosystem. It’s quite difficult to get Gutenberg blocks x themes to play nicely with each other. Styling essentially relies on CSSCSSCSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. overrides upon overrides when you use Blocks libraries (e.g. CoBlocks), that has its own set of isolated styles so now, you’ll need to write custom CSS to override that, to match your current site’s overrides
This workflow is common in WordPress, the proposed method is a necessary workaround. Gutenberg + block is giving Builders (block makers, themers, etc…) more control over the UIUIUI 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. because it standardizes how UI can be constructed
The idea for the proposal is to find a way to help standardize how HTMLHTMLHTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites./CSS can be written, and more importantly, configured. The Github post goes more into detail. Having this system allows users to actually set global configurations from within Gutenberg, in a non-hacky way, e.g. Colors or Typography.
Here is a demo of an experiment by @itsjonq. The Config system (the various configs/variables that makeup UI elements) can be defined by a theme, and overridden via Gutenberg. UI built or rendered by Gutenberg blocks or otherwise, can tap into this Config system. With this, themes, blocks, plugins actually have a way to work with each other. Because they share a foundation. Rather than fight with each other.
@karmatosed would like to know what those building themes and plugins think of this proposal. One block to test would be the “group block”.
Add any comments to GitHub issue or reach out to @itsjonq and if anyone is interested in his very experimental work in progress, follow the code.
Follow up on Slack for more examples of how the Block Style System can be applied and some design jokes.
Don’t forget the triage sessions Monday and Tuesday and follow along on make/design for any posts this week.
As phase one has wrapped up it’s a great time to look at iterating how designers can contribute and get involved in the ongoing work for phase two and beyond.
GitHubGitHubGitHub is a website that offers online implementation of git repositories that 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/ projects
The Gutenberg plugin itself is on GitHub and this is the cornerstone of the project. All designs being worked on will have a corresponding issue within GitHub. During phase one projects began to be used and this will continue. Here are the projects to follow for design:
Phase 2 design: a task focused board for all design during phase two
Phase 2 research: a project board to collect research, explorations, inspiration and feedback.
Note: like widgets other specific boards may be created to focus on the 2019 projects mentioned here.
Research
Everything starts with research. There have been a lot of insights from usability testing and feedback during phase one. Phase two is starting with a dive into research and interviews are underway. For more details on this you can join #research in Slack and follow the #research tag on this site for posts.
Explorations
Once the areas to be designed are identified into tasks (listed in GitHub projects), then exploring happens. There are a few tools to use for sketches, mocks and prototypes:
InVision: A great place to collect ideas and sketches on a board.
Figma: This is a great tool to use to sketch and share.
If you are looking to find something to work on? You can follow the ’needs design’ label in GitHub for issues already discussed that need a designer, or any of the projects mentioned.
Feedback
Designs grow through feedback. Sharing early and sharing often is the mantra to follow when working together. There are a number of channels within SlackSlackSlack 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 drop in to get feedback async:
#design is the home for designers in Slack, feedback can be asked at any point here.
#core-editor this isn’t just for developer feedback, this channel has editor focused designers ready to give you feedback.
#accessibility is your first port of call to get feedback on even the earliest sketch.
Before development starts any design should be made into an issue or attached to one that already exists in GitHub, this is where most of the feedback will happen. There are a number of useful labels to get even the earliest feedback on an issue:
’Needs Accessibility Feedback’ will get you specific accessibilityAccessibilityAccessibility (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) feedback and should be encouraged to be used by every single design.
Whilst it will be up to each person, a flow using the tools available could be:
An issue is created in GitHub, added to a project. This sets the foundation of the problem with some basic information and updated over time. A label of ‘needs design’ is added.
Research is added to the issue and then once designs are being produced in Figma, those also are added to the issue. Commenting can happen both in Figma and on the issue. InVision may be used to collate research for example.
Once there is an agreed design ‘needs design’ is removed and ‘needs design feedback’ added.
Iterations continue based on feedback until a point is reached where the design is ready to be developed. At this point ‘needs dev’ could be added and work begun.
During development those that helped with design will give feedback.
At all stages getting real feedback through usability testing will crucial.
Staying connected
There is a lot going on in quite a few places and following along isn’t always as easy as it could be. With the new phase of GutenbergGutenbergThe 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/ this is something to iterate on. There are a number of changes being made to ease this:
Weekly #design meeting updates in Slack. The current phase design lead will give a summary update during this meeting.
Weekly #design meeting feedback opportunity. There will be time within every meeting for specific feedback or to call attention to issues. Please add those as a comment on the meeting agenda.
Weekly #core-editor meetings will still continue, designers are welcome to join. Notes will also be taken going forward to catch up async.
Friday is summary day from the New Year!
The current phase lead will post a design update on make/design.
Those who are working on specific areas such as research, projects or features and have reached a point to update or get feedback, are encouraged to do that on make/design.
Sharing ideas
In this post, existing planned ideas have been covered, what if you have a great idea for something? The same feedback channels mentioned of #design in Slack, #core-editor and the GitHub repo are great places. You can also add to the ‘Phase 2 Research’ board ‘explorations’ column. Creating a blog post and sharing in those channels is also a great way to share a vision. If it’s just an idea without a sketch you can also discuss in Slack or make an issue.
Collaboration across teams
Designers should never go alone. Collaborating together is important but collaborating across teams is how the best product is made. As the next phase approaches it would be great to hear people’s ideas for how more collaboration can happen. Please add them in the comments.
Get involved
As phase 2 begins, now is a great time to start getting involved. Expect to see posts and announcements calling for specific involvement outside the ways mentioned above. There are going to be opportunities for all different types of designers to contribute along the way.
It would be great to hear any ideas people have for other things to iterate on. All of these iterations came from feedback so keep that flowing! All of this information will also be added to the handbook to ensure it’s easy to discover.
This week’s design team meeting was held yesterday at 17:00 UTC. You can catch up on the archive here.
Here are the summary notes:
There are no items to triage in our inbox.
There was an open discussion.
A weekly update on GutenbergGutenbergThe 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/ design was asked for and will be added.
This week Gutenberg released 3.4 and there is a weekly meeting still happening every week at 13:00 UTC on Wednesday’s in #core-editor. The project is in new feature freeze still but iterations and feedback is welcome.
4.9.8 is due out and @joshuawold talked about what the experience was like for him and gave his insights from co-leading.
A final mention is worth adding of the #core-test channel and make.wordpress.orgWordPress.orgThe 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//test where you can find usability testing for the project.
You can join the chat each week in #design at 17:00 UTC on Wednesdays.
There will be no regular meeting for the next 2 weeks, instead we are trying something a little different. At Thursday 20:00 UTC on the 4th and 11th May, there will be a drop in time in #design. Everyone is welcome to come, bring a ticket or discuss any topic you want about design.
Don’t forget during these two weeks the CustomizerCustomizerTool 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. and Editor still have meetings that designers are welcome to join:
It’s spring, it’s busy, and everyone is deep in work on the pluginPluginA 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. So we’re making a small change to the format. Instead of weekly meetings, we’re doing weekly office hours. That is, you’ll be guaranteed to find someone in chat, ready to discuss any topic you’d like to bring up.
The office hours start at 17:00 UTC, 19:00 CEST. Here’s a handy link: Wednesday April 5th 17:00 UTC. Yes, we’ve double-checked that.
Since last time:
Work is proceeding on the plugin. Follow it in GithubGitHubGitHub is a website that offers online implementation of git repositories that 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/, for example this link.
Feel free to leave a comment and we can discuss anything people want.
Remember, even if there are now office hours, the #core-editor channel in Slack is open 24/7! 💫
Work is proceeding fast on the editor pluginPluginA 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. Anyone have something to share or discuss?
Anyone have test results to share?
With DST here, is there a better time for the weekly meeting?
Anything else?
As a reminder, day to day work happens in the GitHub repository. Feel free to leave a comment and we can discuss anything people want.
At WordCampWordCampWordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. London some tests were written and worked on, time to share! Props to @karmatosed, @martinlugton, @j-falk and @lucijanblagonic.
Work has started on the feature pluginFeature PluginA plugin that was created with the intention of eventually being proposed for inclusion in WordPress Core. See Features as Plugins.. Most discussion happens in PRs. The floor is open to discussing the current state.
Anything else?
Feel free to leave a comment and we can discuss anything people want.
You must be logged in to post a comment.