TastyWasty App
PROJEKTÜBERSICHT
Ein Service, der zum Kochen motiviert und im Alltag hilft
Das Konzept für die TastyWasty-App entstand im Rahmen eines UX/UI-Kurses als Teil eines Teamprojekts. Mithilfe von UX-Methoden identifizierten wir die Herausforderungen, mit denen potenzielle Nutzer:innen der App konfrontiert sind, um ihren Anspruch zu erfüllen, sich gesund und unkompliziert zu ernähren und dabei Lebensmittelverschwendung zu vermeiden. Auf dieser Basis entwickelten wir das konzeptionelle Grundgerüst, eine Navigationsarchitektur sowie Wireframes mit den wichtigsten Funktionen und ergänzenden Nice-to-have-Features. Nach Abschluss des Kurses optimierte ich das Konzept durch Usability-Tests und entwarf ein konsistentes Visual Design für die App.
Das Problem
Kochfrust im Alltag: Wenn Zeit, Geld und Motivation fehlen
Es mangelt an Zeit, Geld, Motivation, Erfahrung oder Kreativität um zu Hause gesunde Gerichte zuzubereiten. Außerdem plagt viele das schlechte Gewissen, wenn man zum wiederholten Mal Lebensmittel wegwirft, obwohl dieses Handeln nicht den eigenen Werten entspricht. Da man sich jeden Tag ernähren muss ist das Thema Kochen oft mit Frust verbunden.
ZIELE
Den Nutzer:innen auf Grundlage ihrer Präferenzen und vorrätigen Lebensmittel ermöglichen, einfache und gesunde Gerichte zuzubereiten
Die Nutzer:innen wollen wieder mehr Spaß am Kochen gewinnen, Hilfestellung und neue Ideen beim Zubereiten erhalten und mit ihren zu Hause vorrätigen Lebensmitteln kochen. Das Kochen soll einfach und schnell gehen. Sie wollen außerdem die Möglichkeit bekommen, sich zu Thema nachhaltiger Konsum und gesunde Lebensmittel informieren zu können. Zusätzlich soll es die Möglichkeit eines Community-Austauschs geben.
User research
Ein besseres Verständnis für die Bedürfnisse und Pain Points der Nutzer:innen erhalten
Anhand von einigen Nutzer:inneninterviews im Rahmen des Kurses haben wir Daten gesammelt und ausgewertet um zwei Personas der Zielgruppe zu identifizieren, was hilfreich war, um ihre Pain Points und Bedürfnisse zu verstehen.
Die Days in a Life haben uns geholfen die Pain Points der Personas im Alltag zu identifizieren, um zu verstehen an welchen Stellen die App den User:innen Abhilfe schaffen kann.
Lisa, 24
Unerfahrene Köchin, die Inspiration benötigt
Sozial
Umweltbewusst
Studentin
„Sharing is caring!”
„Ich habe sehr viel Lust neue Rezepte auszuprobieren, aber wenig Geld zur Verfügung. Hilfestellung um meine Kochskills zu verbessern wäre super!”
Anton, 35
Kocht nur zum Zweck und will schnelle Lösungen
Organisiert
Techaffin
Projektmanager
„Kochen ist zu kompliziert!”
„Mir fällt es schwer gesund zu kochen und habe in meinem stressigen Alltag wenig Zeit dazu. Für mich wäre eine klare und effiziente Lösung, die ressourcenschonend ist, ideal.”
Wichtigste Erkenntnisse
Es fällt den Nutzer:innen schwer, sich im Alltag gesund zu ernähren und Motivation zum Kochen zu finden
Frust bei dem Thema
Mangelnde Kocherfahrung, wenig Kreativität beim Kochen und komplizierte Rezepte führen zu Frust.
Zeitmangel
Durch Zeitknappheit sind Nutzer:innen dazu verleitet, auswärts zu essen oder Fertiggerichte zuzubereiten, die ungesund sind.
Schlechtes Gewissen
Die Nutzer:innen möchten weniger Lebensmittel wegwerfen oder Hilfstellung zu den Portionen, die sie kochen, bekommen.
Wettbewerbsanalyse
Was machen Konkurrenzapps gut, was kann man verbessern oder wie von Anbietern abheben?
Auf Grundlage der Interview-Feedbacks und der darin geäußerten Wünsche analysierten wir die wichtigsten Konkurrenzapps, um zu verstehen, wie andere Anbieter diesen Ansprüchen gerecht werden. Dabei arbeiteten wir sowohl positive als auch negative Aspekte der Apps heraus. Besonders inspirierend fanden wir beispielsweise die übersichtliche Gestaltung der Rezepte bei Kptn Cook, die in Form einer Step-by-Step-Anleitung präsentiert werden.
MAIN-Features
Die Kernfunktionen der App auf Basis der Erkenntnisse aus der Recherche
Baukastenprinzip
Generierung von gesunden, einfachen und leckeren Rezepten anhand von 3–5 Lebensmitteln, die man zu Hause vorrätig hat und abfotografieren kann.
Digitaler Vorratsschrank & Präferenzen
Hier kann man immer vorrätige Gewürze, Zutaten und Ernährungspräferenzen abspeichern.
Eine Foodsharing-Plattform
Beim Nutzen der App soll man sich als Foodsaver gut fühlen und Lebensmittel einstellen/abholen können.
Die MoSCoW-Methode hat uns geholfen, Features in der App zu priorisieren
Designkonzept
Die UX-Erkenntnisse im Blick für ein sinnvolles UI-Design
Um die Hauptfunktion, nämlich die schnelle und einfache Generierung von Rezepten, in den Fokus zu stellen und eine Übersichtlichkeit in der App zu schaffen befolgten wir das Leitprinzip „keep it simple & smart“. Side-Features sind Add-Ons und sollen den User:innen die Möglichkeit geben Neues zu entdecken und dabei Spaß zu haben. Sie sollen aber nicht von Hauptfunktion der App ablenken. Ziel ist es, die Nutzung der App angenehm und produktiv zu gestalten, ohne Frustration oder Verwirrung zu stiften.
Navigationsarchitektur
Besonders viel Zeit habe ich für die Navigationsstruktur aufgebracht, um eine gute und sinnvolle Struktur mit klar zugewiesenen Bereichen zu erstellen. Die Hauptfunktion steht im Mittelpunkt und ist über einen größeren Button in der Tabbar erreichbar. Weitere Tabs in der Tabbar sind: Rezepte suchen, Wissensblog zu Nachhaltigkeit, die Foodsharing-Plattform und der Profilbereich in dem auch der Vorratsschrank und Präferenzeinstellungen zu finden sind.
Eine Sitemap / Flow chart hilft die Zusammenhänge zu verstehen
Low-fi-Wireframes um Übersicht zu schaffen und User flows zu prüfen
In dem abgebildeten Flow ist aufgezeigt, wie man vom Login in der App zur Hauptfunktion gelangt und direkt mit der Rezeptgenerierung loslegen kann. Diese erfolgt, in dem man entweder Zutaten zu Hause abfotografiert, die in der nummerischen Leiste oben eingeloggt werden, oder über das Suchfeld nach Zutaten sucht. Zwischendurch ist ein „Kann-man-das-noch-essen“-Check der eingeloggten Zutat möglich. Nach drei gespeicherten Zutaten ist es möglich, Rezeptvorschläge zu generieren.
Visuelles Designknzept
Entwicklung der visuellen Identität
Da Kochen bei jungen Personen immer beliebter wird, wählte ich einen modernen und unterhaltsamen Designansatz. Die Kombination von einem Dunkelgrün als Primary und einem ungewöhnlichen Peach-Farbton als Secondary Color soll eine optimistische Haltung zum Kochen fördern. Lockere, nicht zu stark inszenierte Stockbilder und grafische Pinselelemente sollen den Eindruck vermitteln, dass nicht alles perfekt laufen muss. Hauptsache man bewahrt sich den Spaß beim Kochen. Die Verwendung heller, frischer Farben und ansprechender Bilder ist entscheidend, um eine emotionale Verbindung zu der Zielgruppe herzustellen, die es gewohnt ist hochwertiges Bildmaterial auf Social-Media-Kanälen zu konsumieren.
Lösung
Die Ideen in einem Prototypen umsetzen
Nach des Abschluss der Low-fi-Wireframes konnte ich die Gestaltung des High-Fidelity-Prototypen angehen. Der erste Aufschlag der UI-Komponenten erfüllte nicht den Richtlinien zur Barrierefreiheit. Dieses korrigierte ich in einer Überarbeitung der Screens, da mir dieses Thema ein Anliegen ist.
Nach mehreren Iterationsrunden erreichte ich schließlich das endgültige Design. Im nächsten Schritt konzentrierte ich mich darauf, sicherzustellen, dass der Übergang von einem Screen zum anderen reibungslos und konsistent war.
Neugier wecken, Funktionen zeigen: So gelingt der App-Einstieg
Die Intro-Screens, die die Hauptfunktionen der App vorstellen, sind als erstes Fenster zur App besonders wichtig. Durch ansprechendes Bildmaterial und frische Farben kann das visuelle Design die Neugier der jungen Zielgruppe wecken und sie dazu motivieren, die App auszuprobieren. Zudem vermitteln die Screens die wichtigsten Funktionen klar und prägnant in wenigen Sätzen.
Wähle deine TastyWastys
In einem einfachen Flow kann die/der User:in von seinen Lebensmitteln zu Hause Fotos von machen, die dann zu einer Generierung von einfachen Rezepten führen. Mindestens 3 und maximal 5 Lebensmittel können aufgenommen werden.
„Kann man das noch Essen?“-Check
Die Checkbox hilft dir dich zu vergewissern, dass dein angebrochener Joghurt oder deine mit Dellen überzogene Gurke noch genießbar ist.
Kochen leicht gemacht: Rezepte mit Video für stressfreies Kochen
Die generierten Rezepte werden in einem übersichtlichen Grid dargestellt. Über das Herz-Icon lassen sich interessante Rezepte für später speichern.
In der Detailansicht finden sich Nährstoff- und Zeitangaben, der durchschnittliche Nutzer:innen-Bewertungsscore sowie eine strukturierte Zutatenliste mit allen benötigten Zutaten. Eine Schritt-für-Schritt-Anleitung mit kurzen Videosequenzen erleichtert die Zubereitung. Die Videos können entweder mithilfe einer Bild-KI generiert oder aus einem vordefinierten Videopool abgerufen werden.
Dein digitaler Vorratsschrank: Kochen nach eigenem Geschmack
Die Nutzer:innen können in ihrem Vorratsschrank Zutaten und Gewürze, die man immer zu Hause vorrätig hat, konfigurieren. Präferenzen, Allergien können in der Sektion Meine Präferenzen gespeichert werden. Diese Bereiche liegen hinter einer Paywall und sollen zum Abonnement animieren.
Ergebnisse
Wie würde ich die Key Performance Indicators (KPIs) nach dem Start messen?
Obwohl es sich bei Tasty Wasty um ein fiktives Projekt handelt, empfinde ich es als notwendig, über Szenarien nachzudenken, die in einem Geschäftsumfeld auftreten können um die KPIs herauszuarbeiten.
Anzahl der generierten Rezepte
Da das Ziel darin besteht, den Nutzer:innen das Kochen über vorgeschlagene Rezepte zu erleichtern, ist dies eine Möglichkeit, die Nutzungsrate zu messen.
Anzahl der Weekly/Daily users
Um den Erfolg der App zu messen, ist dies ein wichtiger Indikator, der zeigt, ob die App einen Mehrwert für die Nutzer:innen bietet.
Anzahl der erzielten Einnahmen
Abonnementgebühren = Unternehmenseinnahmen und Kundenbindung.
Nutzungshäufigkeit der Foodsharing-Plattform
Um die Relevanz dieses Features besser zu verstehen, ist es entscheidend zu erfassen, wie viele Personen Angebote einstellen oder die Angebote anderer Nutzer:innen nutzen.
Rückblick
Reflexion zum Arbeitsprozess
Features
Da uns das Projekt begeistert hat, planten wir mit guter Intention viele Features ein, die die Nutzer:innen überfordern können. Hier kann sicherlich noch eine Reduktion stattfinden. Im Feedback hatten wir herausgearbeitet, dass sich viele Nutzer:innen eine Foodsharing-Plattform wünschen. Grundlegend sind soziale Features super, wenn sie von der Community angenommen werden, können aber auch dem Produkt schaden, wenn nicht genug User mitmachen. Daher sollten solche Features in einem realen Projekt kritischer hinterfragt werden.
Barrierefreiheit sicherstellen
Das Thema der Barrierefreiheit habe ich am Anfang der UI-Gestaltung nicht ausreichend berücksichtigt. Daher musste ich die Screens im Laufe des Prozesses überarbeiten, um sicherzustellen, dass auch Nutzer:innen mit Einschränkungen das gleiche Nutzererlebnis haben wie andere Nutzer:innen. Barrierefreiheit bringt jedoch nicht nur Vorteile für Menschen mit Einschränkungen, sondern verbessert das Nutzererlebnis insgesamt. Deshalb sollte sie von Beginn an ein zentraler Bestandteil der Konzeption sein.
Teamarbeit
Die Zusammenarbeit im Team war für mich äußerst bereichernd, da jedes Mitglied einen individuellen beruflichen Hintergrund mitbrachte und so verschiedene Perspektiven in die Arbeit einflossen. Eine wichtige Erkenntnis aus dieser Teamarbeit war, dass durch klare Aufgabenverteilung und zügiges Feedback in kurzer Zeit bemerkenswerte Ergebnisse erzielt werden können.
