Entwicklung eines Standardkonzepts zur Erstellung interaktiver Tutorials für die Viamedici Software GmbH

Diplomarbeit von Martin Uhrig

Einleitung:

Die Diplomarbeit „Entwicklung eines Standardkonzepts zur Erstellung interaktiver Tutorials für die Viamedici Software GmbH“ befasst sich mit der Idee, zusätzlich zu einer bestehenden Online-Hilfe und angebotenen Anwenderschulungen, kostengünstig interaktive Tutorials anzubieten. Unter Wiederverwendung bestehender Inhalte aus dem Redaktionssystem wurde mit den Autorenwerkzeugen Adobe Captivate und Adobe Flash eine standardisierte Lösung entwickelt.

Auf Basis von Ist- und Soll-Analysen, mediendidaktischen Untersuchungen (Zielgruppe, Lernziele und -inhalte, didaktische Struktur, Lernorganisation) und bewährten Normen, entstand ein grundlegendes Anwendungskonzept. Dieses Konzept wurde im zweiten Teil der Arbeit praktisch umgesetzt. Für die Erstellung der interaktiven Filme wurde eine Adobe-Captivate-Vorlage entwickelt, auf deren Basis mehrere Videos gedreht wurden. Anschließend wurde mit Hilfe von ActionScript 3 in Adobe Flash eine intelligente Schnittstelle programmiert, die dynamisch den XML-Export des Content-Management-Systems einliest und zusammen mit den interaktiven Filmen präsentiert.

Viamedici ist der Hersteller des Cross-Media-Publishing-Systems „Viamedici EPIM – Enterprise Product Information Management“, das durch eine Online-Hilfe dokumentiert ist. Neben der Entwicklung des Systems bietet die Firma die Unterstützung bei der Systemeinführung sowie kundenspezifische Schulungen an.

Als junges und innovatives Unternehmen möchte Viamedici seinen Kunden, zusätzlich zur bestehenden Dokumentation, interaktive Tutorials anbieten, welche die Lösung bestimmter Anwendungsfälle vorführen. Neben der steigenden Kundenzufriedenheit verspricht sich die Firma dadurch einen Image-Gewinn sowie die Entlastung der Kundenbetreuung.

Ziel dieser Arbeit ist es, ein Konzept zu entwickeln, das es ermöglicht, interaktive Tutorials in standardisierter Form zu erstellen. Eine kostengünstige sowie rasche Erstellung der Tutorials, in konsistenter Qualität, steht hier im Vordergrund. Die Textinhalte der Tutorials sollen zentral im Redaktionssystem Author-it verwaltet und bestehende Daten wieder verwendet werden. Für die Entwicklung der Tutorial-Oberfläche sind die Werkzeuge Adobe Captivate und Flash vorgegeben; Mit Adobe Captivate sollen die Filme gedreht und in Adobe Flash mit den passenden Texten zusammengeführt werden.

Weiterhin gilt es, den Aspekt der Lokalisierung zu beleuchten und ein Bereitstellungskonzept vorzubereiten. Das Projektziel umfasst auch eine Anleitung zum Konzept sowie ein ausgearbeitetes Tutorial. Für dieses Tutorial wird ein Thema vom Leiter der Entwicklung, Michael Bauer, vorgegeben.

Durch die Wiederverwendung der vorhandenen Dokumentation sowie aus ökonomischen Gründen, können Überlegungen zur Didaktik nicht im Mittelpunkt stehen. Auch soll diese Lösung keineswegs eine Schulung ersetzen, sondern nur Bedienungsweisen vorführen, nicht aber Tests oder Elemente zur Lernerfolgskontrolle oder zum Lernmanagement enthalten.

Der überwiegende Teil dieser Arbeit sowie die Anleitung zur Tutorial-Erstellung, als Ergänzung des Redaktionsleitfadens, haben als Zielgruppe die zukünftigen Tutorial-Entwickler (Technische Redakteure, Projektleiter, Schulungsleiter). Grundbegriffe im XML-Bereich können hier vorausgesetzt werden. Die Kapitel zur Entwicklung und Erweiterung der Flash-Oberfläche richten sich dagegen an Entwickler, die neben den XML-Grundkenntnissen, Basiswissen in den Bereichen XPath, objektorientierte Programmierung und Flash mitbringen.

Inhaltsverzeichnis:

1.	Abstract	1
2.	Einleitung	3
2.1	Aufgabenstellung	3
2.2	Zielsetzung	3
2.3	Aufbau dieser Arbeit	4
2.4	Begriffsabgrenzungen	4
3.	Anforderungsanalyse	6
3.1	Einführung	6
3.2	Ist-Zustand	6
3.3	Soll-Zustand	8
4.	Konzeption	11
4.1	Einführung	11
4.2	Didaktik	11
4.2.1	Didaktische Ansätze	11
4.2.1.1	Übersicht	11
4.2.1.2	Lerntheorien	11
4.2.1.3	Behaviorismus	12
4.2.1.4	Kognitivismus	13
4.2.1.5	Konstruktivismus	13
4.2.1.6	Fazit	14
4.2.2	Gestaltungsorientierte Mediendidaktik	14
4.2.2.1	Übersicht	14
4.2.2.2	Didaktisches Feld	14
4.3	Mediendidaktisches Konzept	15
4.3.1	Zielgruppe	15
4.3.2	Lerninhalte und Lernziele	16
4.3.2.1	Hauptarten von Lernzielen	16
4.3.2.2	Inhalte und Ziele der Tutorials	17
4.3.3	Didaktische Struktur	17
4.3.3.1	Lernwege vs. Interaktionsraum	17
4.3.3.2	Wahl der Struktur für die Tutorials	18
4.3.3.3	Gestaltung sequentieller Lernwege	18
4.3.3.4	Sequenzierung der Tutorials	19
4.3.4	Interaktivität	20
4.3.4.1	Übersicht	20
4.3.4.2	Makrointeraktivität im Detail	21
4.3.4.3	Makrointeraktivität in den Tutorials	21
4.3.4.4	Mikrointeraktivität im Detail	21
4.3.4.5	Mikrointeraktivität in den Tutorials	23
4.3.4.6	Vorteile durch Interaktivität	23
4.3.5	Lernorganisation	23
4.3.5.1	Übersicht	23
4.3.5.2	CBT vs. WBT	24
4.3.5.3	Bereitstellungsform für die Tutorials	25
4.3.6	Übertragungsverfahren	27
4.3.6.1	Normaler Download	27
4.3.6.2	Progressive Download	27
4.3.6.3	Streaming	28
4.3.6.4	Gegenüberstellung der Verfahren	29
4.3.6.5	Fazit für die Tutorials	29
4.4	Software-Ergonomie	30
4.4.1	Übersicht	30
4.4.2	Normen zur Software-Ergonomie	30
4.4.3	Anwendung der Normen	34
4.5	Oberflächenkonzept	36
4.5.1	Übersicht	36
4.5.2	Gestaltung des Interaktionsraums und der Lernpakete	37
4.5.2.1	Anforderungen an den Interaktionsraum	37
4.5.2.2	Aufbau und Form der Lernpakete	38
4.5.3	Raumaufteilung der Oberfläche	38
4.5.3.1	Übersicht	38
4.5.3.2	Elemente der Tutorial-Hauptseiten	39
4.5.3.3	Anordnung der Elemente in den interaktiven Tutorials	39
4.5.4	Split-Attention-Effekt	41
4.5.4.1	Problematik	41
4.5.4.2	Strategie für die Tutorials	41
4.5.5	Gestaltung der Texte	41
4.5.5.1	Übersicht	41
4.5.5.2	Textinhalte der Tutorials	42
4.5.5.3	Visuelle Gestaltung von Bildschirmtexten	43
4.5.6	Gestaltung der Videos	44
4.5.6.1	Übersicht	44
4.5.6.2	Videoinhalte der Tutorials zu Viamedici EPIM	44
4.5.6.3	Aufbau der Videos	45
4.5.6.4	Auflösung, Qualität und Länge der Tutorial-Videos	46
4.5.7	Systemmeldungen	47
4.5.8	Farben, Schriften und Logos	48
4.5.8.1	Übersicht	48
4.5.8.2	Viamedici-Styleguide	48
4.5.8.3	Gestaltungsregeln zur Farbgebung	48
4.5.8.4	Farbfestlegungen für die Tutorials	49
4.5.9	Zusätzliche Audioelemente	51
5.	Entwicklung und Implementierung	52
5.1	Einführung	52
5.2	Schnittstellen	52
5.2.1	Übersicht	52
5.2.2	Werkzeuge	52
5.2.2.1	Author-it 4	52
5.2.2.2	Notepad++	53
5.2.2.3	Adobe(r) Captivate(r) 3	53
5.2.2.4	Adobe(r) Flash(r) CS3 Professional	53
5.2.2.5	Web-Browser und Flash-Plugin	54
5.2.3	Technologische Schnittstellenbeschreibung	54
5.2.4	Ordnerstruktur	55
5.3	Entwicklung der Inhalte	56
5.3.1	Aufbereitung der Textinhalte	56
5.3.1.1	Übersicht	56
5.3.1.2	Schnittstellenbeschreibung	56
5.3.1.3	XML-Export	57
5.3.1.4	DITA-Export	59
5.3.1.5	XML-Export vs. DITA-Export	60
5.3.1.6	Fazit	61
5.3.2	Entwicklung der Videoinhalte	61
5.3.2.1	Übersicht	61
5.3.2.2	Aufnahmelogik	61
5.3.2.3	Anzeige- und Interaktionselemente	63
5.3.2.4	Aufzeichnungsmodi	64
5.3.2.5	Captivate-Vorlage	66
5.3.2.6	Standardtextbeschriftungen	68
5.3.2.7	Aufnahme, Vor- und Nachbearbeitung	70
5.3.2.8	Export der Filme	73
5.4	ActionScript	75
5.4.1	Übersicht	75
5.4.2	Actionscript 2	76
5.4.2.1	XML-Klasse	76
5.4.2.2	XPath für AS2	78
5.4.3	Actionscript 3	81
5.4.3.1	Neuerungen	81
5.4.3.2	ECMAScript for XML	81
5.4.4	AS2 vs. AS3	84
5.5	Entwicklung der Oberfläche	85
5.5.1	Übersicht	85
5.5.2	Programmablaufpläne	86
5.5.3	Aufbau der Oberfläche	88
5.5.3.1	Übersicht	88
5.5.3.2	Vorspann	88
5.5.3.3	Hauptseite	90
5.5.4	Zeitleistensteuerung	91
5.5.5	Stylesheets	91
5.5.5.1	Übersicht	91
5.5.5.2	Beispiel eines Stylesheets	92
5.5.5.3	Laden einer CSS-Datei	92
5.5.5.4	Anwenden der Stylesheets	93
5.5.6	Systemmeldungen	93
5.5.6.1	Übersicht	93
5.5.6.2	Erzeugen eines Textfeldes	94
5.5.6.3	Importieren der Systemmeldungen	94
5.5.6.4	Auslesen der Systemmeldungen	94
5.5.7	Videobereich	95
5.5.8	Textinhalte	96
5.5.8.1	Übersicht	96
5.5.8.2	Anwenden von Zeichenformaten	97
5.5.8.3	Verlinken der Prozessschritte	98
5.5.9	Interaktionsmöglichkeiten	99
5.5.9.1	Bildlaufleiste	99
5.5.9.2	Videolinks	100
5.6	Übersetzung und Update	101
5.6.1	Übersicht	101
5.6.2	Textinhalte und Systemmeldungen aus Author-it	101
5.6.3	Textbeschriftungen in Adobe Captivate	102
5.6.4	Tooltips der Wiedergabesteuerung	103
5.6.5	Filme in Adobe Captivate	104
5.6.5.1	Übersicht	104
5.6.5.2	Theoretische Annahmen	104
5.6.5.3	Praxistest	105
5.6.5.4	Vergleich der Formen	106
5.6.5.5	Automatische Wiederaufnahme	107
5.7	Erweiterungen	107
5.7.1	Umgesetzte Erweiterungen	107
5.7.2	Offene Erweiterungen	108
6.	Evaluation	110
6.1	Einführung	110
6.2	Funktions- und Integrationstest	110
6.3	Prozessbeschreibung	111
6.4	Kostenrechnung	113
6.5	Mehrwerte	116
7.	Resümee	117
7.1	Erkenntnisse	117
7.1.1	Entwickeltes Konzept	117
7.1.2	Technologische Grenzen	118
7.2	Ausblick	119
7.2.1	Weiterentwicklungen des Konzepts	119
7.2.2	Zukünftige Technologien	119
	Anhang	129
A.	Zielgruppenanalyse	129
B.	Auszüge der XML-Exporte in Deutsch	130
C.	DITA-Exporte	131
D.	Standardtextbeschriftungen in Deutsch	132
E.	Quellcode der Flash-Oberfläche	137
F.	Stylesheets	143
G.	Standardtextbeschriftungen in Englisch	143
H.	Auszüge der XML-Exporte in Englisch	147
I.	Tooltips	148
J.	Fehlerzustände	149
K.	Auszug aus dem Redaktionsleitfaden	151

Textprobe:

Kapitel 6.5, Mehrwerte:

Nachdem im vorigen Kapitel die Kosten aufgeschlüsselt wurden, werden hier die konkreten Mehrwerte durch die interaktiven Tutorials betrachtet.

Der Einsatz neuer Technologien stärkt das innovative Image von Viamedici und bringt dadurch neue Anreize für seine Kunden.

Neben der Online-Hilfe, die auf rein textuelle Mittel setzt, entlasten die bewegten Bilder der interaktiven Tutorials den Monitor, auf dem nur ungern gelesen wird.

Durch die Bereitstellung über das Internet (siehe Kap. 4.3.5) und die kurzen Erstellungszeiten der Tutorials (siehe Kap. 5.6.5 & 6.4) sind Aktualisierungen schnell realisierbar.

Durch die zukünftige Informationsplattform entsteht ein neuer Kommunikationsweg zwischen dem Unternehmen und seinen Kunden, z.B. kann Viamedici bei Bedarf nun auf die Nutzungshäufigkeit der interaktiven Tutorials reagieren, die bei gedruckten Tutorials nicht in dieser Genauigkeit mitgeteilt würde.

Die Tutorial-Erstellung wirkt sich positiv auf die Qualität der Online-Hilfe aus. Durch den Erstellungsprozess werden die verwendeten Prozesse und Prozeduren der Online-Hilfe automatisch redigiert, getestet und auf deren Formatierungen und Struktur überprüft Ein Usability-Testing könnte sich den Schlagworten Attraktivität, Motivation, Ganzheitlichkeit, Lerneffektivität und Lerneffizienz widmen, die gerne als Argumente für E-Learning-Anwendungen gebraucht werden – allerdings sehr kritisch zu betrachten sind.

Konkret könnte dieser Test die Einarbeitung in Viamedici EPIM über die Online-Hilfe mit dem Weg über die interaktiven Tutorials vergleichen. Die zentrale Frage, die sich dabei stellen würde: Ist der Einsatz eines interaktiven Tutorials lerneffizienter als der der Online- oder Print-Hilfe? Dies wäre vor allem aus wissenschaftlicher Sicht hochinteressant, da es bisher noch kaum Untersuchungen zu diesem Thema gibt.