search

WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.52k stars 4.21k forks source link

Add quick setting to video panel for "GIF-like" playback #19730

Open pbakaus opened 4 years ago

pbakaus commented 4 years ago

Is your feature request related to a problem? Please describe. GIFs must die as format, as they have file size, color palette and performance issues. Much as been written about it, the best article is probably this WebFundamentals article.

Describe the solution you'd like It would be excellent if Gutenberg could steer people into using videos by making "gif-like" playback just one click away (most journalists likely don't know which options to toggle). Here's a concept mock (but this certainly doesn't have to be the exact solution): animation_gutenberg

I blogged about it here as well (calling out Gutenberg, but mostly as positive example, not to single it out).

Describe alternatives you've considered An alternative that should probably also be done but might warrant a separate issue is the auto-conversion of GIFs you drag into Gutenberg to mp4/webm combinations. Platforms like Twitter already do this, and WordPress/Gutenberg would be doing a great service to the planet by wasting less CPU cycles for billions of people.

/cc @westonruter

westonruter commented 4 years ago

I don't think it is feasible to transcode GIF to MP4 on the server given the wide variety of capabilities among hosts. What would be interesting is doing this conversion client-side with Wasm. If someone drags a GIF into the editor or adds a GIF to the media library, before uploading it could:

  1. Transcode from GIF to MP4.
  2. Generate poster image frame for the video to set as the attachment's featured image.

Disclaimer: I'm not a Wasm expert, or even a novice.

pbakaus commented 4 years ago
  1. Transcode from GIF to MP4.
  2. Generate poster image frame for the video to set as the attachment's featured image.

Disclaimer: I'm not a Wasm expert, or even a novice.

Totally possible. Promising new actively maintained ffmpeg.js: https://github.com/ffmpegjs/ffmpeg.js

swissspidy commented 4 years ago

Very promising stuff!

I think client-side asset optimization and transcoding definitely warrants its own issue and perhaps even a Trac ticket (as it doesn't affect only Gutenberg).

In the meantime, such a UI change seems like a great first step. There might also be other touchpoints for this. For example, when a user uploads a gif, the editor could suggest using a video instead.

swissspidy commented 2 months ago

I've been solving this using the variations feature. It works pretty smooth:

https://github.com/user-attachments/assets/ecf0d904-6619-4e73-8573-866e0f445313

I'm going to demo this at WCUS this month, and will continue working on it as part of #61447