The Design Team provides experience, interface, and visual design expertise for the WordPress project.
Want to get involved? See our handbook and drop into #design once signed up for volunteer opportunities. Our vision is to be the go-to resource for design for other teams across the open sourceOpen SourceOpen 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.
Hey, everyone! After sharing a proposal for a new approach to this year’s default theme that would emphasize a diverse collection of style variations, there were a lot of positive replies and notes from folks who’d like to be involved in the process. With the help of @mikachan, we now have a repository for a stripped-back and minimal version of Twenty Twenty-Two, which can serve as our base theme. I wanted to use this post to outline some of the process and timeline details around the collaborative format we’ll use to create style variations for the TT3 theme.
@beafialho made a few changes to TT2 in order to strip it down to a bare, unopinionated canvas:
The largest heading sizes have been scaled down
Different color styles have been applied
The serif font for headings has been replaced by system sans serif font
Images have been removed
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/ fluid typography and spacing presets functionality have been added
Bea also made four style variations to demonstrate how dramatically different the look & feel of each of the variations can be:
One important note is that we are limited in the number of fonts we can include with the theme and should aim to use 3–4 different typefaces across all variations (in addition to systems fonts). Bea has selected a couple of fonts, used in the variations above, that seem like a good starting point to use because of their simplicity and variety:
System sans serif font
IBM Plex Mono
Source Serif Pro
This is just a starting point, rather than the final list of fonts that will be included with the theme. If anyone feels strongly about using a different font, please speak up because this list can certainly evolve based on what folks would like to use! We can also suggest changes to the base theme as needs arise.
We can collaborate throughout this process in a dedicated channel on the Making WorkPress Slack: #core-themes-projects. If you replied on the original post or reached out in DMs, you’ve already been added to the channel. This can be a place for folks to ask questions and share work in progress through screenshots or videos. The more we work together, the more we can ensure all the variations feel as different, opinionated, and unique as possible!
Design a style variation
This can be done a few different ways, including:
Make changes in the Global Styles panel in the Site Editor. You can save these changes as a new style variation using the Create Block Theme plugin.
Design static mockups in Figma or a similar program.
Submit your style variation
When you’re ready to submit, please create a new issue on the TT3 repository and share your designs:
Theme.json files can be submitted as code or as zip files.
Add images that showcase the look & feel of the variation.
Include a style guide with design specifications — this should include details on typography, colors, spacing, etc. Here’s an example.
Aug 10: Project kickoff
Aug 31: Style variation submissions close
Sept 7: Final curated set of style variations announced
Sept 20: Theme and all variations are committed to Gutenberg trunk in time for WordPress 6.1 BetaBetaA 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
There are a few open issues and PRs that would benefit this project and may be able to be moved forward in the next few weeks, including:
We appreciate any efforts by Gutenberg contributors to help move these issues forward! Let’s plan to keep in touch in the channel about any significant changes in functionality that happen after the project kickoff.
Huge thanks to everyone who’s contributed and shared ideas for this project so far!