Design Share: Mar 27-Apr 21

Hi, all! Here are a few projects the Design Team has contributed to over the past couple of weeks.

Safe content browsing flow

The design for searching and browsing safe content in Openverse is done. The last iteration included the page for all results, and audio components for blurring text content. Frontend implementation should start in the following days.

Modal polish

We added a radius to modals, and refined their metrics overall. 

Top Toolbar

Just merged in #49634 is a new take on the Top Toolbar option, which pins the 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 to the top of the screen.

WordPress site map

We continued mapping the information architecture of WordPress site. This time we dived into each section, identified navigational patterns, and added screenshots to follow up on content and design changes. The diagram is almost done and two sections are pending mapping.

Condensed Unlinked Padding Control

Jay’s design for a condensed revision of the padding control, with a few refinements, is ready for a dev in #49264.

Inspector Alignment Tools

Alignment tools, so far having been only available in the block toolbar, can land in the inspector for consistency, in Jay’s mockups for #49272.

List-View scrolling

Scrolling in the list view container was refined.

Inspector Site Logo Management

Ready for a dev to pick up, #49273 details how you should be able to set, replace, and manage your site logo also in the inspector.

Font Management

The main font management issue, #45271, has been updated with fresh mockups that detail how to add fonts from Google, or manual upload. An early PR is available here

WP.org Two-factor authentication

Two-factor authentication is being enabled for wp.org accounts, and the Security section of your profile will receive a box allowing you to enable it. Shown here in the incoming colors, but landed in the PR in the classic colors for the time being.

Focus style in search

As part of the WordPress redesign’s improvement tasks, in PR#378 we explored different solutions for the focus ring for each site theme.

Command K Search

Currently present in the 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 behind an experimental flag, there is a new a command bar invoked by ⌘K, providing quick access to common actions. Most recent PR. See also these mockups.

Template vs. content editing

A collaboration between Saxon and Robert, the PR explores a cleaner split between content and templates, and is quickly maturing. 

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

A mockup of a refined login flow for the WordPress.org website.


If you have updates you’d like to include in the next Design Share, please drop a note in the Design channel on the Making 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/..

design, #design-share