Design Share #62 (Aug 12-Aug 23)

This is a bi-weekly update of work the design group contributed to. Work happens in overview issues, and in needs design, or needs design feedback issues.

If you have updates you’d like to include in the next Design Share, drop a note in the #design channel. If you have questions, you can also ask them there, or as a comment on this post.


Systematising typography styles in the admin 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.

Status: In progress

An exploration in establishing a set of tokenized typographic styles that can be utilized throughout the admin interface as we embark on the wider admin redesign. Follow along in https://github.com/WordPress/gutenberg/issues/64340.

Text-Wrap Controls

Status: Needs dev

The issue for adding text-wrapping controls to Global Styles → Typography is ready for a dev.

Small Placeholders

Status: Needs dev

Continuing to refine the Placeholder component so it works as intended in wide contexts, but doesn’t break apart in narrow contexts such as columns or small grids. Issue.

Styling States in the Style Book

Status: Needs feedback

How should pseudo states like active/hover/focus be styled? How about the current menu item? And can it be done in a way that’s intuitive for theme developers, but not prominent in the regular UI given it’s not likely to be a common task? Share your thoughts on the issue.

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/: Sign-in

Status: Needs dev

The WordPress admin-bar is still shown on a few pages of the site, solely to support a log-in link. By moving that to the secondary navigation, it can be both contextual and avoid the layout shift of the admin-bar appearing. Issue.

“Add New”

Status: Needs feedback

Mockup that explores how it would look if the +New button was added in the site editor. Issue.

Image Cropping

Status: In progress/Needs feedback

Work is underway to improve the image cropping tools. As part ofthat, we could use the opportunity to simplify the cropping flow to have a more predicatable 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. toolbar with a modal behavior. PR.

Font Library in Classic Themes

Status: Exploration/Needs feedback

Very early exploration on how the Font Library might be made available to classic themes. Share your thoughts here.

Expand ItemGroup for greater flexibility and a more consistent UI

Status: Exploration

In recent times ItemGroup instances have been extended ad hoc to accommodate required features. This inevitably leads to inconsistencies and maintenance headaches down the road. In #64445 we’re exploring how we might expand the component scope to cater to more advanced use cases.

Update Modal animation

Status: Exploration

PR #64580 explores a simplified animation, with the modal originating from the center of the viewport.

Update ToggleGroupControl appearance

Status: Exploration

When multiple instances of this component appear in quick succession the heavy active state adds a lot of noise and can be overwhelming. In #64439 we’re exploring alternative approaches.

Five for the Future refresh

Status: Exploration

We began tackling the refresh of Five for the Future. The update involves shifting from the expressive idea explored in the previous project stage to syncing the design with other site sections by reusing layouts and block groups.


#design, #design-share