Best practices for a full screen video player that should instantly swap between videos when buttons are pressed

Hiya, I’m making a simple 2 screen video player. One screen will display a full screen video, and the second screen displays a grid of buttons, which when pressed will trigger a different video to play. (Approximately 20 videos, each linked to a button)

I’m setting this up as a single composer project, with the two sides mapped to the correct screen. (See screenshot)

I was wondering if anyone knows the most efficient way of switching between videos, so there is no loading time. Viewers will be able to click buttons to instantly start playing the video.

I’ve currently set up an Swap Collection with child video players, so there is a video player for each video.

This would require me to add a trigger to every button, with the following steps:

  1. Stop all video players playing
  2. Rewind all video players
  3. Set swap collection “index in focus” asset to the correct number (depending on button pressed).
    4.Play 1 video player (the one in focus, depending on button pressed).

The videos are currently stored as attachments in airtable.

I’m currently seeing a white flash when I’m triggering the rewind action before playing. I’m also finding that the loading time is instant when I’m playing a video added to the content library, but there is a slow loading time when playing from airtable.

I’m wondering if anyone has any knowledge about best practices about swapping between videos?

Can I read videos from Airtable, or is it always faster adding to the content library?
And secondly is my method of using 20 video players in a swap collection fine, or should I use a single video player and swap the Video reference?

Thanks!
Laurien

Hi Laurien,

Welcome to the community!

Probably the easiest method I can think of on the top of my head would be this

  1. Create a Airtable base with the name of your video and also the video file along with an index/order.
  2. In the composer create an Asset Grid or any collection of your choice, in my case I used an Asset Grid, right click an create a dataset. Then drag and drop a button asset and bind the name to the name of the button inside the Airtable table, create a trigger on the button to do the following: WHEN > Button is pressed > Change video > URL of video attached from the Airtable record. This should make the video change when you press any of the buttons. You will see I have added a play the video trigger when the button is pressed.
  3. Make sure the video asset is set to VLC otherwise it will not pull the video as it requires HTTPS and make sure that you have a constant internet connection as Intuiface does not cache anything with Airtable

Here is the quick example I have made that should give you an idea:
Airtable Video Example (Easiest Method).zip (2.3 MB)

If you require a caching option we have built an Interface asset for Airtable/Intuiface that allows you to download all the content in the base and play the experience offline without an internet connection.

If you have anymore questions do please let me know

Kind Regards

Louie

Hi Laurien,

Sent you a pm with how to achieve the best results I usually get.

Regards,

Hiya,

That example was really helpful, thanks!

Yes the interface asset that downloads content would be really helpful! Where can I find that? Would it allow clients to update airtable and then recache assets without having access to Composer?

I’m finding that there are a couple of strange things happening when the video starts playing.

Firstly - there is a cross fade automatically happening on play and on stop. It seems to be cross fading to the Poster image (when either time in video or external image is set), and when the cross fade has completed the video starts playing.

There seems to be some inconsistent pops when this fade is happening. It’s clearer to see when I set the external image to something completely different to the video.

I’m wondering if I can turn this cross fade off? As I’d like to just play the video without any intro/outro effects applied.

Secondly, even if I set the video asset size to the exact size of the video asset, I’m finding that there’s an initial visible pop in size when the video starts playing when the video fill behaviour is set to either “Fit” or “Fill”. Only deform stops any visible resizing happening.

This isn’t necessarily a problem, but ideally it would be set to “Fit” just in case clients enter the wrong dimension video into the airtable doc. Is there a way of hiding this pop?

Hi Laurien,

Regarding the plugin you are correct, it downloads all the bases and the content within to a local machine, if you want more information please do let me know.

Regarding the issues or glitches you are having I would recommend that you contact support as they will be able to give the best advice/recommendation to resolve your issue.

Kind Regards

Louie

1 Like

Hiya,

Sorry for the delayed response - I was away on annual leave. Ok great to know, thanks!

That plugin sounds great - is that publicly downloadable?

Hi Laurien,

Unfortunately it’s not but if you are interested do please send me a PM.

Kind Regards

Louie