Video Export for Social Media Sharing

[o-fernandez]

Feature Description

Creators spend significant time creating their Web Stories and would like to easily share/post to social media. Suggest that we enable this by allowing them to:

• Download a stripped down version of their story in a format easy to share to other popular platforms (Instagram, TikTok, Snapchat, Facebook). I imagine it'd be a rasterized video?
• We should alert the creator that certain features (e.g., links) won't work in the exported version. To get the full story experience, the creator should link to the original Web Story from their post.
• We can provide a format that works well for all popular platforms, or allow some customization (e.g., story video aspect ratio, video max file size, etc.).

A few considerations on aspect ratios/video specs for the export:

• From a quick search, TikTok allows for up to 287.6 MB in size for iOS, or 72 MB on Android and video should be 1080×1920.
• IG In-feed Video Posts allow 16:9 to 4:5. Videos should have a frame rate of 30 frames per second, and a maximum file size of 4GB
• IG stories recommend using an aspect ratio of 9:16 with a size of 1080px by 1920px
• Pinterest Video Pins: recommend making vertical videos 2:3 or 9:16. Max 2GB file size.

In terms of turning the story into a video:

• If the story specificies auto-advance duration, etc. use the same timing in the video.
• If the story has manual advance, default to 7s per page OR playing video once through for pages with video before moving on to the next page.

Feature access point: We should allow the download/export as video from the Dashboard. In addition, consider adding an access point from within the editor.

Alternatives Considered

Additional Context

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

Implementation Brief

[barklund]

I was wondering if we could use Remotion + FFMPEG.WASM to do this in the browser directly, but that does not seem possible according to this comment.

And we can't run Remotion on the WP host, as we can't be sure it has any of the dependencies we require - primarily FFMPEG - or is even capable of running the binary.

So the only reasonable alternative I see is an external service, that can take an amp story and some config (e.g. "include interactive elements or not") and return a list of links to a generated MP4 for each page in the story. Such a service is not trivial to create, but with e.g. Puppeteer and spinning up a headless browser actually displaying the story, it might not be too hard either.

Overall, this is a very complex ticket though and at least 21 SP with all the unknowns.

[o-fernandez]

@barklund @choumx since this is a commonly requested feature and good value prop (both the export as a zip file the story and the export as video to share to other social media) it would be good to put a doc outlining options and limitations. I'm open to breaking down this ticket further and prioritizing subsets of work. Or even bite the bullet and work on it even if it will take a bit of effort to get it out.

[swissspidy]

export as a zip file the story

By this you mean exporting the story HTML in a ZIP file? That sounds like that should be its own ticket. My understanding was that this is all about creating shareable videos.

[o-fernandez]

export as a zip file the story

By this you mean exporting the story HTML in a ZIP file? That sounds like that should be its own ticket. My understanding was that this is all about creating shareable videos.

Yeah, there's actually a ticket for that: https://github.com/google/web-stories-wp/issues/3157 we can use that one to explore export html further.

[dreamofabear]

A slightly easier variant would be to support output of a single page in the story as a flat image for export (vs. compiling the entire story experience into a short video).

This is obviously suboptimal for pages with videos or GIFs. Do we think that would be valuable for users?

I think some other tools have the "flat image export" option too.

[o-fernandez]

A slightly easier variant would be to support output of a single page in the story as a flat image for export (vs. compiling the entire story experience into a short video).

This is obviously suboptimal for pages with videos or GIFs. Do we think that would be valuable for users?

I think some other tools have the "flat image export" option too.

Hmm... I think that's much more limited value, so not sure how I'd prioritize.

[gajasinski]

@choumx @swissspidy is it worth a quick scoping exercise to understand the sizing between delivering:

1. export as a single video
2. export as multiple frames

My thought is that most other platforms have a type of video editing within them so downloading as a single video and allowing the user to crop/trim within e.g. IG is OK for a v1

[swissspidy]

export as multiple frames

@gajasinski Just so I get your terminology right, by "frames" you mean story pages? If so, did you mean

• exporting each page as a separate video (since there can be videos,animations on a page)
• exporting each page as a flat image (as suggested further above)
• something else?

Flat image export is definitely easier, but less useful for creators.

For exporting videos, scope-wise IMHO it doesn't make a difference whether we export 1 video for the whole story or 1 video per page. In the first place we need a solution to create videos. Once we have that, we could implement either solution (or both) with the same amount of work

[gajasinski]

Thanks for the call out and for the clarification. Frames = pages

Agree flat image export isn't high value.

How can I help move this along?

[swissspidy]

I think at this point we need to dig deeper into technical exploration and do some prototyping for the various options outlined in the doc.

[gajasinski]

@swissspidy by prototypes, do you mean wires from @aaskedall and @agingoldseco or do you want eng protos?

[swissspidy]

@gajasinski eng protos

[gajasinski]

Roger

On Mon, Sep 27, 2021 at 11:01 AM Pascal Birchler @.***> wrote:

@gajasinski https://github.com/gajasinski eng protos

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/google/web-stories-wp/issues/7747#issuecomment-927960111, or unsubscribe https://github.com/notifications/unsubscribe-auth/AVUBFLJBFH6YX3ZIJ6YU4QTUECBN5ANCNFSM45SC6DFA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

-- GAJ

[bmattb]

@swissspidy What is the status of the Prototypes? There are currently no open issues assigned to either INFRA or PROM on this Epic, and I am concerned that this will need to get pushed again from v1.15 unless we know who is doing what on this? CC: @miina

[swissspidy]

@bmattb Prototype is in progress and I am leading it. Just forgot to attach the ticket to this epic: #9395

The current route we're exploring internally does not involve the editor directly, so other pods don't need to worry about this. If it goes well, we might even hand it over to another team. so we don't need to worry about it from a release/roadmap perspective

[swissspidy]

Feature request for simple flat image report: https://wordpress.org/support/topic/how-can-i-submit-a-feature-request/

[swissspidy]

Just closing as maybelater to keep our backlog light. We can reopen once it becomes more relevant again.

[kevinmcdonagh]

There is a lot of real conviction on this thread about the requirement of this feature. It is very disappointing to see this history being disregarded and shelved.

[0xFlo]

https://www.youtube.com/watch?v=egdaTNaUtWE Wouldn't this work?

[Nataly-editor]

It's July 2023, tiktok, reels, shorts on youtube are having a moment, and the issue is still unresolved and not even reopened! It's hard to overestimate how much change the feature makes for creators(((