Hello. I am new to Bubble but not to programming. I have some doubts as to how to do this the better way.
I will show video on a page, and I assume I can start, stop, pause and resume videos via the Bubble workflows. I’ll use Youtube videos. Can I have elements like images, links and so on appear at a given time in the video as over or underlays and can I use buttons as a menu in my videos like chapters you can select? In that manner, I hope to make an interactive non-linear book. The inspiration comes from Adobe Captivate interactive HTML5 video player.
Looking forward to getting to develop in Bubble!
Lars
Denmark
I suspect there’s a way to make this work, but am not 100% sure. How would you make this work with custom code?
…with Bubble, you can have overlays and the like come in based on timing. You can create your own controls as well. The two key challenge with all of this seem to be 1) having those actions drive the corresponding behavior in the video. If YouTube (or Vimeo, etc.) has an API that enables this then it’s straightforward in Bubble. You may also be able to create a bit of JS that is triggered when a user clicks you Bubble menu items that clicks the corresponding button in YouTube.
And, 2) you may have a bit of a challenge in keeping the timing of the video in-sync with Bubble so that it knows when, exactly, to overlays, etc.
With both, if you can find ways to have the two systems talk to one another (e.g., via API, JS, etc.) then it should be executable.
Also, one gotcha to share - if you make this Bubble page responsive then when a user resizes the page it’ll redraw the video element (which restarts the video). So, you may want to make the page fixed width in Bubble and then use either plugins or custom JS to size elements so that it appears responsive to the end user. It’s a bit of a pain, to be frank, but entirely doable.
I’ve built something that does what you’re describing using Cloudinary http://rebrand.ly/cloudinary.
Hello Scottb50. How do you see the use of Cloudinary? Please elaborate a bit.
Ok. Yes it can be done in JS, as Adobe does. Maybe a script will solve it, but it defeats the use of Bubble a bit. Maybe I just should experiment a bit. I use Youtube because I get auto CC and auto-translated CC’s. YouTube has a very strong API, so I think I’ll go down that road at first. Thank you for the insight.
