Kurzbeschreibung
Dieses Projekt demonstriert und erklärt die Mechanik eines Kaugummiautomaten anhand von Illustrationen, Texten und Bildern sowie die Geschichte des Automaten anhand von Beispielen. Die Idee besteht darin, Bare Conductive Set zu verwenden, um schnell neue Informationen zu lernen, die auf dem Einsatz mehrerer Sinne und Techniken basieren – Schauen und Bemerken, Berühren der mit Bare Conductive Ink erzeugten Punkte, Lesen und Kaugummi aus dem Automaten nehmen, was die Interaktion mit einem positiven Konnotation beendet. Das gesamte Projekt funktioniert durch Berühren von 4 Punkten, die auf einem realen Modell des Automaten gezeichnet sind. Durch Berühren erhalten Sie verschiedene Frames von Figma-Projekt auf dem iPad, der neben steht, in denen es Beschreibungen, Illustrationen aus Illustrator und Bilder gibt, sodass jeder Punkt diesen Teil des Automaten und der Mechanismus erklärt, auf dem es sich befindet.
Filmische Dokumentation des Projekts
Link: https://youtu.be/RnhThJyDKbA
Bilder/Screenshots
Userflow (Funktion / Interaktion als Flowdiagram)
Links zu Quellcode und Prototypen (Figma)
Figma Prototyp:
Figma File:
Ergebnis Warmup Projekt (Video, Link)
Link: https://youtu.be/V0Ipr28eOb0
Prozess:
Ideen und Objekt Sammlungen (Warmup Projekt)
In der ersten Stunde haben wir Ideen am Miro gesammelt. Am Anfang hatte ich viele Ideen, aber mir wurde klar, dass manche Objekte etwas schwieriger zu präsentieren sind als die anderen. Deshalb habe ich mich für 4 Objekte entschieden, die ich analysiert habe, woraus sie bestehen, welche Funktion sie haben, aus welchen Materialien sie gemacht werden können, welche Arten von Objekten es gibt usw.
Ich habe mich für einen Zirkel, eine Haarspange, eine Computermaus und einen Lichtschalter entschieden
Fact Sheet (Zirkel)
Ich habe mich für einen Zirkel entschieden und ein Fact Sheet darüber erstellt. Ich habe recherchiert und Informationen gefunden über:
-Bestandteile/Zusammenstellung eines Zirkels,
-wie er verwendet wird und wofür er verwendet wird,
-Zubehör,
-wie und wann er hergestellt wurde /Geschichte,
-verwendete Materialien,
-Größe und Gewicht,
-wo man ihn bekommen kann und für wie viel Geld,
-Verschiedene Arten/Variationen von Zirkel und wofür sie verwendet werden
Spline - 3D Modell
https://my.spline.design/untitled-9880b5be51db6f99cb6ea18e3a0fff3a/
Ich habe mit vielen Kugeln und Würfeln gearbeitet. Ich habe verschiedene Arten von Schatten und Glanzlichtern ausprobiert, um den Metallteil des Zirkels gut ins Fokus zu bringen. Ich habe auch versucht, den oberen Teil, wo der Griff ist, strukturiert zu machen, um zu sehen, was ästhetischer aussieht.
Variationen:
Mir gefiel die Ästhetik des gesamten Splines und ich entschied mich schließlich für die pastellrosa Variante mit dem lila Hintergrund. Ich habe die Struktur nicht verwendet, weil ich sie für zu viel hielt und mir die Idee, mit verschiedenen Arten von Beleuchtung und Reflexion zu spielen, besser gefiel.
Spline Animation
Die Idee meiner Animation ist, dass sich der Zirkel zuerst öffnet, sich dann dreht und so einen Kreis zeichnet.
Hier habe ich verschiedene Methoden zum Erstellen der Animation ausprobiert und am Ende musste ich jeden Teil des linken Beins des Kompasses so animieren, dass er sich öffnen konnte, dann würde sich den ganzen Zirkel um 360 Grad um seine Achse drehen und das rechte Bein soll dabei gerade stehen bleiben. Die Zeichenlinien am Boden werden mit der Option „Angle“ erstellt, wobei es zwei States gibt und der Kreis langsam gezeichnet wird.
Link YouTube:
Link Spline:
https://app.spline.design/file/f3a1095b-2219-428f-8823-37c70aeba099
Neues Projekt - Research - Discover
Link:
https://miro.com/app/board/uXjVNS5LYIk=/
Sammlung:
Favoriten (Research):
Dinge wie Glücksrad, Mixer und Kaugummiautomat waren meine Favoriten. Ich dachte, es wäre interessant, einige Spline-Animationen mit ihnen zu erstellen und zu erklären, wie sie funktionieren und wie sie hergestellt werden.
Kaugummiautomat (Mindmap)
Kaugummiautomaten sind sehr interessant. Der Vorgang selbst sieht sehr einfach aus, wir werfen eine Münze in den Automaten und holen uns schnell einen Kaugummi, genießen ihn und schon endet die Interaktion. Aber es ist viel komplizierter. In einem Kaugummiautomat gibt es viele Teile, die alle miteinander verbunden sind. Der Mechanismus ist nicht so einfach, und das Problem bestand darin, dass es nicht so viele Quellen gibt, aus denen wir viel über den Prozess lernen können. Die vorhandenen sind meist kompliziert zu verstehen oder unvollständig. Deshalb wollte ich versuchen, selbst zu recherchieren und alles auf einfache Weise darzustellen.
In- und Output
Als Input hatte ich die Idee, QR-Codes am Gerät nutzen zu können, die per Handy gescannt werden, um Informationen zu erhalten. Oder um Touch zu verwenden, indem wir die Maschine berühren und dann Informationen auf dem Monitor bekommen.
Die Ideen für Output waren: ein Spline-Modell oder auf einer Website angezeigte Bilder mit informativem Text zu haben, ein Tablet, Bare Conductive oder die Herstellung eines Automaten aus Pappe und Glas, oder ein echten Modell zu kaufen mit digitalisierten Informationen am Bildschirm.
Pitch-Deck
Die Idee besteht darin, einen echten Kaugummiautomat im Raum zu verwenden, da eine Interaktion stattfindet (den Automaten anschauen, berühren) und Informationen schneller im Gedächtnis bleiben, wenn wir selbst etwas ausprobieren. Mit Hilfe von Bare-Conductive werden nach Berührung der Maschine alle Illus und Texte auf dem Tablet angezeigt, das aufgrund seiner einfachen Bedienung für alle Gruppen und Altersgruppen geeignet ist.
Umsetzung
Storyboard
Bei Storyboard gibt's die Idee, den Monitor zu verstecken, und eine Möglichkeit besteht darin, einen Rahmen zu schaffen, der wie ein Kaugummi aussieht und zum Thema passt. Die Person ging zum Tisch, sah sich das Modell an, begann mit der Verwendung des Modells, sah sich die Informationen auf dem Monitor an und konnte später den Kaugummi nehmen.
User Flow
Kaugummiautomat - Modell
Dieser Automat ist 28 cm hoch, mit echtem Glas und Münzeinwurf. Die Münzen können ganz leicht unter dem Gerät wieder entnommen werden. Der Kaugummiautomat besteht im unteren Teil aus einem Metallsockel (Spritzguss) mit dem klassischen Drehmechanismus. Der obere Bereich ist gekennzeichnet durch ein rundes bauchiges Glasgefäß, was durch eine Öffnung die Kaugummikugeln aufnehmen kann. Dieses Modell ist sehr ähnlich zu den Ford Kaugummiautomat, was sehr wichtig für die Evolution der Automaten wegen den Münzeinwurf war.
Prozess
Link: https://miro.com/app/board/uXjVNEYLrkY=/
Ständer für den Automat:
Für den Automatenständer habe ich eine Holzkiste mit den Maßen 14x6cm verwendet. Ich habe es mit Hilfe von Acryl-Sprühfarbe rot lackiert und es dient dazu, die Bare Conductive Platte und alle Drähte abzudecken, sodass alles sauber aussieht.
Holzplatte und Ständer für den IPad:
-6mm Birkenmultiplex Holz
Kreisscheibe 50cm
geschnitten mit CNC Fräse
-Idee:
-> Das Rechteck so schneiden, dass nur das Bildschirm der IPad sichtbar ist -> Wir haben die Maße des iPads gemessen und alles auf einer Holztafel skizziert -> Die Größe des Lochs entspricht der Größe des Bildschirms
-> Die Drähte benutzen, um das iPad und Holzplatte zu halten
-> Einen Ständer herstellen, um alles stabil zu halten und zu verhindern, dass sich das iPad während des Gebrauchs bewegt (IPad kann sich nicht bewegen, weil es Unterstüzung von den Seiten und der Rückseite hat).
Ständer:
-Wir haben einen Ständer aus Holz gebaut, in den wir später Löcher für Nägel gemacht haben.
-Wir haben alles auf dem Holzbrett befestigt und zusätzlich 3 Holzstäbe darauf gesteckt, um das iPad an Ort und Stelle zu halten, damit es nicht herunterfallen kann
-Wir haben ein Loch (Rechteck) in den Holzstab gemacht, der ganz unten steht, damit wir bei Bedarf das Kabel vom iPad einstecken können
-Das letzte Holzteil muss festgeschraubt werden, wenn das iPad in den Ständer gestellt wird, damit es sich nicht bewegen kann
Bare Conductive:
Das erste, was getan werden musste, war die Verwendung von Bare Conductive Ink, einer schwarzen Farbe, die über Drähte mit der Bare Conductive-Platte verbunden ist, auf der der Code platziert ist, sodass nach dem Berühren der Farbe ein spezifischer Figma-Frame mit Illus und Erklärungen auf dem Bildschirm angezeigt wird. Dazu habe ich Farbe, einen im Kit enthaltenen Pinsel und Kreisen mit Kleber, und Tape verwendet, um alle Linien perfekt gerade zu machen. Es dauerte lange, alles zu trocknen, aber der Prozess war erfolgreich.
Skizzen und Fotos:
Figma:
-rot-weiß Thema
-Überschrift, Illus und dann Text
-Animationen -> funktionieren mit dem Klick
Mit Bare Conductive:
Jeder Frame hat eine Interaktion mit der Tastatur, denn mit Bare Chonduction können wir die Buchstaben A, B, C, D auf dem iPad schreiben
Buttons:
Die Inspiration waren Plakate aus den 60er Jahren
Probe:
Fertiges Projekt
