WordPress.org

Make WordPress Core

Opened 4 weeks ago

Last modified 2 weeks ago

#51104 new enhancement

Twenty Thirteen: Add Block Patterns

Reported by: melchoyce Owned by:
Milestone: 5.6 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: needs-design
Focuses: Cc:

Description

With block patterns introduced in WordPress 5.5, we now have the opportunity to add some patterns to our older default themes.

Let's consider adding some patterns to Twenty Thirteen.

@joen, since you were the designer for the theme, would love to get your input here.

Attachments (12)

2013-pattern-audio.png (39.6 KB) - added by melchoyce 3 weeks ago.
2013-pattern-chat.png (191.4 KB) - added by melchoyce 3 weeks ago.
2013-pattern-gallery.jpg (221.7 KB) - added by melchoyce 3 weeks ago.
2013-pattern-link.png (40.4 KB) - added by melchoyce 3 weeks ago.
2013-pattern-quote.png (83.1 KB) - added by melchoyce 3 weeks ago.
2013-pattern-status.png (45.8 KB) - added by melchoyce 3 weeks ago.
2013-pattern-video.png (1.5 MB) - added by melchoyce 3 weeks ago.
2013-pattern-two-columns-text.png (319.1 KB) - added by melchoyce 2 weeks ago.
2013-pattern-quote.2.png (301.7 KB) - added by melchoyce 2 weeks ago.
2013-buttons.png (49.7 KB) - added by melchoyce 2 weeks ago.
2013-cover-bottomleft.png (99.6 KB) - added by melchoyce 2 weeks ago.
2013-cover-centered.2.png (110.1 KB) - added by melchoyce 2 weeks ago.

Change History (22)

#1 @Joen
4 weeks ago

My goodness, I had so much fun working on this theme. And I have so many things I wish I could fundamentally redesign about it, things that really didn't age well 🤭 — thank you for the ping and for this effort!

Two things immediately come to mind:

The alternating ribbon of colors did not really come to pass because post formats were simply not used enough to create an interesting ribbon.

However perhaps for block patterns, we have an opportunity to revisit those alternating ribbons of colors. In other words, I'd love to see those warm bold colors used in big swathes that take up the whole pattern background.

I also recall being really inspired by retro-futuristic illustration such as those that would grace the covers of 1950s "Popular Science" magazines. Those were public domain at the time, but seem nowhere to be found. However leaning into that retro future illustration aesthetic, it appears there are some decent public domain sources to explore:

It seems like those could help create some really interesting colorful patterns, perhaps?

#2 @melchoyce
3 weeks ago

Thanks @Joen, appreciate your thoughts here!

I wonder if it would make sense to add each Post Format layout & background color as a pattern. (So, likely a bunch of different content blocks inside cover or group blocks.) What do you think about that?

#3 @Joen
3 weeks ago

I wonder if it would make sense to add each Post Format layout & background color as a pattern. (So, likely a bunch of different content blocks inside cover or group blocks.) What do you think about that?

I think that's a great idea. With the added caveat that I would hope we could improve the design slightly 🙈. Specifically we should not use as many font weights, styles, and sizes as are used now — one weight, perhaps two sizes at most, less italic, and no icons.

Inheriting the font, and leveraging the warm colors, I think, could make for some useful patterns on its own!

Is that helpful?

#4 @melchoyce
3 weeks ago

@Joen Added a bunch of screenshots of patterns. Let me know how these look to you.

#5 @Joen
3 weeks ago

Impressive conversion from post formats to patterns. I feel the color usage variation is definitely proving itself fun here.

However the intrinsic problem with post formats: how often are you going to post a "chat log", or even a "status update". Similarly with patterns you have to actively pick the right sequence of patterns in order to recreate such a ribbon.

What if we recreated some of the existing patterns, but with these colors?

  • Two buttons but with a ribbon-background color and appropriate button colors to match
  • Two columns of text, but with a ribbon-background and perhaps a heading color to match
  • Large header with a heading and a button, but ribbon color background
  • Quote, again with ribbon background

And perhaps instead of the somewhat random themes I chose in the old demo content, we could find a singular topic with which to pre-populate the patterns. Project Gutenberg has a bunch of good public domain stories from which we can quote. Perhaps from Treasure Island (http://www.gutenberg.org/ebooks/120) or Huckleberry Finn (http://www.gutenberg.org/ebooks/76) — they both encompass some of the adventurious spirit that the theme, in an idealized vision, should've embraced. The pictures should also be PD even if some of them are low quality.

What do you think? Thank you for working on this!

#6 @melchoyce
2 weeks ago

Quote and two columns of text work well. Running into alignment issues with the large header, and color issues with the button pattern.

#7 @Joen
2 weeks ago

Conceptually this totally! The second "Buttons" is a bit hard to read, but that's a nitpick. I'm digging this. Thank you Mel!

#8 @melchoyce
2 weeks ago

Yeah, the button and cover blocks are experiencing styling issues that will need to get fixed in Twenty Thirteen.

#9 @melchoyce
2 weeks ago

Created two tickets to track the style issues: #51223, #51224

This ticket was mentioned in Slack in #design by melchoyce. View the logs.


2 weeks ago

Note: See TracTickets for help on using tickets.