ELA: Twine-Textadventure mit HTML5-Video

ELA ist ein interaktives Textadventure, welches Audio- und Videoelemente miteinbezieht. ELA wurde mit dem Storytelling-Tool Twine2 erstellt, welches kostenfrei verfügbar ist. Stories können in Twine sowohl online im Browser als auch mit einem Desktop-Programm erstellt werden. Twine ist Open Source-Software. Die Story steht unter einer Creative Commons Lizenz.

Die Story von ELA spielt in einem fiktiven Szenario in naher Zukunft, in welchem sogenannte ALGOs die Verwaltung von Städten übernehmen. ALGOs sind die Fortentwicklung von „Künstliche Intelligenz“ und „Big Data“-Projekten, die nun mit der Quantencomputer-Technologie nahezu vollständig realisierbar sind. ALGOs sind Personen, die sich frei in Städten bewegen können. In den ALGOs ist ein menschliches Bewusstsein verankert, welches Entscheidungen selbstständig moralisch und ethisch bewerten kann. Als einer der ALGOs Fehlfunktionen aufweist und dadurch Chaos in der Stadt ausbricht, muss der*die Spieler*in als ALGO-Supervisor das Problem untersuchen und entscheiden, ob die Einheit wieder eingesetzt werden kann.

ELA (beta) spielen

ELA kann heruntergeladen und lokal im Mozilla Firefox Browser gespielt werden. Der Chrome-Browser sowie weitere Browser werden noch nicht vollständig unterstützt.

  1. Download des zip-Archivs: 480p-Version (188 MB) | 720p-Version (410 MB)
  2. Zip-Archiv in einen eigenen Ordner entpacken
  3. Entpackten Ordner öffnen
  4. Datei „ELA.html“ mit dem Befehl „Öffnen mit“ im Browser Mozilla Firefox öffnen und spielen
  5. Sound einschalten für Audioeffekte

Experimentelle Online-Version: PLAY
(Nur bei schneller Internetverbindung empfehlenswert. Falls die Videos haken oder nicht funktionieren, bitte die Download-Version spielen.)

Hintergrund und Making of

Mit dieser kurzen und experimentellen Story habe ich versucht zu ergründen, welche audiovisuellen Möglichkeiten mit dem Textadventure-Tool Twine jetzt schon möglich und umsetzbar sind. Das Medienprodukt wurde im Seminar „Medien und Kultur“ von Prof. Dr. Friederike Siller im Studiengang Pädagogik und Management in der Sozialen Arbeit an der Technischen Hochschule Köln verwirklicht.

Twine storymap der Geschichte ELA mit den vielen einzelnen Feldern
Die Story-Ansicht in Twine mit den einzelnen Knotenpunkten der Geschichte

Macros für Sugarcube 2

Für die Einbindung der Video- und Audiodateien habe ich eigene Macros für das Storyformat Sugarcube 2 erstellt, die auf eine reine Einbindung via HTML5 setzen. Javascript wird genutzt, um die Startposition von Videos zu verändern. Praktischerweise verfügt das Storyformat über die Möglichkeit, jquery zu benutzen. Der Quelltext für das Macro findet sich hier:

Weiterhin habe ich für die Stimmausgabe die Javascript-Bibliothek mespeakJS sowie das Plugin typedJS eingebunden:

Die Macros können über den Befehl „Edit Javascript“ im Storymenü eingebunden werden im Twine-Programm.

Lizenz


Dieses interaktive Werk ist lizenziert unter einer Creative Commons Namensnennung – Nicht-kommerziell – Weitergabe unter gleichen Bedingungen 4.0 International (CC BY-NC-SA 4.0).

Verwendete Videos

Verwendete Musik

Verwendete Soundeffekte

Herausforderungen

Die Mediendateien wurden in einem separaten Ordner abgelegt. Das Testen der Story ist somit aber nur über das Storymenü und dem Befehl „Publish to file“ möglich, da im Test/Previewmodus bisher keine externen Pfade angegeben werden können bzw. ich keinen Workaround dafür gefunden habe.
Eine weitere Herausforderung stellen die preload-Eigenschaften der Videos dar. Für Twine-Stories ist es schwierig vorauszusehen, welche Videos vorgeladen werden müssen, da der*die Spieler*in mehrere Entscheidungsmöglichkeiten hat. Somit bietet sich nur ein vollständiges Vorabladen aller Videos an, welches ebenfalls eine technische Herausforderung ist. Somit habe ich mich entschieden, ELA erstmal nur als Download anzubieten und für die lokale Nutzung zu optimieren, da somit alle Videos sekundenschnell von der Festplatte geladen werden können.
Danke an die Twine-Community für das Bereitstellen eines so großartigen Tools und danke an alle Personen, die die Creative Commons Inhalte bereitgestellt haben, welche ich genutzt habe. Und vielen Dank an die Entwickler*innen, welche Javascript-Bibliotheken unter freier Lizenz veröffentlichen!

Ich freue mich über Anregungen, Kritik und Verbesserungsvorschläge!
Titelbild des Beitrags: Screenshot aus Dystopia – user generated cinema, Lizenz: CC BY-NC-SA 3.0