FSE Program Exploration: All Things Media

With WordPress 5.9 shipped, the big pieces of full site editing are out in the open ready for feedback. Rather than digging once more into these pieces for now, let’s leave that to the wider world to absorb and switch into an aspect of site building that can be very make or break: the role of media. Whether it’s setting a featured imageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. or adding a headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. image, there are tons of ways media touches all parts of building a great site. 

Like last time, the focus of this exploration is to think with a more long term, “wishful thinking” perspective in order to gather useful insights that will help inform the design of media related experiences going forward. This is achieved by guiding you through some common tasks for site building with media, and then by asking each of you to creatively think about what you’d like to see happen. Since this is not quite a call for testing due to the lack of flows, focus less on finding bugs (although they are still welcomed) and more on thinking through things you wish would happen.

As you look over the post, remember that you can engage with all of the items or just one of them! Either way, it’s all helpful.

Brief Overview

Part of why we’re doing this call for testing is because there are a few new projects and tools around media in the WordPress project that you might have missed: the WordPress Photo Directory and Openverse. 

The WordPress Photo directory is currently in betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process., and aims to offer a curated source of high-quality images. By adding your photos there, the photos will automatically appear in Openverse, a search engine for openly licensed media with over 600 million items to use free of charge. Right now, these are standalone tools but, in the future, there will be huge opportunities to integrate them directly into the WordPress experience. This exploration will help inform this very early work that’s also in line with various 2022 goals

To read more about the WordPress Photo Directory and Openverse, check out this comprehensive post sharing everything you need to know.

Task 1: Explore what’s currently possible 

These tasks are purposefully open ended as there’s often a few ways to accomplish them. When you respond below, share what approach/steps you took and why! Any bugs you find too, report away in your comment. 

  • Add a duotone filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. to 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. with an image or video in it and add text over top, adjusting the opacity as needed. 
  • Add an image to the background of your header.
  • Add a caption to an image. 
  • Crop or rotate an image in a gallery block. 
  • Add an external non-copyrighted photo to your post as a featured image. Bonus points to share where you searched for the image and where you normally do so.
  • Change the size of your featured image for your posts by editing your post template. 

For this exploration, it would be advantageous to use a block theme since this is meant to capture media in the context of full site editing. As a result, please follow these steps:

  1. Set up a test site. You can follow these instructions to set up a local installLocal Install A local install of WordPress is a way to create a staging environment by installing a LAMP or LEMP stack on your local computer. or use a tool like this to set up a development site
  2. Install and activate a block theme from the options listed in the theme directory

Task 2: Describe what you’d like to see

As you go through the above experiences, consider the following questions as a way to reflect on what you’d like to see in the future. This could be everything from being able to use a featured image as a background of a cover block to having more built in controls to style your images to rethinking featured images in general. Don’t hold back and don’t worry about how practical an idea might be. This is just to get a sense of what folks might want to do in the future.   Answer one, all, or none! These are merely to get you thinking in the right framework rather than boxes to check: 

  • How would you like to see Openverse or the WordPress photo directory integrated into the experience?
  • What comes to mind when you think about Patterns and media?
  • What workflow improvements can you think of? What was hard to accomplish? 
  • What basic tasks do you find you have to do outside of WordPress to get your media just right and how would you like to see those tasks integrated into the experience? 
  • How would you feel about using an image where attribution information couldn’t be removed? What about an image where you can not make significant changes?
  • Anything else? Think big!

Please share feedback by Wednesday, Feb 23rd, 2022

As always, thank you for participating in this exercise. If anything is blocking you from doing so, just say so either in #fse-outreach-experiment, in the comments of this post, or over DM in 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/. to @annezazu (that’s me!). Keep in mind that not everything shared here will be implemented by the nature of this exploration but know that your ideas will ultimately help shape what is possible going forward. 

Join a hallway hangout on Feb 16th, 2022 @ 5:30PM UTC 

If you want to dig into this exploration more and chat about All Things Media, join @fcoveram and @annezazu in an upcoming hallway hangout. As a reminder, these are casual, open calls that anyone can join and leave as they’d like, have their video on/off, talk or just listen! It’ll last under an hour and will be recapped on Make Test

To join, head to #fse-outreach-experiment in Make Slack where a zoom link will be shared at the time of the hangout. 

#fse-exploration, #fse-outreach-program, #fse-testing-call, #full-site-editing