Die Studierenden lernen die elementare Darstellungsprinzipien, grundlegende Techniken der Programmierung und algorithmisches Denken kennen.
In zwei Kurzprojekten und kleinen Übungen probieren die Studierenden die systematischen Organisation von Zeichenbeziehungen in Fläche, Bewegung und interaktives Verhalten aus. Ziel ist es am Ende des Semesters, Gestaltung als System zu erfahren und eigenständig erste einfache Regelwerke in eine Programmiersprache übersetzen zu können.
Die Aufgabe war es, eine interaktive Murmelbahn zu entwerfen und zu programmieren. Diese sollte von einem Spieler mit nur einer Taste bedienbar sein. Für den Code kombinierten wir Javascript mit HTML und zusätzlich noch eine matter.js und p5.js. library.
Design
Unsere erste Idee war es, eine eher buntere Schneelandschaft zu gestalten. Allerdings haben wir uns dann schlussendlich doch dazu entschieden, die Schneelandschaft wie eine schwarz-weiße Scribblezeichnung aussehen zu lassen, da vor allem diese einfache und minimalistische Darstellungsform bei einer Schneelandschaft gut zur Geltung kommt.
Zudem haben wir einzelne Elemente in einer handschriftlichen Schriftart markiert, um das Design noch skizzenhafter erscheinen zu lassen und Freundlichkeit zu verleihen.
Spielmechanismus
Besonders ist auch der Parallaxeffekt, um dem Spiel eine realistische Dynamik zu verschaffen.
In den verschiedenen Ebenen haben wir Wolken, Berge und Grund unterschiedlich schnell bewegen lassen.
Diese Form probierten wir jedoch zunächst erst auf PowerPoint aus, ob dieser Effekt auch zu unserem Designkonzept passt. Danach haben wir den Code dafür auf dem Programm geschrieben.
Am Anfang war es nicht so einfach, den Code dafür zu schreiben aber wir wollten diesen Effekt ungern wieder verwerfen, da diese Dynamik unsere Bahn neben dem schlichten Design besonders macht.
Endergebnis
Den ganzen Ablauf unserer Bahn könnt ihr auf diesem Video anschauen