Best Practice Guidelines
HTML5-KONFIGURATION
BEST PRACTICE: HTML5-KONFIGURATION
Dieser Leitfaden gibt einen Überblick, welche Themen im Rahmen der Erstellung einer HTML5-Konfiguration zur tt performance suite zu berücksichtigen sind. Dabei liegt der Fokus auf der Nutzung der HTML5-Konfiguration für mobiles Lernen.
White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 1 of 7
Inhalt 1
Ziel ................................................................................................................................... 3
2
Grundlegendes ........................................................................................................... 3 2.1
Erstellung der Inhalte .............................................................................................................. 3
2.2
Veröffentlichung der Inhalte ................................................................................................ 3
2.3
Erstellung einer Client-Konfiguration ............................................................................... 4
2.4
Einsatz von SmartComponents in der Client-Konfiguration .................................... 4
2.5
Navigation ................................................................................................................................... 5
2.6
Auflösung und Seitenverhältnis .......................................................................................... 6
3
Schritt-Templates ...................................................................................................... 6
4
Testfragen .................................................................................................................... 6 4.1
Testfragenelemente................................................................................................................. 6
4.2
Feedback für den Anwender ................................................................................................ 6
4.3
Auswertung zum Quiz ............................................................................................................ 7
4.4
Templates zu Testfragen erstellen ..................................................................................... 7
5
Video .............................................................................................................................. 7
6
Eigene SmartComponents erstellen .................................................................. 7
White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 2 of 7
1
Ziel
Ziel dieses Leitfadens ist es, die Rahmenbedingungen für die Erstellung einer HTML5-Konfiguration zu definieren und Empfehlungen für den Aufbau der Konfiguration zu geben. Die HTML5-Konfiguration dient als Basis für die Erstellung von mobil lauffähigem E-Learning mit der tt performance suite. Selbstverständlich sind die erstellten Lerninhalte auch auf dem PC lauffähig. Daher können Sie die Vorzüge einer HTML5-Konfiguration auch für das Lernen am PC nutzen. Im Folgenden wird jedoch explizit auf das mobile Einsatzszenario eingegangen. Die Erstellung einer HTML5-Konfiguration ist ein kundenindividuelles Projekt. Design und Funktionalität werden speziell auf Ihre Anforderungen hin angepasst. Der Professional Services (PS)Consultant stimmt mit Ihnen die Rahmenbedingungen ab und erstellt eine individuelle ClientKonfiguration. Zumeist schließt dies eine Anpassung oder Erstellung von SmartComponents ein. Neben mobil lauffähigem E-Learning kann auch die mobile Nutzung des Portals der tt performance suite gewünscht sein. Diese Whitepaper beschränkt sich jedoch auf die Erstellung einer HTML5Konfiguration für die E-Learning-Inhaltsproduktion. Das Portalcustomizing für mobile Nutzung kann durch den PS-Consultant vorgenommen werden, ist aber nicht Bestandteil dieses Whitepapers.
2
Grundlegendes
2.1
Erstellung der Inhalte
Für die Erstellung von Inhalten wird vorausgesetzt, dass diese explizit für das Zielszenario konzipiert und erstellt werden. Mobiles Lernen ist ein mögliches Einsatzszenario. In diesem Szenario ist es entscheidend, um welche Zielgeräte es sich handelt. So beeinflusst die Auflösung z. B. von Tablets oder Smartphones die Aufbereitung der Inhalte. Aber auch die Verweildauer am Gerät oder die Art der Aufmerksamkeit rund um die Gerätenutzung erfordern eine passgenaue Inhaltsaufbereitung. Inhalte können mit der tt performance suite in folgenden Kategorien erstellt werden: e-Learning der tt performance suite (HTML5-Export) Zur Verfügung stehen beide Modi einer Lerneinheit: Lern- und Assessmentmodus. Im Assessmentmodus ist nur der Modus freies Blättern möglich. Alle weiteren Modi werden derzeit nicht unterstützt. Beachten Sie hierzu auch den Autorenleitfaden zur Erstellung von HTML5-Inhalten, den Sie hier finden. HTML-Dokumentation der tt performance suite Extern erstellte statische Dokumente, die auf mobilen Endgeräten angezeigt werden können, z. B. PDF-Dateien, … Videos
2.2
Veröffentlichung der Inhalte
Portalszenario Das Portal der tt performance suite kann für mobile Endgeräte genutzt werden. tts empfehlt eine separate Portalkonfiguration für den mobilen Zugriff auf die Inhalte. Das Customizing erfolgt wie oben erwähnt über den PS-Consultant.
White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 3 of 7
WBT Die Veröffentlichung kann als eigenständiges WBT erfolgen. Hierzu erfolgt ggf. eine Anpassung des Verteilers für die Erstellung des WBTs, sodass dieser mobil optimal lauffähig ist (Portaltemplates). Die Bereitstellung für den Endanwender erfolgt über
ein Portal
ein LMS (via Import des Scorm-Pakets).
Stand-alone-Lerneinheit (ein E-Learning) Eine weitere Variante der Veröffentlichung ist eine Stand-alone-Lerneinheit. Der „Einzelexport“ eines TT-Dokuments (E-Learning) kann aus einem LMS oder einem Portal gestartet werden. Beim Import einer Stand-alone-Lerneinheit in ein LMS können Lernstandsdaten über SCORM ausgetauscht werden. Prozesssicht oder themenbasierte Inhalte Prozess- und Themensicht der tt performance suite können ebenfalls exportiert werden. Hierzu erfolgt ggf. eine Anpassung der zugrundeliegenden Portaltemplates, sodass die Seiten mobil optimal lauffähig sind. Die Bereitstellung für den Endanwender erfolgt über
ein Portal
ein LMS.
2.3
Erstellung einer Client-Konfiguration
Die Produktion von E-Learning-Inhalten erfolgt in einer für HTML5-Inhalte optimierten ClientKonfiguration. In dieser Konfiuration werden folgende Einstellungen vorgenommen: WYSIWG-Sicht in der Autorenumgebung: Für die WYSIWG-Sicht in der Autorenumgebung wird der Internet Explorer genutzt. Für einen eingebetteten Internet Explorer muss ein Kompatiblitätsmodus gesetzt werden. Für eine HTML5Konfiguration ist der Kompatibilitätsmodus für IE9 vorgesehen. HTML-Export: Es ist möglich, Dokumente im Standardplayer der tt performance suite (HTML-Player) zu veröffentlichten. Ist dies vorgesehen, wird empfohlen, den Modus für den HTML-Player auf den 2014-Modus zu setzen. Abhängig von der Zielgruppe kann für den Internet Explorer auch der IE9-Modus gesetzt werden. Dies führt aber dazu, dass von den SmartComponents nur die vom IE9-Kompatibilitätsmodus unterstützten HTML5- und CSS3-Funktionalitäten genutzt werden können. HTML5-Export: Im HTML5-Player müssen keine Einstellungen vorgenommen werden.
2.4
Einsatz von SmartComponents in der Client-Konfiguration
Der Einsatz von Smartcomponents bereichert die Funktionsbreite des E-Learning und erschließt neue und kreative Möglichkeiten auf Basis moderner Technologien. SmartComponents vereinen Design und passgenaue Funktionalität für eine effiziente Produktion von Inhalten, die eine OneWhite Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 4 of 7
fits-all-Lösung nicht liefern kann. Mit der SmartComponent-API hat die tt performance suite eine Schnittstelle, mit der Sie ihre kundenindividuellen Anforderungen umsetzen können. Falls Sie die Erstellung von SmartComponents nicht selbst vornehmen möchten, können diese über Ihren PSCosultant oder das tts E-Learning-Team erstellt werden. Für die Erstellung einer HTML5-Konfiguration ist ein Einatz von SmartComponents nicht zwingend notwendig. Im HTML5-Player werden jedoch einzelne Funktionsbereiche über SmartComponents abgedeckt, wie z. B. die Erstellung von Testfragen oder interaktiven Schaltflächen für eine Lernprogrammsteuerung. Beim Einsatz von SmartComponents müssen die Komponenten sowohl für den HTML-, als auch für den HTML5-Player entwicklelt werden. Die Repräsentanz im HTML-Player ist notwendig, damit in der Autorenumgebenung die Komponenten angezeigt und bearbeitet werden können. Beim Export und Import von vorgefertigten SmartComponents ist am roten Icon zu erkennen, dass die jeweilige Komponente auch im HTML5-Player vorliegt.
Individuelle SmartComponents unterliegen nicht dem Wartungsvertrag der tt performance suite. Ausgenommen sind die Komponenten aus der tts SmartComponent Library. (Siehe Produktbeschreibung tts SmartComponent Library) Weitere Informationen zu SmartComponents finden sie hier. Eine Downloadmöglichkeit für die tts SmartComponent Library finden Sie hier.
2.5
Navigation
Empfohlen wird die Standardnavigation des HTML5-Players. Diese Navigation sieht vor, dass man von einer Seite zur nächsten wechselt über:
Wischen
die Tasten “Pfeil nach links” oder “Pfeil nach rechts”.
Zusätzlich können zum Blättern die Weiter- und Zurück-Komponenten der tts SmartComponent Library genutzt werden. Es empfiehlt sich, diese Komponenten in den Schritt-Templates der HTML5Konfiguration zu hinterlegen. Es ist auch möglich die Weiter und Zurück-Funktionen über die Steuerungstrigger der tt performance suite umzusetzen. Weitere Informationen hierzu erhalten Sie von Ihrem PS-Consultant bzw. über das Whitepaper „Autorenguideline für die Erstellung von HTML5-Inhalten“. Elemente wie Sitemap, Glossar oder Hilfe sind bislang nicht vorhanden. White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 5 of 7
Die Lernprogrammsteuerung des HTML-Players sollte in der Dokumentvorlage, im Dokument oder in den Templates für jeweils die entsprechende Seite ausgeblendet werden.
2.6
Auflösung und Seitenverhältnis
Es hat sich bewährt, sowohl das Design des Portals als auch der Lerneinheit an das Seitenverhältnis 4:3 und an die Auflösung 1024x768 anzupassen. Dies Vorgagbe hängt jedoch von den moblilen Endgeräten der Zielgruppe ab und kann dementsprechend auch anders ausfallen. Denn üblicherweise weisen Smartphones ein Seitenverhältnis von 16:9 auf, während Tablets eher das Verhältnis 4:3 haben.
3
Schritt-Templates
Der Aufbau von Schritt-Templates kann wie gewohnt erfolgen. Dabei sollten die Hinweise aus dem Whitepaper „Autorenguideline für die Erstellung von HTML5-Inhalten“ berücksichtigt werden.
4
Testfragen
4.1
Testfragenelemente
Für die Erstellung der Testfragen für den HTML5-Export können ausschließlich SmartComponents genutzt werden, da im HTML5-Player diese Funktionalität über SmartComponents realisiert wurde. Verfügbare Komponenten über die tts SmartComponent Library sind: Single Choice / Multiple Choice Drag&Drop Zusätzlich benötigt man eine Auswertenschaltfläche, die Bestandteil der tts SmartComponent Library ist. Diese ermöglicht es dem Lerner, die Quizfrage auszuwerten.
4.2
Feedback für den Anwender
Es ist möglich, dem Anwender während der Bearbeitung der Frage ein Feedback zu geben. Folgende Komponenten können genutzt werden: Der E-Learning-Kontext kann über die SmartComponent Qualifiziertes Feedback nachgebildet werden. Über diese Komponente können individuelle Feedbacks (Text und Grafik) gegeben werden. Text kann in der Komponente hinterlegt werden. Grafik oder andere Elemente können als Kindelemente zugeordnet werden. Die SmartComponent Kommentar zeigt den Kommentartext der Testfragenseite an. Der Kommentartext und alle zugehörigen Anweisungstexte zu einer Testfrage können nicht in der Komponente editiert werden. Sie werden von der Quizseite bereitgestellt und können über die Funktion Feedbacks bearbeiten im Dokumenteditor angepasst werden. Die Arbeitsanweisung für den Kommentar muss ggf. individuell für die verschiedenen Testfragen angepasst werden, da der Standard-Autotext sprachlich nicht für alle Fragetypen passt. Hierzu genügt eine Zuordnung der entsprechenden Autotexte im jeweiligen SchrittTemplate. Die SmartComponent Feedback zeigt die globalen Feedbacks zur Testfrage an. Diese Texte können ebenfalls nicht in der Komponente editiert werden. Sie werden von der Quizseite bereitgestellt und können über die Funktion Feedbacks bearbeiten angepasst werden. White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 6 of 7
Auch hier muss das Feedback ggf. angepasst werden, da der Standard-Autotext sprachlich nicht für alle Fragetypen passt.
4.3
Auswertung zum Quiz
Es existieren zwei Komponenten: Tabellarische Auswertung aller Quizfragen Die tabellarische Auswertung kann als abschließende Auswertung zu einem Quiz genutzt werden oder alternativ auch als Zwischenauswertung. Letztere zeigt dann jeweils nur die Ergebnisse des bereits bearbeiteten Teils der Testfragen an (siehe Hilfe in der Komponente). Gesamtergebnis Angezeigt wird das Gesamtergebnis zu allen bisher bearbeiteten Testfragen in Form eines Fortschrittsbalkens.
4.4
Templates zu Testfragen erstellen
Zu beachten ist, dass die Autorenberechtigung auch für die Einstellungen in den SmartComponents gesetzt werden kann. Stand heute werden nur die technischen Namen der Einstellungen in den Berechtigungen angezeigt.
5
Video
Die Integration von Videos in ein E-Learning erfolgt über die SmartComponent Video. Diese Komponente ist Bestandteil der tts SmartComponent Library.
6
Eigene SmartComponents erstellen
Im Rahmen der Erstellung einer HTML5-Konfiguration können kundenindividuelle SmartComponents erstellt werden. Diese werden über Schnittstellen in die Software integriert und können releaseunabhängig entwickelt werden. Die Dokumentation zur SmartComponent API finden Sie hier. Weitere Informationen zu SmartComponents finden sie hier.
Impressum Copyright © tts Knowledge Products GmbH. Alle Rechte vorbehalten. 30. Mai 2016 – Version 1.00
White Paper - tt knowledge force - Best Practice HTML5-Konfiguration
Page 7 of 7
