Happy new year, all. In celebration of the new release this week, here are a few pieces of block art I created using WordPress 5.9 ✨
Below I’ve included a screenshot and a zip file for each piece that contains the images used and block markup. Feel free to remix these however you like or use them as is on your own site.
I created this piece using a few different images snapped on morning commutes in New York and London. The markup on this one is super simple — it’s a Cover block with an inner Image block. The Cover block background is a looping GIF, and the foreground Image block has transparency where the train windows would be. The new opacity functionality on the duotone feature allowed me to create a nice overprinting effect with the train car.
I would love to find audio of ambient sounds of the subway (with announcements, doors opening and closing, etc.) to add to this piece. Between that and the rocking motion, it could really lull you into the feeling of zoning out on a long train ride 😴
I wanted to capture the bold shapes, signs, and textures you see when walking around New York — all of which add to the city’s trademark chaotic energy. I created a grid of images using a Columns block and vertically stacked Gallery blocks inside each column. I added a background image of crosswalk lines using a Cover block and placed the Gallery block within as a child block. The ability to add different duotone effects to every image in a Gallery effect definitely helps add to the overall chaotic effect!
Les Peintres Graveurs
I love this hand-sketched Les Peintres Graveurs poster by Pierre Bonnard and set out to recreate it in Gutenberg. I originally drew this directly in the block editor using an iPad, Apple pencil, and the Sketch block plugin. But I ended up replacing the Sketch blocks with Image blocks in order to have more flexibility over layout/block controls, and to help simplify the markup.
TIL: The fan shape is what you get when you pinch and drag inside the Sketch block on an iPad.
3 responses to “Block art with WordPress 5.9”
[…] Made by Channing Ritter using the following materials: Group Block, Columns block, Image block. Learn more and download the images used in this blog post. […]
[…] Made by Channing Ritter using the following materials: Cover block, Image block. Learn more and download the images used in this blog post. […]
[…] from Lister’s Patternspiration work, I had caught Ritter’s blog post in January sharing how she had created block art. At the time, I was unaware that it would be a part of the then-unknown Museum of Block Art […]