tobiaswillmann.de

Reuse AMP-Stories on Instagram

2019-06-13

The idea + test of creating “Stories” just once (as AMP Story) an reuse them on social media with screenshots.

Currently all “Story formats” on social media (Instagram Story, Snapchat, Facebook Story, …) are based on images or video files. If you want to do animations or text overlays you have to edit images or video files.

Compared to that AMP Storys are HTML like structured data, which makes it easy to reuse and edit them. If you want to change a typo in an AMP Story video overlay that’s doable within the same AMP Story besides on Instagram Stories the original video needs to be deleted, text in the video file needs to be edited and finally the video needs to be uploaded again without the typo 🤮 …

How to don’t produce content twice

With AMP Stories you have the ability to get a premium position in Google search and in general them being cool you probably will produce AMP Stories soon.

So the following idea and test is to not produce content twice but reuse the AMP Story.

There are some facts which kind of force us to start with the AMP Story:

  1. AMP Stories are structured data, which is always better
  2. Instagram Stories are not transferable into AMP Stories without manual work. The other way around that’s possible. (I’m not even sure if you can download them easy — your always on a phone)
  3. I prefer to have something running in a browser on my domain instead of inside Mark’s closed systems

Taking Screenshots of AMP Stories

So I’m currently building a tool which takes an AMP Story as input and makes screenshots of it. (Video capture is planned to copy animations, too)

The tool in detail

Skip this if you have no development interest.

It’s all done on AWS. The main component is a Lambda, which hosts a headless Chrome + Puppeteer to take the screenshots. There is an API Gateway to access the Lambda and the S3 bucket storing the screenshots, too. Because the timeout of the API Gateway is limited to 30 seconds I used a Step Function to separate the longer running Puppeteer Lambda. All of it is secured with Amazon Cognito.

The tool for the user

Currently as a first public version I created a react app which let’s you screenshot AMP stories. On the left you see the embedded AMP Story on the right the Screenshots

The results

Except of the tool doing screenshots automatically there are differences in the screenshots. The tools screenshots on the right are cleaned up (no mute buttons, share buttons, sound icons, …) and resized for Instagram usage.

Test it

  • This is the first public version
  • Login is needed
  • Verification is done by email. The phone number can be whatever you want to enter (It’s in there because I use the default Cognito login).
  • I’m not interested in your data (except the great AMP Story you submit)

here you go:

http://bit.ly/2KdPa9b

Screenshots taken from this great AMP Story https://people.com/amp-stories/royal-a-to-z/

© 2020 Tobias Willmann