Add speaker notes system (proof of concept included)
Description Speaker notes provide an option to show some extra information on a secondary screen that helps with presenting. It's commonly supported in other programs like PowerPoint and Google Slides. In my opinion it's crucial to making a good presentation.
PowerPoint and Google Slides also provide preview of the next and previous slides. Tho I am unsure how hard it would be to do that for Motion Canvas and that sub-feature isn't the highest priority.
Proposed solution The feature should open a new tab with a parameter to change the selected UI to a speaker note UI. Using params over url paths should ensure that the presentation can still be exported to a HTML file.
The API could just expose a second parameter to beginSlide or it could expose a separate setNotes in case the notes should follow the animation.
Considered alternatives The alternatives to this would be having a PDF open or having notes on paper. But those options don't work that seamlessly
Additional context To ensure the feature wouldn't be too hard to implement, I did a proof of concept to check the viability of BroadcastChannel in a React app. However, I do not have enough in-depth knowledge about the structure of Motion Canvas to implement it right now in the actual application.
https://github.com/user-attachments/assets/d8ce81fc-150d-48d5-91d0-2554294d7ef6
The code for the example is split into two parts, the Observing and Source components https://gist.github.com/Wokarol/2f219a69e94d9701676a205003ee288e
The components use Mantine and should be self-contained. Also, as seen in the video above. This approach should work no matter the order at which the pages where loaded.
Of course, if need be I can help with implementation (If I will be able to)