PanDocElectron/How to create a html presentation

Introduction

With the help of this tutorial the user should be able to create a HTML presentation with audio stream based on a Microsoft PowerPoint presentation or other presentation files. In the first part of this tutorial it is described, how to install necessary software applications. The second part consists of a step by step tutorial on how to create a HTML presentation and how to implement it in a learning management system (LMS). Originally, this tutorial was created for lecturers at a university. The most lecturers used Windows 10, Ubuntu 16.04 and OS X as operating system. Therefore, the commands used in this tutorial are based on these operating systems and might be different for other operating systems or versions.

Necessary software and its installation

The following software tools are necessary to create a HTML presentation with audio stream

• A software to create and edit presentations and to export them into PDF format: e.g. Microsoft PowerPoint, LibreOffice Impress or Apache OpenOffice Impress.
• A tool to split animated slides into single slides, e.g. PPspliT (optionally if presentations with interactive elements or animations are used)
• A tool, that converts PDFs into single images and creates a HTML file, e.g. PanDocElectron and additionally required software tools.
• Software to record audiostreams for the slides, e.g. Audacity

Optionally:

In some cases it is necessary to convert the HTML presentation in a video. For this conversion an additional software tool is necessary. For example:

• FFmpeg, Windows Movie Maker

Installation

Installation of presentation software

The basis of a HTML presentation is a presentation in PDF format, created with e.g. Microsoft PowerPoint, LibreOffice Impress or OpenOffice Impress. If not installed on your local computer, you can download LibreOffice or OpenOffice software packages for free from the following URLs:

• OpenOffice: https://www.openoffice.org/download/index.html

• LibreOffice: http://www.libreoffice.org/download/libreoffice-fresh/?version=5.2.0

Please select the installation files for your operating system, download them and follow the installation instructions.

Installation of software for splitting animated presentations

The first step to create a HTML presentation is to convert the PowerPoint or Impress presentation into a PDF file. Standard presentation software like Microsoft PowerPoint, LibreOffice Impress or OpenOffice Impress are able to export static presentations (presentations without animated steps in a slide) into a PDF with each single slide exported as an own PDF page.

The mentioned presentation software is not able to export slides with animated elements, for example, if parts of a slide are only visualized by a given action, e.g. by pressing a button. If animated slides are used, they have to be converted with an add-on into single slides with each animated step on a single slide.

Microsoft Office (PowerPoint)

• Follow the URL http://www.dia.uniroma3.it/~rimondin/downloads.php , download the installer for PPspliT and follow the install instructions.

OpenOffice and LibreOffice Impress

• Download the following file https://raw.github.com/monperrus/ExpandAnimations/master/dist/ExpandAnimations-0.4.oxt and open it with LibreOffice or OpenOffice Impress.

An add-on will be installed for OpenOffice/ Libre Office Impress, which converts animated slides in more than one slide with each animation step on a single slide.

Installation of converter software

We will use the software tool PanDocElectron together with additional software tools to convert the generated PDF file into a HTML presentation. PanDocElectron is able to use different input formats, like PDF, Markdown, wiki markup etc. and converts them into the wished output format, like HTML audioslides, LaTeX, odt etc. .

• To install PanDocElectron and necessary additional software please visit http://niebert.github.io/PanDocElectron/ and follow the installation manual described for your operating system. The easiest way is to use the install scripts provided at that page (Linux and Mac users).
  • Press the „Install Script“ button
  • Download the install script for your operating system
  • Copy the script file into your document folder
  • Open the terminal (Linux: Strg+Alt+t ; Mac: cmd + space-bar) and execute the install script through entering the following command into the terminal
    • Linux: sh install_linux.sh
    • Mac: sh install_mac.sh

Install scripts are only available for Linux and Mac users at the moment. Windows users have to install the software tools manually. An instruction for manual installation can be found on the same page. As mentioned above, additional software is necessary to get PanDocElectron run. It might be the case, that some of the additional software tools are installed yet. Please check the version of the installed software tools. If necessary, update the versions according to the install manual.

Installation of Audio recording Software

It is recommend to use the audio editor and recorder software Audacity. Audacity supports Linux, Windows and OS X and can be downloaded for free.

• Go to the download page http://www.audacityteam.org/download/ and download the version for your operating system and follow the installation instructions.

Optionally: Installation of software for manipulating video and audio data

In the following tutorial a framework is described how to create a video from your HTML presentation. However, using a video instead of a HTML presentation has some disadvantages: more space is required, repetition of a single slide is more complicated, than in a HTML presentation. Nevertheless, in some cases it might make more sense to provide a video instead of an HTML presentation.

If you want to create a video you have to install additional audio/ video manipulation software.

LINUX:

• Open the terminal (Ctrl+Alt+t)
• Execute the following commands in the terminal
  • sudo apt-get install ffmpeg
  • sudo apt-get install libavcodec-extra

MAC:

Windows:

FFMPEG is also available for Windows, however, after the installation you have to set some settings. To set this settings you have to change some options, for which experienced knowledge is needed. Therefore, for windows you have to use another tool called Windows Movie Maker.

• Download Windows Movie Maker from the following page: http://www.chip.de/downloads/Windows-Movie-Maker_13007023.html (German version)

Follow the installation instractions. The downloaded installer is a bundle of tools called Windows Essentials. In this bundle Windows Movie Maker is implemented. During the install process you can decide which tools should be installed, only Windows Movie Maker is needed.

Installation of a file archiving software

In this tutorial it is described how to implement the created HTML presentation in an learning management system (LMS) called OLAT. The easiest way to upload the HTML presentation in OLAT is to create a file archive of the generated HTML file and related subfolders. Therefore, a software like winzip is needed.

Windows and Mac

Windows and Mac users can use the free version of winzip. On the winzip homepage there are two versions available, one basic version for free and an extended version for which you have to pay:

• visit the download section of the winzip homepage (http://www.winzip.de/prod_down.htm)
• download the free version for your operating system
• After the download follow the installtion instructions

Linux

For Linux you can use the software tool zip

• Open the terminal (Ctrl + Alt + t)
• Type in the following commands:
  • sudo apt-get update
  • sudo apt-get install zip

From ppt/ pdf to a HTML presentation with PanDocElectron

Creation of a PDF

Microsoft Office users

Microsoft Office users with presentations without animated steps

Please follow these steps, if you use Microsoft Office (PowerPoint) and if your presentation has only static slides

• Load your presentation into Microsoft PowerPoint (File → Open → select your file).
• Export the presentation as a PDF (File → Export → PDF/XPS export).

Microsoft Office users with animated presentations

Please follow these steps, if you use Microsoft Office and if your presentation has also animated slides (e.g. contents appear after pressing a button). By a standard export of a ppt file containing animated slides into PDF, only the „full“ slide without animation steps appears in the exported PDF. To have all steps of the animated slide each in a single slide, you have to use the add-on PPspliT.

• Load your presentation into Microsoft PowerPoint (File → Open → select your file).
• In the Microsoft PowerPoint menu select the tab „PPsplit“.
• Press the Button „Split animations“ (the checkbox „Split on click-triggered animations“ has to be activated).

Split_ppt_presentation

As a result you will get each on click-triggered animation step on a single slide.

• Export the presentation as a PDF (File → Export → PDF/XPS export)

LibreOffice / OpenOffice users

LibreOffice / OpenOffice users with presentations without animated steps

Please follow these steps, if you use LibreOffice or OpenOffice and if your presentation has only static slides

• Load your presentation into LibreOffice / OpenOffice Impress (File → Open → select your file).
• Export it as a PDF: (File → Export as PDF ….), press the „Export“ Button and select a folder in which you want to save your PDF

LibreOffice / OpenOffice users with animated presentations

Please follow these steps, if you use LibreOffice or OpenOffice and if your presentation has also animated slides (e.g. contents appear after pressing a button). By a standard export of a odp file containing animated slides into PDF, only the „full“ slide without animation steps appears in the exported PDF. To have all steps of the animated slide each in a single slide, you have to use a add-on.

• Load your presentation into LibreOffice / OpenOffice Impress (File → Open → select your file).
• In the bar menu select Tools → Add ons → Expand animations

Split_odp_presentation

After executing this command you will find 2 new documents in the folder, in which the original presentation is stored, a PDF and a odp file, both with the filename supplement „expanded“. Both contain slides with each on click-triggered animation step on a single slide.

Conversion from PDF into a html presentation

For this step we will use mainly the software tool PanDocElectron. Other software tools installed during the installation process work in the background and don‘t have to be used actively.

Start PanDocElectron

Linux and Mac:

• Open the terminal (Linux: Ctrl+Alt+t , Mac: cmd + space-bar )
• Change to the folder in which you have installed PanDocElectron (e.g. ~/Documents/PanDocElectron )
• In the terminal execute the following command:
  • npm start

Windows:

• Open the prompt: Windows 10: Windows + X, in the menu you can find the prompt (Eingabeaufforderung), execute it
• Change to the PanDocElectron folder: e.g. cd User/Documents/PanDocElectron
• Execute the following command in the prompt shell:
  • npm start

Create a new project

After PanDocElectron has started, first create a new project.

• Select „New“ in the menu bar

Create a new project in PanDocElectron

Choose a name for the project and a input format. In this tutorial we want to convert a PDF into a HTML audioslide presentation.

• Input the project name
• Select „PDF Input for AudioSlides Output“.

The project name determines the name of the folder in which the HTML file will be saved in. All output files are saved in this sub folder, in which PanDoc was installed.

• Press the „Create Project“ button.

Project settings in PanDocElectron

Creating a new project means that a folder in your PanDoc folder is created, named with the project name. This folder contains 4 subfolders. In the subfolder images the single slide images of your PDF presentation are saved after the conversion. In the subfolder audio you have to copy the recorded audio files, as described in one of the following sections.

Conversion from PDF to a HTML presentation

• Open your file manager and copy the PDF file you want to convert into the PanDoc project folder.
• Switch back to PanDocElectron and press the „Convert“ button in the menu bar.
• Select the input file you want to convert (PDF)

PanDocElectron select a input file

It is important, that all file names (also the input files) don't contain special characters or empty spaces. If your input file name contains special characters or empty spaces please rename it. In PanDocElectron, there are different parameters and settings, which are only important if the input and output format are different to PDF or Wiki. Important parameters are „AudioSlide Count“, „PDF Startpage“ and the checkbox „show Audio player“. The parameter „AudioSlide Count“ determines, how many slides should be converted into a image file. Which value has to be entered into the field „PDF Startpage“ is dependent on the software you have used to create your PDF. Some software tools index the first page in a PDF as slide 0, some as slide 1. You have to try out if your first slide is indexed with 0 or 1. First try it with 0. Check the images in your project folder (in this example you can find the slide images in the folder /home/joerg/Documents/PanDocElectron/Ecotox1/images). With the checkbox „show Audio player“ you can select if the audio player is displayed in the HTML presentation or not. Displaying the player has the advantage, that the audio stream can be paused, forwarded etc. during watching the HTML presentation.

• Check if input and output format are right (Input format: „PDF Input for Audioslide Output“ , Output format: „Audioslides from PDF“)
• Enter the right values for „AudioSlide Count“, „PDF Startpage“ and the checkbox „show Audio player“
• To convert the PDF, press the blue „Convert“ button. You will receive some messages, e.g. where the converted images are stored, how to name the audio files etc.
  

PanDocElectron settings to convert a file

After the conversion you can find a HTML file in your project folder as well as the slides converted into image files in your „image“ subfolder. So far, you have created a HTML file together with the related images. You can try if the HTML file works, by double clicking on it. It should be opened in your browser. By pressing the arrow keys you can navigate through your presentation without audio streams.

Example of a HTML presentation with audioplayer

Audiorecording

With this software tool the audio files for the slides of the HTML presentation are created. In this tutorial the software tool Audacity is used. After starting Audacity, the following window appears.

Audacity: recording and selection of input device

With Button A you can start your audio record, with button B you can stop it. Before recording, it is necessary to adjust some settings.

Selection of input device

First, the input device (microphone) which should be used, must be selected. The input device can be selected in the drop down menu. Be sure, that the microphone is plugged in before you start Audacity. Otherwise, the microphone will not be displayed in the drop down menu. The project rate should be at 44100 Hz.

Adjusting the input level

Before starting the record, the input level of the selected device must be adjusted. The input level is only displayed during a recording session and must be adjusted in a test record. Press button A to start the record and speak some text with a volume and distance between microphone and mouth, you will use for your final slide record. Adjust the input level to a value, with peaks that are not in the red area. The input level should be also not too low. After adjusting the input level, you can start with recording the slide text.

Recording the slide text and post processing

There are two ways for recording the slide text. You can record the whole text of your presentation in one and cut it into parts according to the slides the text belongs to or you can record the text for each slide separately.

If you record the whole text in one it is important to make breaks with silence between the text of each slide. Audacity has two functions implemented which help to cut the audio files according to each slide. One function helps to detect silences with a predefined length, the 2nd function cuts the audio file according to the detected silence breaks. It is important, that the breaks between the text of each slide are longer than your breathing space or pauses of reflection. In Audacity you can enter a value for the duration of breaks, at which Audacity recognizes a break as a marker for cutting. For example, if you enter a value of 10 seconds, all breaks equal or longer than 10 seconds are marked as a cutting mark. But it is also possible to cut the audio stream manually into single parts. Then it is not necessary to make breaks with a predefined duration between the slides. For post-processing, in each record about 2 seconds with only background noise are needed. If the whole text in one is recorded you can use the breaks between each slide to detect the background noise. Otherwise you can make a short break during speaking the slide text or record the background noise at the start or end of the audio stream and mark or remove it later. The post-processing steps Noise Reduction and Normalization have to be performed for each recording session.

Recording:

• press the record button A and speak the slide text into the microphone.
• to stop the record press button B.
• after recording the whole text safe the project (File → Safe project as).

Noise Reduction:

• in the spectrum window left click with your mouse on the starting point, hold the left button and select the part of the record with only background noise
• execute the noise reduction tool (Effect → Noise Reduction …)
• press the Get Noise profile button. The window will close.
• Select the whole audio stream in the spectrum window
• execute the command Repeat Noise Reduction (Effect → Repeat Noise Reduction)

The small waves in the spectrum window, representing background noise, should disappear.

Normalization:

It may happen, that the level of the input device is too low. That results in a audio stream with a too low volume. Audacity has also a function to normalize the audio level of an existing record.

• Mark the area in the spectrum window, which should be normalized or amplified (for the whole stream click in the spectrum window and press Ctrl + a)
• open the „normalize“ window (Effect → Normalize)
• mark the following preferences with a „x“
  • Remove DC offset
  • Normalize maximum amplitude to -1.0 dB
  • Normalize stereo channels independently
• press the „OK“-Button

In the following image the result of the normalization tool is visualized. Above the original stream below the normalized stream. Note: after the normalization it might be necessary to remove the background noise (that is also amplified by normalization)

Audacity: normalisation

Cutting the audiofiles

Whole text in one file without breaks

After post-processing, cut the audio stream into single parts, according to the slides they belong to. There are two ways to do that.

• note starting and ending time of the parts of the audio stream and the slide number they belong to.

Select the part of the audio file you want to use for a slide. You can select parts of a audio file within the window displaying the spectrum of your record.

Audacity: select a part and cut it

• Left click on the spectrum window on the starting point, hold the left button and select the part of the audio file you want to export.
• The selected part can then be exported (File → Export selected Audio).
• Select a name according to the following convention: „audio“+Slidenumber+“.mp3“,

E.g. your audio file for slide 1 should be named as „audio1.mp3“. Be aware, that the most converted slides start with slide number 0.

• Save the MP3 files in the audio folder of your project (e.g. /home/joerg/Documents/PanDocElectron/Ecotox1/audio) .
• Use the following settings:
  • Quality: 220 – 260 kbps
  • Variable Speed: Standard
• Repeat the described steps (select and export) for each slide.

Sometimes an additional audio codec must be installed ( LAME and FFMpeg). You will receive a message, that they are missing, before you can safe the MP3 files. Follow the download instructions and download the codec and install it. You can find the created HTML file in the project folder (e.g. /home/joerg/Documents/PanDocElectron/Ecotox1/Ecotox1_html_audioslides.html). Open it and try if the presentation works and if the audio files are played at the right slide.

Whole text in one file with breaks between each slide

If you have recorded the whole text in one audio file and additionally made breaks between each slide with a predefined minimum duration, you can also use the following steps to cut the audio file into single parts

• mark the track which you want to split, e.g. click on the gray area marked in the following image

Audacity: mark a track

• execute the command Analyze → Silence finder
• A new window appears to set the following options:
  • „Treat audio below this level as silence [ -dB]“: type in a value smaller than the maximum value displayed in the volume level panel during playing a break period. In the following image a value of about 40 dB is displayed. To be on the secure side, enter a value lower than 40, e.g. 30
  • „Minimum duration of silence [seconds]:“ enter a value smaller than the duration of the breaks between the slides you made during the recording process, but longer than your respiration breaks. For example if you made breaks between each slide of about 3 seconds, then enter a value of about 2. Note: silences are only regarded as breaks if they are longer or equal than the value you entered.
  • „Label placement [seconds before silence ends]:“ enter a value at which your break marks are set during the silence break. If you enter a value of 0.3 then your break label will be set at the position 0.3 seconds before the silence ends. That means, that you have a silence part in your single audio file of about 0.3 seconds before your talk starts.
• Press the okay button. A new track appears with the silence marks found by Audacity.

Audacity: track with silence breaks

After this step it is recommend to check if the break marks mark a real break between two slides. You can also edit the break marks manually, e.g. delete them, move them to a different position by moving the small point in the middle of the brackets or you can also set a break period by moving the brackets themselves. The break period is defined as the period between the brackets (right red box in the picture above). A break period has the advantage, that the whole period will be cut out. If using a break point the parts are only split. Important: the first break mark must be between the parts of the first and the second slide. Otherwise you will get problems with the numbering of the exported audio parts. If there is a break mark before the first slide, please delete it. After the manual inspection and correction of the break marks, the single audio parts have to be exported to get the mp3 files.

• Select the export multiple command (File → Export Multiple)
• Set the following options:
  • Folder: Select a folder in which the single audio files should be exported, e.g.,
  • the audio folder of your PanDoc project
  • Format: if you want to create a html presentation select mp3
  • Options:
    • Bit Rate Mode: Preset
    • Variable Speed: Standard
    • Channel Mode: Joint Stereo
    • Split files based on: Labels, check the mark before „Include audio before first label“
    • Name files: check „Numbering after File name prefix“ and enter „audio“ as File name prefix
• Press the OK button.

Renaming the audio files

The names of the created audio files have to fit some conventions. In Audacity it is not possible to set the file names according to this convention, therefore it is necessary to rename the created audio files.

Linux and Mac

• Open the terminal (Ctrl + Alt + t)
• Change to the directory in which your audiofiles were saved
• Enter the following commands into your shell:
  • for file in audio-0*; do mv "$file" "${file/-0/}"; done
  • for file in audio-*; do mv "$file" "${file/-/}"; done

Windows

• Open the Powershell (Press the windows button and type in „Powershell“)
• Change to the directory in which your audiofiles were saved
• Enter the following commands into your shell:
  • Dir | Rename-Item -NewName { $_.name -replace "-0","" }
  • Dir | Rename-Item -NewName { $_.name -replace "-","" }

Recording each audio file separately

It is also possible to record each slide separately. Cutting is not necessary or only parts not wanted in the HTML presentation. Record them as described in the last section

• For each slide a new session must be started (File → New).
• The files can be directly exported without selection of parts (File → Export Audio).

However, the postprocessing steps have to be performed for each slide.

• Select a name according to the following convention: „audio“+Slidenumber+“.mp3“,

E.g. your audiostream for slide 1 should be named as „audio1.mp3“. Be aware, that the most converted slides start with slide number 0.

• Save the MP3 files in the audio folder of your project (e.g. /home/joerg/Documents/PanDocElectron/Ecotox1/audio) .
• Use the following settings:
  • Quality: 220 – 260 kbps
  • Variable Speed: Standard
• Repeat the described steps (record and export) for each slide.

Sometimes an additional audio codec must be installed ( LAME and FFMpeg). You will receive a message, that they are missing, before you can safe the MP3 files. Follow the download instructions and download the codec and install it. You can find the created HTML file in the project folder (e.g. /home/joerg/Documents/PanDocElectron/Ecotox1/Ecotox1_html_audioslides.html). Open it and try if the presentation works and if the audio files are played at the right slide.

Implementation of the html presentation in OLAT

To implement the html presentation in a OLAT course, it is necessary that you have author rights and that you have created your OLAT course.

ZIP your project files

To make the implementation process easier, please compress the whole PanDocElectron project data with its sub folders in one zip file. Normally, a compressing tool should be natively installed on your system. If not, you have to install a compressing tool.

Create a zip archive

In the most cases the compressing tool is integrated in your file manager.

• Open your file manager, e.g. windows explorer, thunar etc.
• change to your PanDoc project folder (Documents/PanDoc/projectname).
• Mark all files and folders in the PanDoc project folder. E.g. if you have named your project Ecotox1, then change to ~/Documents/PanDoc and right click on your PanDoc project folder, here Ecotox1
• right click on the marked files and folders
• select „Create archive“, „Compress“ or something similar and select zip format

After these steps you should find a file with the file extension .zip

Implement the HTML presentation in your OLAT course

Log in into OLAT and select the course in which you want to implement the HTML presentation. First, a course element called single page has to be added to the course.

• Start the course editor (only possible if you have author rights): on the upper left side select Tools → Course editor

Olat: activate the course editor

After activating the course editor mode, two more buttons should appear which are named „Insert course elements“ and „Modify course element“.

OLAT: insert a course element

• Press the Insert course elements button
• Select the Single page element

In the menu bar on the left side a new button appears called „Single page“, in the main frame of OLAT you have different tabs like „Title and description“, „Visibility“, „Access“, „Page content“ and „Layout“. Choose the settings you want to use for this course element. In the next step the zip file will be uploaded into OLAT.

• Select the tab „Page content“
• Press the „Select page“ button and choose „Upload File“, a new window appears
• In the „file“ section browse to the created zip file and select it
• After the file was selected press the „Upload“ button

OLAT: select a HTML file

The zip file is now uploaded into the internal OLAT storage folder and decompressed automatically. A new window called „Select HTML file“ appears.

• Browse through the folder and select the file PROJECTNAME_audioslides.html
• Press the "Select" button

After pressing the select button you are delivered back to the single page settings page. To use the HTML presentation single page you have to publish it.

Optionally: from a HTML presentation to a video

In some cases it might be more appropriate to use a video instead of a HTML presentation. One advantage might be, that you don‘t have to switch between the single slides and that you can watch the video without breaks. Disadvantages of a video are, that the size of the video is larger than that of a HTML presentation and that it‘s not as easy as with a HTML presentation to repeat full slides.

Conversion from a HTML presentation to a video

Linux and Mac

With Linux and Mac it is really easy to convert your HTML presentation in a video. With the tool FFMPEG you can use the terminal or command line

• Create a new folder e.g. „audioandvideo“
• Copy the created audio files (audio folder of your project, e.g. audio1.mp3) and the created images (image folder of your project, e.g. img1.png) into the created „audioandvideo“ folder
• note the highest number of the ending of your audio and video files, e.g. if the last audio file is named audio18.mp3, then note 18
• Open the terminal (Linux: Ctrl + Alt + t, Mac: cmd + space-bar)
• change to your „audioandvideo“ folder
• copy the following commands and execute them in the terminal:
  • for i in `seq 0 HIGHESTNUMBER`; do ffmpeg -loop 1 -i img$i.png -i audio$i.mp3 -c:v libx264 -c:a copy -shortest $i.mp4; done

and replace HIGHESTNUMBER with the value you have noted

After this command you have for every slide a single video with audio. To get a complete video with all slides, you have to merge the single slides videos through the following commands. Copy the commands and paste them into your terminal:

• var = $(ls *.mp4 | sort -n)
• for f in $var; do echo "file '$f'" >> mylist.txt; done
• ffmpeg -f concat -safe 0 -i mylist.txt -c copy OUTPUT.mp4

Now you should find a file named OUTPUT.mp4 in your folder. In this file all single videos of each slide are merged into one.

Windows

For windows you need additional software like the Windows Movie Maker. The Windows Movie Maker is not a command line tool, therefore more manual interaction is needed.

• Start the Windows Movie Maker
• Change to the tab „Startseite“ and select „Videos und Fotos hinzufügen“

Movie Maker: add image files

• Browse to the images folder of your PanDoc project
• Select all the images in the image folder (hold the Shift button) and press the „Öffnen“ button

Now all images should appear in the editing window in the right order, the first image with img0.png, the second with img1.png , ….. . Please check, if it is the right order. All images have at the moment a duration of 7 seconds, that means in the resulting movie each image is displayed for 7 seconds. However, the duration of each image has to be adjusted to the length of the audio files related to each image.

Movie Maker: add audio files

• Change to the tab „Startseite“ and select „Musik hinzufügen"
• Browse to the audio folder of your PanDoc project
• Select all the audio files in your audio folder (hold the Shift button) and press the „Öffnen“ button

Now, you have a image track as well as a audio track in your editing window. However, the duration of the images and the related audio streams do not fit together. The audio files have the right length, you have to adjust the duration of the images according to the duration of the audio files.

Movie Maker: audio and video track

After the import of the images and the audio files two new tabs appear in the toolbar. With a mouse overlay over a image or over an audio track the name of the image is displayed as well as the duration. Now, the duration of each image has to be adjusted to the duration of the audio files.

• In the Movie Maker editing window click on the image for which you want to adjust the duration. In the toolbar the duration of the image is displayed (originally 7 sec)
• Change to „Musiktools“, the duration of the related audio file is displayed in the field „Endpunkt“
• Copy the value displayed in the field „Endpunkt“
• Change to the tab „Videotools“
• Enter the value copied from the field „Endpunkt“ into the field „Dauer“ in the „Videotools“ field
• Repeat this step for each image / audio file
• Please check if the duration of the images fit to the duration of the audio files.
• Export the created video with a appropriate resolution (Datei → Film speichern → Youtube)and select a name for your video file and the folder in which your video file should be saved

After the export you can find a video file in the folder you have selected.

Implement the video file in your OLAT course

There are different ways how to implement a video file in OLAT. In this tutorial the video will be implemented as a podcast element in your OLAT course. Log in into OLAT and select the course in which you want to implement the video file. First, a course element called "Podcast" has to be added to the course.

• Start the course editor (only possible if you have author rights): on the upper left side select Tools → Course editor

Olat: activate the course editor

After activating the course editor mode, two more buttons should appear which are named „Insert course elements“ and „Modify course element“.

OLAT: insert a course element

• Press the Insert course elements button
• Select the Podcast element

In the menu bar on the left side a new button appears called „Podcast“, in the main frame of OLAT you have different tabs like „Title and description“, „Visibility“, „Access“, „Podcast learning content“ and. Choose the settings you want to use for this course element. The following steps are for the case if the video you want to use in your OLAT course was never used before in OLAT.

• Change to the tab Podcast learning content
• Press the button Select, create or import a podcast
• In the following window press the button Create

OLAT: create a new podcast

• Enter a name of your learning ressource in the field "Title of learning resource", e.g. "Videos Course Resource Economics"
• Press the "Create" button

You are delivered back to the "Podcast learning content" tab

• Press the "Edit" button

Now you are delivered to a window, in which you can upload the episodes of your podcast. A episode is a single video of your lecture, e.g. the video for lecture 1

• Press the "Create your own episode" button
• Enter a title of your episode, e.g. "Lecture 1"
• Click in the field "Audio or video file" and browse to the video file you want to upload

It is not necessary to enter a value in the fields "Width" and "Height", the values are entered automatically after the file upload

• Press the "Publish" button

Now, your video is implemented in the podcast course element. If you want to add more episodes (videos) to your podcast press the "Add episode" button.

OLAT: add episode to podcast

See Also

• PanDocElectron/Wiki2Reveal for on-the-fly generation of RevealJS presentation from the Wikiversity.