Design Share: Aug 28-Sep8

The Design Team provides user experience, user interface, and visual design expertise for the WordPress project.

Want to get involved?

Welcome! This all-volunteer team needs designers of various kinds. 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 WordPress open sourceOpen Source Open 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.

↓ Updates from design

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

Unlinking a style from inherited source

An addition to the previously shared style inheritance design, where a single-click affordance is added to detaching the value from its source. More discussion in this issue.

Drawer icon

A quick PR to try a different icon for the edit button in the site editor details panel. PR with more context here.

Hosting refresh

A minimal visual refresh exploration of wordpress.org/hosting.

Missing fonts

With font choices on the radar, what happens if you use a pattern that references a font you don’t have on your website? This sketch imagines a dismissible snackbar that lets you install them from the library. An early draft at this point, just to aid discussion on the issue.

Color explorations

Continued color scale explorations. Mostly small tweaks from last time. Branch here.

Templates table

An exploration assembling the template management table using the foundational principles proposed for the Table component (see issue: #53233).

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

Tom J Nowell 7:16 pm on September 11, 2023

Can we standardise on wether design shares include a read more 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.? Usually design shares are delivered via email in full, but this one was just the first paragraph.
- Tom J Nowell 7:20 pm on September 11, 2023
  
  Additionally, the initial 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. with white on purple loses all styling when sent out in emails and becomes a dark gray text on an off-centre mid gray square.
  - Joen A. 6:49 am on September 12, 2023
    
    Ah, thanks for the note. I’ve updated the color of the intro 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. so it should at least have a black background in emails. Let me know if that works.
    
    Yes, I think we should standardize on including a Read More block for every design share. The reason we started using these is because the length of the post became dominant in the main index, causing other important posts to become less visible as a result.
    - Tom J Nowell 8:53 am on September 15, 2023
      
      Looks the same, I don’t think the issue is your choice of colours, but that the blocks styling doesn’t translate through Jetpack emails. It always shows as black text on a div with rgba(0,0,0,0.5)
      - Joen A. 8:58 am on September 15, 2023
        
        Not sure, but it sounds like the overlay from the fact that I used a 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.. I changed to use a columns block now, hope that helps.

The Design Team provides user experience, user interface, and visual design expertise for the WordPress project.

Want to get involved?

Find out how to get design help.

Meetings

The Design Team provides user experience, user interface, and visual design expertise for the WordPress project.

Want to get involved?

Find out how to get design help.

Meetings

Unlinking a style from inherited source

Drawer icon

Hosting refresh

Missing fonts

Color explorations

Templates table

Share this: