lenolio
EcoCart

Meine Rolle

Design, Research, Umsetzung der Visualisierung mit Touchdesigner

Teammitglieder

5

Entstanden

Im Rahmen des Projektmodul KI im 4. Semester 2023

Methodik

TouchdesignerKIPythonFigma

What?

Im Rahmen des Moduls KI und Interaktive Systeme bestand die Aufgabe darin, mithilfe von künstlicher Intelligenz eine interaktive Installation zu entwickeln, die gesellschaftliche Relevanz besitzt und Menschen durch Technologie zum Handeln motiviert. Unser Team erhielt das Thema Kreislaufwirtschaft und stellte sich die Frage, wie wir Menschen dieses komplexe Konzept verständlich und greifbar vermitteln können. Ziel war es, eine visuell ansprechende, interaktive Erfahrung zu schaffen, die Bewusstsein für nachhaltigen Konsum weckt und spielerisch zum Nachdenken anregt.

How?

Das Projekt wurde mit einem human-centered und explorativen Ansatz entwickelt. Zu Beginn führten wir Recherche zu nachhaltigem Konsum und Kreislaufwirtschaft durch, um zentrale Probleme und Missverständnisse zu identifizieren. Darauf aufbauend formulierten wir unseren How Might We-Ansatz: Wie können wir Menschen das Thema Kreislaufwirtschaft näherbringen und sie gleichzeitig durch eine visuell ansprechende Interaktion zum Handeln motivieren? Anschließend folgten Ideation, Konzeptentwicklung, KI-Training und Prototyping in TouchDesigner. Das Ergebnis war eine funktionierende Installation, die in Echtzeit mit der KI interagiert und Nutzer:innen unmittelbares visuelles Feedback über ihr Konsumverhalten gibt.

Why?

Die Kreislaufwirtschaft ist ein zentraler Baustein nachhaltiger Entwicklung, doch vielen Verbraucher:innen fehlt das Bewusstsein für die ökologischen Auswirkungen ihrer Kaufentscheidungen. Durch die tägliche Routine des Einkaufens bietet sich ein direkter Ansatzpunkt, um dieses Bewusstsein zu fördern. EcoCart nutzt diesen Moment, um Nachhaltigkeit erlebbar zu machen: Die Installation übersetzt abstrakte Informationen in visuelle und emotionale Rückmeldungen, die Konsument:innen aktiv einbeziehen und motivieren, ihr Verhalten langfristig zu überdenken.

Insights

Während der Research- und Konzeptionsphase wurden durch Beobachtungen, Literaturrecherche und Diskussionen mehrere zentrale Erkenntnisse gewonnen:

Bewusstsein & Verhalten

Viele Konsument:innen wissen grundsätzlich über Nachhaltigkeit Bescheid, jedoch fehlt ihnen im Alltag die konkrete Einschätzung, wie nachhaltig ihr eigenes Kaufverhalten tatsächlich ist. Einkaufsentscheidungen werden häufig spontan und preisgetrieben getroffen – Nachhaltigkeit spielt erst nachrangig eine Rolle, weil die Auswirkungen nicht direkt sichtbar sind.

Informationsflut & Komplexität

Nachhaltigkeitsinformationen auf Produkten sind oft unklar oder uneinheitlich. Labels, Zertifikate und Werbeversprechen führen eher zu Verwirrung als zu Orientierung. Es braucht daher eine einfache, visuelle Rückmeldung, die auf einen Blick verständlich ist.

Motivation & Partizipation

Menschen reagieren positiv auf spielerische Elemente und gemeinschaftliche Ziele. Durch Gamification kann nachhaltiges Handeln emotional aufgeladen werden – der Gedanke, dass alle gemeinsam Punkte sammeln und einen Baum wachsen lassen, stärkt das Wir-Gefühl und motiviert langfristig.

Technologieakzeptanz

Künstliche Intelligenz wird von vielen als hilfreich und objektiv wahrgenommen, wenn sie transparent eingesetzt wird. Die Verbindung von AI-gestützter Produkterkennung und visueller Echtzeit-Rückmeldung wird als innovativ und glaubwürdig erlebt.

Opportunity

Es besteht großes Potenzial darin, Nachhaltigkeit an alltägliche Berührungspunkte zu bringen – etwa direkt an den Einkaufsort. Indem EcoCart den Moment des Kaufens nutzt, wird Bewusstsein dort geschaffen, wo Entscheidungen tatsächlich getroffen werden.

Idee

Die Vision von EcoCart ist es, Nachhaltigkeit sichtbar zu machen und gemeinsames Handeln zu fördern. Die Installation befindet sich am Ausgang von Supermärkten und ermöglicht es den Nutzer:innen, ihre Einkäufe mithilfe einer KI-gestützten Produkterkennung einzuscannen. Jedes Produkt wird hinsichtlich Rohstoffherkunft, Verpackung und Produktion bewertet und in fünf Nachhaltigkeitsgrade von grün (sehr nachhaltig) bis rot (wenig nachhaltig) eingeteilt. Diese Daten fließen in eine visuelle Darstellung des Einkaufs ein, die sich mit jedem Produkt verändert. Ein zusätzliches Gamification-Element motiviert gemeinsames Handeln: Alle Nutzer:innen sammeln Punkte und lassen gemeinsam einen virtuellen Baum wachsen, der – sobald er vollständig ist – symbolisch (und perspektivisch real) für das Pflanzen eines echten Baums steht. So verbindet EcoCart Technologie, Bildung und Motivation zu einem interaktiven Erlebnis mit echtem Impact.

Idee Image

EcoCart

PromptAscent Service

Zu Beginn der Installation wird ein kurzes Einführungsvideo gezeigt, das den Nutzer:innen erklärt, wie die Anwendung funktioniert. Darin wird anschaulich gezeigt, wie Produkte gescannt, die Nachhaltigkeit bewertet und die Visualisierung interpretiert werden kann. Das Video dient als verständlicher Einstieg und sorgt dafür, dass alle Besucher:innen sofort wissen, wie sie mit der Installation interagieren und welchen Einfluss ihr Einkauf auf die gemeinsame Visualisierung und den virtuellen Baum hat.

Produkterkennung

Die Nutzer:innen legen ihre Produkte nacheinander auf den Tisch der Installation. Eine eingebaute Kamera erfasst das Produkt und übermittelt das Bild an eine KI, die das Objekt automatisch erkennt und auswertet. Anschließend wird der Nachhaltigkeitsgrad des Produkts ermittelt und direkt auf der Visualisierung angezeigt. So entsteht eine intuitive und spielerische Interaktion, bei der die Nutzer:innen unmittelbar erfahren, wie nachhaltig ihr Einkauf wirklich ist.

Visualisierung

Die Visualisierung reagiert dynamisch auf jedes neu erkannte Produkt. Nach jedem Scan werden die entsprechenden Farben des Nachhaltigkeitsgrades in die Darstellung integriert und fließen organisch ineinander. So entsteht ein sich ständig veränderndes, lebendiges Bild, das den gesamten Einkauf widerspiegelt. Anhand der Farbmischung können die Nutzer:innen intuitiv erkennen, wie nachhaltig ihr Einkauf war: Je mehr Grün- und Gelbtöne sichtbar sind, desto nachhaltiger fällt das Ergebnis aus – überwiegen dagegen Orange- und Rottöne, war der Einkauf weniger umweltfreundlich. Die Visualisierung macht Nachhaltigkeit so unmittelbar erlebbar und verständlich.

Gamification

Das Punktesystem in EcoCart motiviert die Nutzer:innen spielerisch zu bewussteren Kaufentscheidungen. Für jedes gescannte Produkt erhalten sie Plus- oder Minuspunkte, abhängig vom Nachhaltigkeitsgrad des Artikels: Sehr nachhaltige Produkte bringen bis zu +3 Punkte, während weniger umweltfreundliche Produkte −2 Punkte einbringen können. Alle Teilnehmenden sammeln gemeinsam Punkte, um einen virtuellen Baum wachsen zu lassen. Mit jedem nachhaltigen Einkauf gedeiht der Baum weiter – bei unnachhaltigen Produkten schrumpft er. Der Baum steht symbolisch für den kollektiven Einfluss aller Nutzer:innen: Wenn er vollständig ausgewachsen ist, wird als Belohnung in der Realität ein echter Baum gepflanzt. So verbindet EcoCart ökologische Bildung mit spielerischer Motivation und macht Nachhaltigkeit zu einem gemeinsamen Erlebnis.

PromptAscent Service

Umsetzung

Um ein umfassendes Verständnis für das Thema Kreislaufwirtschaft und nachhaltigen Konsum zu entwickeln, haben wir eine Stakeholdermap erstellt. Sie zeigt die verschiedenen Akteure, die direkt oder indirekt von Produktions- und Konsumprozessen betroffen sind – von Konsument:innen und Produzierenden bis hin zu Rohstoffverarbeitern, Zwischenhändlern und Investoren. Durch diese Analyse konnten wir unsere primäre Zielgruppe (Konsument:innen) klar eingrenzen und zugleich relevante interviewfähige Gruppen identifizieren, um unterschiedliche Perspektiven entlang der Lieferkette zu verstehen. Die Map verdeutlicht zudem, wie komplex und vernetzt wirtschaftliche sowie ethische Abhängigkeiten im globalen Konsumkreislauf sind – und weshalb Aufklärung über nachhaltiges Handeln so wichtig ist.

Umsetzungsprozess

Interview mit einem Politiker der Grünen

Umsetzungsprozess

Um ein besseres Verständnis für das Bewusstsein und die Einstellungen von Konsument:innen zum Thema Nachhaltigkeit zu gewinnen, haben wir zwei Online-Umfragen über Instagram durchgeführt – eine auf Deutsch und eine auf Englisch. Ziel war es herauszufinden, welche Rolle Nachhaltigkeit bei Kaufentscheidungen spielt, insbesondere in Bezug auf die Produktion von Konsumgütern. Insgesamt nahmen 56 Personen teil (47 deutschsprachige und 9 englischsprachige Teilnehmende). Die Ergebnisse zeigen, dass der Großteil der Befragten Nachhaltigkeit als wichtig oder sehr wichtig empfindet.

Umsetzungsprozess

Um die Erkenntnisse aus dem Interview und der Umfrage zu verdichten, haben wir eine Empathy Map erstellt. Sie fasst zusammen, was Menschen in Bezug auf nachhaltigen Konsum denken, fühlen, sagen und tun, sowie welche Einflüsse, Pain Points und Motivationen dabei eine Rolle spielen. Durch diese Methode konnten wir die Einstellungen und Barrieren der Konsument:innen besser verstehen – etwa die Gleichgültigkeit gegenüber Nachhaltigkeit im Alltag, aber auch die wachsende Motivation zum bewussteren Handeln. Die Empathy Map diente als Grundlage, um konkrete Nutzerbedürfnisse zu identifizieren und Ansatzpunkte für unsere Ideenfindung im Projekt EcoCart zu definieren.

Umsetzungsprozess

Für die Entwicklung möglicher Konzepte nutzten wir die Methode des Brainwriting. Dabei notierte jedes Teammitglied unabhängig voneinander seine Ideen, die anschließend im Team geteilt und weiterentwickelt wurden. Diese Methode half uns, kreative Impulse ohne Gruppendruck zu sammeln und verschiedene Perspektiven gleichberechtigt einzubeziehen. In einer anschließenden Abstimmung bewerteten wir alle Vorschläge nach Relevanz, Umsetzbarkeit und Innovationsgrad – und entschieden uns schließlich gemeinsam für die Idee der interaktiven Installation „EcoCart“, die nachhaltiges Konsumverhalten auf spielerische Weise fördern soll.

Als nächstes haben wir für die Idee ein Storyboard entwickelt um die Nutzung der Installation zu veranschaulichen: Die Nutzer:innen wählen zunächst ihre Produkte im Supermarkt aus und scannen diese anschließend an der EcoCart-Station ein. Nach dem Scan zeigt das System Informationen zu den Umweltauswirkungen jedes Produkts sowie nachhaltigere Alternativen an. Parallel dazu entsteht eine dynamische Visualisierung, die den Nachhaltigkeitsgrad des gesamten Einkaufs darstellt und sich mit jedem Produkt verändert. So wird auf spielerische Weise deutlich, welchen Einfluss jede Kaufentscheidung auf das Gesamtergebnis hat – und Nutzer:innen werden motiviert, bewusster einzukaufen.

Umsetzungsprozess

Prototyping

Um den Nutzerfluss der Installation klar zu definieren und ein gemeinsames Verständnis im Team zu schaffen, haben wir den gesamten Ablauf in Figma visualisiert. Der Prototyp zeigt Schritt für Schritt, wie Nutzer:innen mit der EcoCart-Installation interagieren – vom Auswählen und Scannen der Produkte bis hin zur Visualisierung der Nachhaltigkeit und dem Wachstum des virtuellen Baumes. Durch diese Darstellung konnten wir den Interaktionsprozess abstimmen, Inkonsistenzen frühzeitig erkennen und eine klare Grundlage für die technische Umsetzung und das User Testing schaffen.

Idee Image

Style Guide

Für die visuelle Gestaltung von EcoCart entschieden wir uns für ein dynamisches, fließendes Design, das die Bewegung und Veränderung innerhalb der Visualisierung widerspiegelt. Die Formen und Übergänge sollen den Kreislaufgedanken symbolisieren und so den inhaltlichen Fokus des Projekts auch visuell unterstützen. Als Schriftarten kamen Jura für erklärende Texte und Hinweise sowie Baloo Bhaina für Überschriften zum Einsatz. Diese Kombination schafft einen modernen, freundlichen und zugleich informativen Look, der Nutzer:innen klar durch den Prozess führt.

Umsetzungsprozess

Die Farbpalette basiert auf fünf Abstufungen von Grün bis Rot – sie steht für die unterschiedlichen Nachhaltigkeitsgrade der Produkte: von #72B871 (Grün) für sehr nachhaltige Produkte bis #BA0000 (Rot) für wenig nachhaltige. Damit wird die Bewertung intuitiv verständlich und die Veränderung der Visualisierung leicht nachvollziehbar.

Umsetzungsprozess

Technische Umsetzung

Die Produkterkennung wurde mit Python, der Roboflow API und OpenFoodFacts umgesetzt. Das Skript product_recognition_cam_list_json_scores.py erkennt Produkte über eine Kamera, bewertet sie nach ihrem Nachhaltigkeitsgrad und exportiert die Daten für die Visualisierung. Nach der Initialisierung von Roboflow und der Kamera werden erkannte Produkte laufend analysiert. Abhängig von der Erkennung wird ein fester Barcode vergeben (z. B. Avocado → 8433771314014), der anschließend über die OpenFoodFacts-API abgefragt wird. Die API liefert den ecoscore_grade (A–E), aus dem ein numerischer Score und entsprechende Punkte berechnet werden. Alle Ergebnisse werden in zwei JSON-Dateien gespeichert: recognized_products.json (Produktname & Eco-Grade). products_eco.json (Eco-Score & Punkte). Diese Dateien werden in TouchDesigner eingelesen und dienen dort als Grundlage für die dynamische Nachhaltigkeitsvisualisierung.

Diese strukturierte Datenausgabe ermöglicht es, dass die Visualisierung automatisch und in Echtzeit auf die Ergebnisse der KI reagiert. Das Frontend oder TouchDesigner kann die Datei direkt einlesen, die Werte interpretieren und die entsprechenden Farben und Effekte erzeugen.

Umsetzungsprozess

Die Visualisierung der Nachhaltigkeitswerte wurde in TouchDesigner umgesetzt. Mein Verantwortungsbereich lag dabei in der Gestaltung und Programmierung der fließenden Farbvisualisierung, die in Echtzeit auf die analysierten Produktdaten reagiert. Die Daten wurden von der KI-basierten Produkterkennung generiert und als JSON-Datei an TouchDesigner übergeben. Innerhalb der Anwendung werden diese Werte ausgelesen und dynamisch in Farbverläufe umgewandelt, die den jeweiligen Nachhaltigkeitsgrad der gescannten Produkte repräsentieren. Je nach Bewertung verändert sich das Erscheinungsbild – von grün und gelb bei nachhaltigen Einkäufen bis hin zu orange und rot bei weniger nachhaltigen Entscheidungen. Durch dieses Zusammenspiel von Daten und visueller Dynamik entsteht eine direkte, intuitive Rückmeldung, die das Nutzererlebnis emotional und informativ zugleich macht.

Umsetzungsprozess

Zum Abschluss wurde in TouchDesigner eine UI entwickelt, die die erkannten Produkte und ihre Nachhaltigkeitsinformationen visuell darstellt. Auf der Oberfläche werden der Produktname, der Eco-Score sowie die erreichten Punkte angezeigt. Zusätzlich wurde ein Menü integriert, über das Nutzer:innen auswählen können, ob sie weitere Produkte hinzufügen möchten. Diese Benutzeroberfläche bildet die interaktive Schnittstelle zwischen der Produkterkennung, den JSON-Daten und der Visualisierung – und ermöglicht so ein unmittelbares und verständliches Feedback zum eigenen Einkauf.

Reflektion

Die Arbeit an EcoCart hat gezeigt, welches Potenzial interaktive Installationen besitzen, um komplexe Themen wie Nachhaltigkeit erlebbar zu machen. Besonders die Verbindung aus Künstlicher Intelligenz, Echtzeitvisualisierung und Gamification ermöglichte einen innovativen Ansatz, der Nutzer:innen auf emotionaler und informativer Ebene anspricht. Gleichzeitig brachte das Projekt einige Herausforderungen mit sich: Die Datenbasis der OpenFoodFacts-API ist teilweise unvollständig, was zu inkonsistenten Bewertungen führen kann. Auch die Erkennungsgenauigkeit der KI hängt stark von Beleuchtung und Kamerawinkel ab, was die Zuverlässigkeit im realen Einsatz einschränkt. Im Prototypenstadium konnte außerdem nur ein kleiner Teil des möglichen Interaktionsumfangs und UI-Designs umgesetzt werden. Eine Integration an Selbstscankassen oder in digitale Einkaufs-Apps würde es ermöglichen, Nachhaltigkeitsinformationen direkt beim Kauf bereitzustellen. Zudem könnten erweiterte Gamification-Elemente – etwa persönliche Profile, Sammelziele oder lokale Challenges – langfristig zu einem Verhaltenswandel im Konsum beitragen. Insgesamt zeigt das Projekt, dass digitale Technologien nicht nur informieren, sondern aktiv zum Handeln motivieren können – wenn sie verständlich, visuell ansprechend und mit klarer gesellschaftlicher Relevanz gestaltet werden.