Video-Based Presentation

Using this mini-project, you can play a video and automatically stop it at some important points. It allows me to design my slides using Blender (a very complete 3D editor), for instance to get nicer animations that what is possible in existing softwares (yea, try to do complex animations in Beamer...), but you could use it for any kind of video (including the ones generated using Manim for instance). To run it, you just need a modern browser (I've tested it only in Firefox and Chromium). In case you are affraid the computer you will use won't, you may like Portable executables.

Note that this project is extremely young and not very mature, so use it at your own risks. Notably, it may go too far for one or two frames before coming back to the good slide. I try to avoid that by stopping a bit before, creating sometimes a small freeze (too avoid this issue, add a second identical slides right before the stop), but I can't guarantee that this will never fail: this problem seems hard to avoid as I asked here, except maybe by cutting the video beforehand (this needs to be tested, I had bad experience with this method in the past). Note that I added a code to properly handles stops that are on consecutive frames (useful when there is no wanted transition), so this should not be too much of a problem.

For reference, the stop frames of the current video are .

Documentation

Download the html file (for instance via File > Save or Ctrl-S or directly using Github) in the folder of your video, rename your MP4 video into video.mp4 (you can also edit the name/format in the html source), if your video is not 25 frames per seconds (can be checked using Ctrl-J in VLC), you may also need to change the line framerate: 25,, and edit the following line in your html: var stopFrames = [30, 60, 90, 132]; in order to list the frames at which the program should stop. To find the frame numbers, either use your own softwares (you may export Blender markers for instance) or use the Log function provided in this project (hover the mouse to get documentation).

Then, just reload this file and click on the above button. To see the documentation and shortcuts, hover the mouse on the buttons.

Ideas to Improve

• Check if reliability of frame-precise stop can be improved to avoid small freeze right before stopping.
• Integrate it into existing frameworks like Reveal.js (linear slides) and Impress.js (like Prezi). Notably, could be useful to have slides with multiple videos and normal html slides containing math, javascript diagrams…
• Improve the code (VueJs?) and documentation.
• Add some styling.
• Create a script to export blender marks into frame numbers, and see how to adapt Manim code.
• Allow the user to specify the
• Map the shortcut only to the video in fullscreen, so that one can embed multiple presentations in a single page. Maybe provide a way to define a default presentation.
• Export to PDF the last slides using decktape and my function quickNextSlide.
• Move quickly to a frame number. Add a notion of incremental slide. Maybe not needed if integrated into Reveal.js/Impress.js.
• Check how different it is from InspireJS annotated videos. (just discovered it). See also this answer.
• Integrate with youtube videos. Maybe using VideoJS.