Im Vorfeld meiner Thesis habe ich mit dem JavaScript-Framework Vue.js ein Serious Game entwickelt, das vollständig im Browser läuft. Nach Abschluss der Entwicklung habe ich im Rahmen meiner Thesis eine Studie mit Experiment zur Untersuchung der Akzeptanz von Serious Games durchgeführt. Für das State-Management kam der Pinia Store zum Einsatz, während ich das UI-Design in Figma vorbereitet habe. Die Kartendesigns habe ich mit Stable Diffusion und Photoshop umgesetzt sowie teilweise Assets für die Kartenframes verwendet. Die Animationen habe ich anschließend manuell mit CSS und JavaScript programmiert und das Game State Management über globale Stores gelöst. Die Kommunikation zwischen einzelnen Elementen (Karten, Stapel, Monster und Spieler) im Spiel läuft über Vue Props sowie Stores.
Tech: Vue.js, Pinia Store, Figma, Photoshop, Javascript, CSS, HTML
Kategorie: Serious Game, App, Ui-Design, Single Page Application (SPA)
Für: Bachelor Thesis
Herausforderungen: Fließende Animationen umsetzen, Performance Optimierung (Single Thread), Event Loop, Sprite Animationen mit Javascript, Game Loop, State Management