Multimedia Comments in LiaScript - This Changes Everything
- André Dietrich
- Article , Documentation , Examples , Tutorial
- July 30, 2024
How can you add your voice or short video sequences to your LiaScript courses? With the new multimedia comments feature, it’s now possible. This feature allows you to replay your voice or video directly in the browser as part of a LiaScript course. It’s a game changer for educators looking to create interactive and engaging courses.
How Does It Look?
It’s quite straightforward. Simply add a multimedia link using LiaScript syntax to the beginning or end of your comment. That’s all it takes!
--{{0}}--
This is an original comment, which will use browser-based text-to-speech
output in the predefined language and voice.
--{{1}}--
This is a similar comment, but it will use a predefined audio file, which
is attached to the end or beginning of the comment.
?[audio](link_to_your_audio_file.mp3)
--{{2}}--
!?[video](link_to_your_video_file.mp4)
And this will start a video, which will be displayed in an overlay above
the course content. You can move it around and resize it as you like.
A Brief History
At the eLearning Africa 2024 conference, it became evident that relying solely on browser-based text-to-speech output was insufficient for many underrepresented languages and dialects. This long-requested feature needed to be addressed. We aimed to solve this while maintaining the readability of the original Markdown file, ensuring compatibility with other Markdown interpreters to reference and point to the multimedia content.
For the audio component, the solution was straightforward. We linked to audio files, which are not visible in LiaScript, and controlled their playback. However, integrating video was more challenging. We needed to find a way to incorporate the video into the DOM without disrupting the original content. Inspired by a virtual presentation recorded with OBS Studio using a circle webcam filter that overlays the desktop, we recreated a similar effect in LiaScript.
Incorporating accessibility features and adding recording capabilities to the live editor was tricky. However, with a bit of AI assistance, it became much more manageable.
Demo Material
To try out this new feature in the Live-Editor, follow the link below. Be sure to click on “Fork” if you want to add or record your own multimedia content. This way, a new instance of the course will be stored in your browser.
Goto LiveEditorExplore the possibilities and transform your educational content with multimedia comments in LiaScript.
Here is an embed only demo: