In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre
Shinwakan Station - Uncanny Valley
Shinwakan Station ist ein Point-and-Click-Spiel, das unsere Wahrnehmung menschenähnlicher Figuren auf die Probe stellt. In einer dystopischen Welt werden nicht-menschliche Wesen echten Menschen immer ähnlicher. An einer Zugstation müssen Spieler*innen herausfinden: Wer ist Mensch, wer Nicht-Mensch?
Wann kippt etwas Vertrautes ins Unheimliche? Dieses Spiel ist in Unity entstanden. Für die Figuren- und Hintergrund- generierung wurden Midjourney und DALL-E benutzt.
©Annika Neumann
©Annika Neumann
©Annika Neumann
©Annika Neumann
©Annika Neumann
Auswertung Google Form:
Die Videoclips die am meisten Unheimlich UND Menschlich sind:
Video 3, Video 4, Video 5 (Video 2 und Video 6 könnte considered werden)
In Order sind das: (V3) Erschrockene Augen während des Redens, (V4) Starren mit erschrockenen Augen, (V5) Viele Augenbewegungen ( (V2) gleiche Augen während des Redens, (V6) Speech „glitch“)
©Annika Neumann
©Annika Neumann
©Annika Neumann
©Annika Neumann
©Annika Neumann
- Sind die Varianten zu repetetive?
- Versteht der/die Nutzer*in die Kurve?
- Ist nur klicken zu langweilig? Sollten sich die Bilder animieren? Sollten sie sprechen?
- Ist der Input nur Maus/Keyboard? Kann dieser auch anders aussehen?
- Soll ich Fotos von echten Menschen machen und bearbeiten oder doch lieber KI-generierte Bilder?
Nach vielen Überlegen und remixen von Ideen, mache ich jetzt ein Wimmelbild-Horror-Esque-Game, bei dem man die nicht-Menschen erkennen muss. Je weiter man spielt, desto skuriler wird es.
©Annika Neumann
Devlog 11-06-25:
Game Assets:
- Wimmelbild 1 und 2 in Photoshop farblich angepasst sodass sie Game-ready sind
- Zwei Moodboard Varianten für das GUI gemacht
- Spritesheets für die animierten sprites
Unity Umsetzung für „Wimmelbildszenen“:
- Klickbare Elemente mit Outline on Hover
- Wenn Sprite geklickt wird dann kommt ein GUI Overlay: „Ist das KEIN Mensch?“ und Buttons: Ja & Nein
- Scroll Wheel zum Zoom und Drag um sich die Szene anzusehen bzw sich die Sprites näher anschauen -> Wenn geklickt wird dann wird rausgezoomt und es gibt ein dunkeleres Overlay um zu highlighten welcher Sprite angeklickt wurde
Unity Umsetzung für „Graf-Darstellung“:
- Nochmal für mich in ein Dokument geschrieben wie die Uncanny Valley Kurve aufgebaut ist und wie ich sie zerlege um diese dann in Unity umzusetzen (mehr Info siehe Dokument)
- Zwei Szenen erstellt: Ranking und Graph Overview
- Drag and Drop für Sprites, Snapping für DropArea und die Variablen den Sprites und Drop-Areas zugeordnet, sodass es von einem GraphManager gelesen werden kann
- Button um zur nächsten Szene zu gelangen
- Zurzeit muss ich hier viel aufdröseln und zerlegen/vereinfachen sodass es funktioniert
Als ich versucht habe die nicht-pixeligen Sprites in Unity zu importieren, habe ich schnell gemerkt dass es einen großen Verlust an der Auflösung gab. Obwohl es im „Scene Window“ OK aussah, sah es im „Game Window“, also wie es dann tatsächlich im Game aussieht, schlecht bzw. sehr pixelig aus. Außerdem hat das Spritesheet des Roboters immer oben einen Streifen, obwohl das Spritesheet mit dem richtigen Format gesliced wurde. Die Manuelle Outline als Spritesheet hat auch nicht wirklich funktioniert, da es schwer war die framen immer gleich zu timen. Also habe ich dieses Assetruntergeladen. Das Asset behebt jetzt mein Problem von fehlenden Outlines, aber bei kleineren Sprites sehen die Outlines nicht perfekt aus. Außerdem bewegen sich die Sprites ein bisschen hin und her wenn man rauszoomed. Wenn man reinzoomed ist es, for whatever reason, kein Problem. For now: Es sind intentional Bugs (die vielleicht bearbeitet werden...vielleicht auch nicht)
©Annika Neumann
Um das UI an die Pixel-Ästhetik anzupassen habe ich eine dritte UI-Variante gemacht, welche sich an das zweite Moodboard anlehnt.
Ich habe für die Visualisierung eines Graphen in Unity ein bisschen rumprobiert, was zu nicht viel geführt hat. Deswegen habe ich mir dieses Asset runtergeladen, was vieles erleichtert hat. Es hat aber ein bisschen gebraucht um das zu verstehen. ABER es hat geklappt.
©Annika Neumann
Devlog 25-06-25
- Neue Form gemacht und evaluiert, womit ich besser einschätzen kann wie andere die humanlikeness% der Figuren einschätzen
- Alle Szenen sind fertig und in Unity integriert
- Officer Oba's Sprite Sheet erweitert (mehrere Emotionen)
- Namenseingabe und das Merken des Namens im Spiel
- Dialogsystem integriert
- „Evaluations“-system integriert aka ist diese Figur richtig oder nicht?
- Ein paar klick-sounds hinzugefügt
- Statemanager im Dialogsystem eingebaut für die verschiedenen Emotionen von Officer Oba
- Alle Spritesheets von den Clickables exportiert und integriert
- Bugfixing von dem Darkoverlay von Foreground-Zeug
- Startbildschirm
- Das UI alles neu gemacht
- Sprite-Klick-Event überarbeitet
- Userflow bei der Evaluation nochmal geändert/ein wenig komplexer gemacht
©Annika Neumann
©Annika Neumann
Alles an UI welches im Spiel zu finden ist habe ich selber gemacht AUßER das Keyboard am Anfang! Das UI ist hier Weiß, da ich die Farbe in Unity anpassen kann. Somit war ich viel flexibler und konnte mehrere Farben ausprobieren.
©Annika Neumann
©Annika Neumann
©Annika Neumann
Um das Zertifikat zu drucken habe ich mir den Atom Printer ausgeliehen. Der Drucker stellt ein eigenes W-Lan zur verfügung, mein Computer hat sich mit dem Wlan des Druckers verbunden um den anzusteuern. Der Drucker läuft als kleiner Webserver unter der Adresse 192.168.4.1, und der Druck-befehl ist eine GET-Request an die URL. Hier wird nur etwas ins ASCII-Feld getan. Es war dafür kein Treiber nötig.
Devlog 09-07-25
- Überarbeitung der UI für das Ranken der Figuren
- Integration einer Prozentzahl -> wie viel % stimmt die User-Kurve mit der von Mori überein?
- Integration von Musik im Loop
- Erstellen einer Box für den Drucker
- Integration des Print-Codes im Game
- Installieren und Konfigurierung des Druckers am Mini-PC
Wie vieles andere auch in diesem Projekt, wurde viel (aber nicht alles!) für das Poster mit KI generiert. Am Anfang habe ich die Komposition aus bestehenden Bildern grob zusammengelegt, Dall.E hat diese dann in einem Blau/Orange Farbschema umgesetzt. Danach habe ich gesagt, dass die KI Officer Oba in Szene setzten soll, und der Rest wurde dann händisch gemacht.
Gallerie Reihenfolge: Fertiges Poster -> 1. Komposition -> 1. Generierung -> 2. Generierung
Ein Projekt von
Annika Neumann
Fachgruppe
KommunikationsdesignArt des Projekts
Keine Angabe
Betreuer_in
Claudia Muth
Zugehöriger Workspace
Designprojekt 2: Experience Learning (KD4)Entstehungszeitraum
Sommersemester 2025