Skip to content

Inserter: Add Media tab and explore basic Openverse integration #44496

@mtias

Description

@mtias

The inserter currently has tabs for Blocks, Patterns, and Reusable blocks. You can drag and drop content from these tabs into the canvas to build your pages. #44028 further redesigns this with a two-column split, and clearer categories.

This convenient way of adding content translates well to media as well. It'd be nice to starting exploring a "Media" tab for easy access to your library. The Media tab can explore integrating Openverse as well, plus an option to open the full media library.

The inserter panel should support the ability to drag media from the inserter into the canvas, including dragging into block placeholders to quickly update patterns and such with your own content. The Media tab would allow users to choose between categorized assets from the media library, and from Openverse.

image

The default state for the Media sidebar would show the last N items from the Media Library. We could also consider hiding the empty tabs, so initially, users will only see the Openverse one.

To avoid having two search boxes side by side, we should consider moving the inserter search box under the segment control, but we could still recommend both types of items (patterns and blocks) when users search for the other category as we do now.

image

Openverse

We should figure out which kind of media and licenses we'd like to show. I imagine that for the first iteration of this feature we could limit the results to just images that are in the Public Domain or CC0 licensed, but in the future we could explore showing more types of media and giving more fine-grained filtering options.

image

See the comments for some more explorations on openverse branding.

Figma file with the explorations.

See also: #41379.


Issue updated Sep 30.

Metadata

Metadata

Assignees

Labels

[Feature] InserterThe main way to insert blocks using the + button in the editing interface[Feature] MediaAnything that impacts the experience of managing media

Type

No type

Projects

Status

✅ Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions