TEErapie
DOKUMENTATION
KONZEPTION
Wie kam ich auf diese Idee?
Ich habe mich schon oft mit der Wirkung von Tees und Kräutern beschäftigt, kann das Wissen aber nicht lange im Kopf behalten oder habe die passenden Zutaten nicht zuhause, deshalb greife ich im Alltag meist auf die immer gleichen fünf Teesorten zurück.
Bedürfnis
Viele Menschen nehmen sich zu wenig Zeit für sich selbst.
Tees oder kleine Rituale könnten helfen, aber das Wissen oder die Zeit fehlt.
Es fehlt ein emotionaler, einfacher Zugang zu Wissen rund um Kräutertees.
Ziel der App
Ich wollte eine App entwickeln, die Kräuterwissen einfach zugänglich macht, Achtsamkeit im Alltag fördert und das Bewusstsein für die Kraft von Pflanzen stärkt. Ein optionales Starterkit im Abo soll zudem den Einstieg erleichtern, ohne dass man Kräuter mühsam zusammensuchen muss.
Zielgruppe
Teeliebhaber:innen und Personen mit Interesse an Kräuterheilkunde zwischen 16-35 Jahren.
Fokus der Arbeit
Der Schwerpunkt liegt auf einem durchdachten und visuell ansprechenden UX/UI-Design, das eine intuitive Nutzung ermöglicht. Dabei sollen sowohl die visuelle Stimmungsauswahl als auch die Darstellung der Teevorschläge eine ansprechende, harmonische Wirkung haben.
Die Benutzung der App sollte Spass machen und gleichzeitig informative Inhalte bieten.
Naming
Der Name «TEErapie» entstand aus dem Gedanken, dass Menschen Therapieformen aufsuchen, um sich besser zu fühlen oder etwas in ihrem Leben zu verändern – körperlich oder seelisch. Auch meine App soll dazu beitragen, das Wohlbefinden der User:innen zu stärken: durch einen kurzen Moment der Achtsamkeit und die unterstützende Wirkung von Kräutern.
Wichtig ist mir dabei zu betonen, dass TEErapie keinesfalls eine psychotherapeutische Behandlung ersetzen soll, sondern eine kleine, wohltuende Ergänzung im Alltag bietet.
Feeling der App
Ich wollte ein nahbares und freundliches Design schaffen, das den Nutzer:innen Freude bereitet und eine persönliche Note vermittelt. Die App soll leicht, unkompliziert und stimmungsaufhellend wirken, mit einem Design, das ein positives und einladendes Gefühl auslöst.
RECHERCHE
Konkurrenzanalyse
Ziel der Konkurrenzanalyse war es, bestehende Apps zu analysieren, die Stimmung und Tee verbinden. Dabei habe ich Funktionen, Inhalte, Stärken und Schwächen untersucht, um herauszufinden, was ich für TEErapie übernehmen kann und wo ich bewusst neue Wege gehen möchte. So zeigte sich auch, wie sich TEErapie durch einen eigenen Mehrwert klar von der Konkurrenz abheben kann.
Fazit
Während es bereits Apps mit stimmungsbezogenen Teevorschlägen oder Selfcare-Ansätzen gibt, vereint TEErapie emotionale Nutzerführung, Kräuterwissen und stimmungsadaptierte Teemischungen in einer alltagsnahen, liebevoll gestalteten App. Der klare Fokus auf Mood-Matching plus Teekompetenz hebt sie vom bestehenden Angebot ab.
Benchmarkanalyse Mood-Auswahl
Im Rahmen dieser Benchmark-Analyse habe ich gezielt verschiedene Mood-Tracking-Apps sowie Anwendungen mit stimmungsbezogenen Ansätzen daraufhin untersucht, wie sie die Auswahl und Darstellung von Stimmungen gestalten.
Ziel war es, mir Wissen über bestehende Herangehensweisen anzueignen und daraus Erkenntnisse für die Gestaltung der Mood-Auswahl abzuleiten.
Moodboard
Das Moodboard habe ich erstellt, um visuelle Inspirationen für die Stimmung, Farbwelt und Gestaltung von TEErapie zu sammeln und ein Gefühl für den gewünschten Look & Feel der App zu entwickeln.
Stimmungen
Mit Unterstützung von ChatGPT habe ich eine erste Liste erstellt, die passende Kräuter zu verschiedenen Stimmungen vorschlug. Daraus wählte ich 16 Stimmungen, die ein möglichst breites emotionales Spektrum abdecken, und ordnete sie in vier Kategorien: Energievoll, Ausgeglichen, Niedergeschlagen und Angespannt. Die Einteilung war herausfordernd, da Stimmungen oft fliessend und subjektiv sind.
Ursprünglich plante ich, sowohl Kräuter für als auch gegen bestimmte Stimmungen zu recherchieren. Schnell wurde jedoch klar, dass es kaum Kräuter gibt, die negative Emotionen gezielt fördern und dass ein solcher Ansatz dem positiven Grundgedanken der App widersprechen würde. Daher fokussiert sich TEErapie nun darauf, bei positiven Stimmungen unterstützende und bei negativen ausgleichende Kräuter zu empfehlen.
Kräuter
Anschliessend habe ich die von ChatGPT vorgeschlagenen Stimmung-Teekombinationen selbstständig weiter recherchiert, um zu überprüfen, ob sie inhaltlich fundiert und sinnvoll sind. Für die Detailseiten sammelte ich zu den ausgewählten Kräutern gezielt Informationen:
So konnte ich eine fundierte inhaltliche Basis für die Kräuterprofile schaffen.
Farben
Um für die vier Stimmungskategorien eine passende Farbwahl erstellen zu können, habe ich das Thema der Farbpsychologie & Farbassoziationen recherchiert.
Dies hat in diesen Stimmungs-Farbkombinationen resultiert.
DESIGNPROZESS
Wireframe-Skizzen
Zu Beginn habe ich einfache Wireframe-Skizzen erstellt, um erste Ideen zur Struktur und Nutzerführung der App festzuhalten. Sie halfen mir dabei, zentrale Funktionen zu definieren, den Aufbau einzelner Screens zu planen und ein Gefühl für den grundsätzlichen Ablauf innerhalb der App zu entwickeln.
Low-fidelity Prototyp & Testing
Auf Basis der Skizzen habe ich einen einfachen Low-Fidelity-Prototyp mit richtigen Texten in Figma erstellt, um die Benutzerführung, Textlängen und die grundlegende Struktur der App interaktiv erlebbar zu machen. So konnte ich früh testen, ob die Navigation logisch ist und ob die Anordnung der Inhalte funktioniert, ohne Fokus auf Farben oder Design-Details.
- Einen Tee für die Stimmung «Herzoffen» generieren
- Den Tee zur Favoritenliste hinzufügen
- Den Timer starten
- Einen Tee im Lexikon suchen
Alle Aufgaben wurden erfolgreich gelöst, was mir zeigte, dass die bisher entwickelte Struktur und der Nutzerfluss funktionieren. Jedoch war die Mood-Auswahl in Form dieser «Blätter-Grafik» nicht inuitiv als klickbare Fläche erkennbar. Auf dieser Basis konnte ich den weiteren Aufbau der App gezielt weiterentwickeln.
Farben
Die Entwicklung einer passenden Farbwelt war herausfordernd: Viele Kombinationen wirkten entweder zu kindlich, zu trist oder zu grell. Schliesslich entschied ich mich für eine frische, ruhige und aktivierende Palette mit sanftem Rosaton statt kräftigem Rot. So entstand eine harmonische Farbwelt, die das gewünschte App-Feeling unterstützt.
Schriftwahl & Schriftkombination
Um das gewünschte Feeling der App auch typografisch zu transportieren, habe ich mir zunächst überlegt, wie sich die Schrift anfühlen soll.
Mit diesen Kriterien im Kopf machte ich mich auf die Suche nach passenden Schriftarten. Anschliessend ergänzte ich die ausgewählten Titelschriften um harmonierende Lauftext-Schriften. Erste Entwürfe des Startscreens halfen mir dabei, die Lesbarkeit zu überprüfen und das typografische Gesamtbild im Zusammenspiel mit dem Design besser einzuschätzen.
Gleichzeitig half mir dieser Schritt dabei, meine Ideen und Skizzen für den Startscreen zu reflektieren und gezielter weiterzuentwickeln.
Mood-Auswahl
Ursprünglich wollte ich organische Blattformen für die Mood-Auswahl nutzen, doch sie erwiesen sich als unpraktisch und undurchsichtig.
Stattdessen entwickelte ich eine einfache, übersichtliche Lösung, die es User:innen ermöglicht, schnell und intuitiv zwischen allen Stimmungskategorien zu wechseln, ohne viele Klicks.
Illustrationsstil & Illustrationen
Inspiriert von meinem Moodboard plante ich einen abstrakten oder realistischen Illustrationsstil mit Verläufen, doch dieser passte nicht zum gewünschten App-Feeling und der Schrift. Nach mehreren Versuchen kam ich auf den handgezeichneten, konturierten Stil, der die Handschriftlichkeit der Typografie aufgreift.
Icons
Auch die in der App verwendeten Icons habe ich entweder aus Glyphen der gewählten Titelschrift abgeleitet oder vollständig von Hand gezeichnet, um den Stil der Handschriftlichkeit konsequent weiterzuführen und ein stimmiges Gesamtbild zu schaffen.
Logo
Für das Logo kombinierte ich die handschriftliche Titelschrift mit einer schlichten Illustration von Kräuterblättern. So wollte ich bereits auf der kleinsten Design-Ebene das Grundgefühl der App sowie ihre Nahbarkeit sichtbar machen. Die Schrift und ihr Stil transportieren ein lockeres, persönliches Gefühl, während die Blätter und der Name direkt auf den Inhalt der App hinweisen.
Herausforderungen & Erkenntnisse
DETAILSEITEN VON TEE, WELCHER ZU MEHREREN STIMMUNGEN PASST
Eine gestalterische Herausforderung war die Darstellung der Detailseiten von Kräutern, die zu mehreren Stimmungskategorien passen. Um dies übersichtlich zu lösen, entwickelte ich zusammen mit meinem Mentor die Idee von Tabs innerhalb der Detailseiten. Je nach Stimmung wechselt die Farbe und die zugehörige Kräuterinfo.
TEEGENERATOR-TAB STARTSCREEN
Beim Teegenerator wollte ich eine Überforderung für neue User:innen vermeiden. Deshalb fügte ich einen Startscreen mit Button ein, der bewusst in den Flow einleitet.
Die gestalterische Herausforderung war es, die Farben der Stimmungskategorien ohne Farbverläufe aufzunehmen. Die Lösung war ein Kreis-Design, das symbolisch die Ausbreitung der Teewirkung im Körper darstellt und inspiriert ist von der Färbung von Tee im Wasser.
LEXIKON – «ALLE» FILTER
Im Lexikon-Tab stellte ich fest, dass in meinen frühen Skizzen ein wichtiges Element fehlte: ein «Alle»-Filter. Diese Erkenntnis half mir, die Nutzerführung zu verbessern und die Filter-Funktionalität zu vervollständigen.
ILLUSTRATIONEN
Im Laufe des Designprozesses merkte ich, dass die Kräuter-Illustrationen auf den farbigen Hintergründen weiss gefüllt deutlich besser wirken. Diese Erkenntnis kam jedoch spät, sodass ich nochmals Zeit investieren musste, um alle 16 Illustrationen entsprechend anzupassen.
STYLEGUIDE
Farben
Schrift & Schriftkombination
Illustrationen
Logo
Icons
Grid
App-Icon
KOMPONENTEN
Cards
Listenelemente
Buttons
Labels
Input-Elemente
Pop-Ups
AUSBLICK
Mit mehr Zeit und in einer möglichen Weiterentwicklung könnte die App um zusätzliche Funktionen ergänzt werden:
- Achtsamkeitsübungen während des Timers, die die Wirkung der Tees unterstützen, wie zum Beispiel Atemübungen, kleine Dankbarkeitsmomente oder geführte Mini-Meditationen.
- Der Lexikon-Tab könnte gleichzeitig als Shop fungieren, in Zusammenarbeit mit ausgewählten Teeanbietern.
- Ein Mood-Kalender wäre denkbar, mit dem Nutzer:innen ihre Stimmung über längere Zeiträume hinweg reflektieren und verfolgen können.
- Usability Testings wären Teil von weiteren Iterationen.