In dieser letzten Lektion zeige ich Ihnen, wie Sie unserer Pizzakurs-Website den letzten Schliff verleihen: eine Abspannfunktion. Diese Funktion verbessert das Benutzererlebnis, indem sie das nächste Video im Kurs anzeigt, wenn sich das aktuelle Video seinem Ende nähert, und ermöglicht sogar die automatische Wiedergabe des nächsten Videos. Diese Funktionalität ist Teil der Endbildschirmfunktion des Mave-Players. Ich führe Sie durch die Mave-Dokumentation und zeige Ihnen, wie Sie den Endbildschirm mithilfe eines Steckplatzes im Mave-Player implementieren. Ich erkläre einige der verfügbaren Optionen, z. B. die Anzeige der verbleibenden Zeit, die Anzeige eines Bildes und das automatische Auslösen des nächsten Videos.

Als nächstes implementieren wir dies in unserem Code. Ich zeige Ihnen, wo Sie den Endbildschirm-HTML innerhalb der Player-Komponente hinzufügen. Der von mir vorbereitete HTML-Code enthält Stile, zeigt die verbleibende Zeit an, zeigt ein anklickbares Bild für das nächste Video und bietet eine Option zum Neustarten des aktuellen Videos. Ich erkläre, dass wir benutzerdefiniertes JavaScript hinzufügen müssen, damit dies ordnungsgemäß funktioniert. Dieses Skript verarbeitet das Ereignis, wenn jemand auf das Bild im Endbildschirm klickt, und aktualisiert den Player auf das nächste Video. Wenn das aktuelle Video zu Ende ist, wechselt es automatisch zum nächsten und sorgt so für ein nahtloses Seherlebnis für unseren Kurs.

In dieser Lektion betone ich, wie diese Funktion das allgemeine Benutzererlebnis unserer Kurswebsite verbessert. Es fesselt die Zuschauer, indem es eine Vorschau auf das, was als nächstes kommt, bietet und es ihnen leicht macht, ohne Unterbrechung weiterzuschauen. Diese letzte Ergänzung vervollständigt unsere Pizzakurs-Website und schafft eine voll funktionsfähige und benutzerfreundliche Online-Lernplattform.

Mentor

David van Leeuwen ist Webentwickler mit mehr als 15 Jahren Erfahrung. Im Laufe seiner Karriere hat er in multidisziplinären Teams an Projekten für renommierte Unternehmen wie Sonos, WeTransfer und Red Bull gearbeitet.

David leitet derzeit die Entwicklung von mave und begleitet Sie als Mentor durch diesen Kurs. Er teilt sein Wissen gern und hilft Ihnen beim Einstieg in die Videointegration.