Einblick in die technische Umsetzung: Die Planungs- und Design-Phase

Im ersten Teil der Artikel-Serie Einblick in die technische Umsetzung wurde die Analyse der Zielumgebung beschrieben. Dies beantwortet die Frage: Welche technische Infrastruktur können wir bei der Zielgruppe erwarten? Es stellte sich heraus, dass hauptsächlich moderne Browser unter den Betriebssystemen Windows und Android bei den Erprobungsteilnehmern zum Einsatz kommen. Das versetzt uns in die Lage auf der Client-Seite moderne Web-Technologien wie zum Beispiel WebGL oder  SVG verwenden zu können.

In diesem Blogartikel geht es um die Planungs- und Design-Phase. Ziel war es, aus einer Menge von Anforderungen ein adäquates Anwendungsdesign für das Serious Game zu entwickeln.

Im Kern handelt es sich um eine Client-Server-Architektur. Auf Client-Seite kommt eine JavaScript-WebApp zum Einsatz. Genauer handelt es sich hierbei um eine AngularJS-WebApp. Die größten Vorteile sind, dass im Team vorhandene Kernkompetenzen von HTML und CSS optimal genutzt werden können und die WebApp leicht auf andere Zielplattformen portiert werden kann (z. B. mit Apache Cordova).

Server-seitig handelt es sich um eine Mikroservice-Architekur. Die einzelnen Services basieren auf Spring Boot (Java), werden mit Hilfe von Docker Compose in ihrem Zusammenwirken beschrieben und sind somit einfach zu managen. Von außen sind die Services nur über ein API-Gateway erreichbar. Dieser Ansatz garantiert eine optimale Ausgangslage für zukünftige Einsatzszenarien des Serious Game.