Die Studierenden des dritten Semesters im Masterstudiengang Informationsdesign und Medienmanagement erhielten im Projekt Mobile Dokumentation die Aufgabe, eine Web-Applikation auf Basis der Anwenderdokumentationen des vorangegangenen, zweiten Semesters zu erstellen.

Das Modul gliederte sich in zwei Teile: Mobile Dokumentation und Texte für Online-Medien. Dr. rer. nat. Thomas Meinike vermittelte in einem Teil der Lehrveranstaltungen die technischen Grundlagen zur Umsetzung mit Techniken wie HTML5, CSS und JavaScript-Frameworks. Im zweiten Teil des Moduls lehrte Johannes Dreikorn (Leiter Redaktion, doctima GmbH) unter anderem die Grundlagen des Online-Journalismus sowie die inhaltliche Gestaltung und Struktur von Texten und die Textoptimierung.

Umsetzung der Web-Applikationen

Wie anfangs erwähnt, verwendeten die Studierenden als inhaltliche Grundlage die Anwenderdokumentationen, die für die Leipziger Firma tutory im vorigen Semester erstellt wurden.

Im ersten Schritt der Umsetzung wurden die Inhalte in einem XML-Dokument anhand der DocBook-Vorgaben strukturiert. XML (Extensible Markup Language) ist eine Auszeichnungssprache zur Darstellung strukturierter Daten. DocBook ist ein Dokumentenformat, das in einer für XML vorliegenden Dokumenttypdefinition (DTD) festgelegt ist.

Ausschnitt des XML-Dokuments nach DocBook-Vorgaben

---

Anschließend erstellten die Studierenden auf Grundlage der XML-Datei eine XSL-Transformationsdatei mit Einbindung des JavaScript-Frameworks jQuery Mobile. jQuery Mobile gehört zu den populärsten und am breitesten auf Endgeräten unterstützten Frameworks. XSLT (Extensible Stylesheet Language Transformations) dient der Umwandlung von XML-Strukturen in Ausgabeformate auf der Basis von HTML, XML und Text.

Ausschnitt aus der XSL-Transformationsdatei

---

Mithilfe des XML-Dokumentes und der XSLT-Datei wurde eine dynamische HTML-Datei transformiert. Spezielle Layout-Elemente wurden mit CSS formatiert.

XSL-Transformation, Quelle:www.oxygenxml.com

---

Die ausgegebene HTML-Datei kann auf allen Geräten im Browser angezeigt werden und reagiert responsiv auf die zur Verfügung stehende Größe. Die Inhalte sind somit auch für mobile Endgeräte geeignet. Per Lesezeichen können die Inhalte auch auf dem Home-Screen des mobilen Gerätes verlinkt und direkt aufgerufen werden und funktionieren dank eines Cache Manifests auch offline.

Screenshot der Web-Applikation „Smart Start Guide“ von Undine Gebhard, Saskia Junge und Julia Fuchs

iPad-Screenshot der Web-Applikation „Smart Start Guide“ in der Referenzimplementierung des Dozenten

Lernergebnis

Durch das Projekt Mobile Dokumentation haben die Studierenden die technologischen Grundlagen zur Umsetzung von mobilen Anwendungen kennengelernt. Außerdem können sie nun inhaltliche, strukturelle und gestalterische Besonderheiten von Texten erkennen.