Backtorial

Auf einen Blick

Mit Backtorial wurde eine App entwickelt, die gezielt Back-Anfänger unterstützt und ihnen den Einstieg erleichtert. Basierend auf Nutzerforschung und Usability-Tests entstand ein interaktives Konzept, das einfache Schritt-für-Schritt-Anleitungen mit Video-Clips, personalisierten Rezeptvorschlägen und praktischen Funktionen zur Backplanung kombiniert.

Meine Rolle

User Research & Konzeption: Analyse der Zielgruppe, Entwicklung von Personas und User Journeys
UI/UX-Design: Gestaltung einer intuitiven Benutzeroberfläche und interaktiver Prototypen
Prototyping & Testing: Erstellung und Evaluierung von Low- und High-Fidelity Prototypen durch Usability-Tests

Technologien & Methoden
Human-Centered Design, Benchmarking, Usability Testing, UI/UX-Design, Prototyping mit Figma

Ergebnis
Backtorial kombiniert die Vorteile von Print-Rezepten und Video-Anleitungen in einer intuitiven App, die den gesamten Backprozess unterstützt. Der High-Fidelity-Prototyp wurde erfolgreich getestet und erfüllt die identifizierten Nutzerbedürfnisse wie Anleitung, Übersichtlichkeit, Planbarkeit und Individualisierbarkeit.

Ziel der App

Im Rahmen meiner Bachelorarbeit entschied ich mich dazu, eine Back-App zu konzipieren und gestalten, die besonders die Bedürfnisse von Back-Anfängern berücksichtigt.

Ausschlaggebender Anlass hierfür waren meine persönlichen Erfahrungen im Bereich Backen. Da ich selbst eine Weile lang meine Back-Kreationen auf Instagram publizierte, kam mir häufig zu Ohren, dass viele Personen gerne backen würden, jedoch nicht wissen, wie sie anfangen sollen. Sie wissen nicht, wo sie zu ihren Fähigkeiten passende Rezepte finden können und sind schnell demotiviert, wenn ein Backversuch schiefgeht.

Daher erschien die Entwicklung einer Back-App, welche besonders die Zielgruppe der Back-Anfänger unterstützt, eine sinnvolle Herangehensweise.

Herangehensweise

Unter Anwendung des Human-Centered Design Process wurden User Research durchgeführt, die Bedürfnisse der Zielgruppe analysiert, Personas und User Journeys entworfen und Gestaltungslösungen erarbeitet sowie im Rahmen von Usability Tests getestet. Des Weiteren wurden im Vorhinein vier Wettbewerber-Apps analysiert, um die aktuelle Wettbewerbssituation auf dem Markt zu kennen.

Personas

Auf Basis der gewonnenen Erkenntnisse aus Shadowings, in welchen vier Testpersonen jeweils in ihrer heimischen Küche beim Ausführen eines Backrezepts beobachtet wurden, und anschließend geführten Interviews, wurden zwei Personas entwickelt. Diese repräsentieren die Zielgruppe.

User Journey

Im Anschluss wurde eine IST-User Journey Map erstellt, welche aktuelle Abläufe der Persona Lilly Weigert vor während und nach dem Backen aufzeigt, sowie ihre emotionale Verfassung und ihre Touchpoints.

Nutzerbedürfnisse

Auf Basis der vorangegangenen Nutzerforschung wurden acht zentrale Nutzerbedürfnisse der Zielgruppe erarbeitet.

Anleitung
Unterhaltung
Übersichtlichkeit
Visuelle Attraktivität
Effizienz
Inspiration
Individualisierbarkeit
Planbarkeit

Konzeption

Anschließend wurden die Systemanforderungen sowie eine SOLL-User Journey ausgearbeitet. Außerdem wurde die Informationsarchitektur der App als Flow-Chart erarbeitet, um daraufhin auf Grundlage dessen erste Papier-Scribbles entwickeln zu können.

Nachdem entschieden wurde, welche Entwürfe im anschließend erarbeiteten Prototyp weiterverfolgt werden sollen, wurde mit der Ausarbeitung eines klickbaren Low-Fidelity Prototyps begonnen. Dieser wurde danach im Rahmen von Usability Tests auf einem Mobilgerät von vier Testpersonen getestet.

Gestaltung

Unter Berücksichtigung der Ergebnisse der Low-Fidelity Usability Tests wurde der Prototyp zu einem High-Fidelity Prototyp weiterentwickelt. Hierfür wurden Farben, Formen, Typografie, Icon- und Bildwelt definiert sowie Illustrationen angefertigt.

Zunächst erhalten die Nutzenden eine kurze Einführung in die wichtigsten Funktionen der App. Nach der Erstellung eines Nutzungskontos, werden sie weitergeleitet zur Anpassung der persönlichen Filtereinstellungen, um ab der ersten Nutzung nur Rezept-Ergebnisse angezeigt zu bekommen, die die persönlichen Back-Fähigkeiten, die Ernährungsweise sowie eventuelle Unverträglichkeiten berücksichtigen.

Backtorial-Filtereinstellungen-Ernährungsweise

Backtorial-Filtereinstellungen-Intoleranzen

Auf der Home-Seite werden verschiedene Rezept-Kategorien ausgespielt sowie weitere themenbezogene Rezepte-Slider. Auf jeder Rezept-Vorschau befindet sich eine Angabe zur Zubereitungsdauer und dem Schwierigkeitsgrad eines Rezepts sowie die Möglichkeit, es zu favorisieren und zu einem Kochbuch hinzuzufügen.

Des Weiteren können die Rezepte gefiltert werden. Innerhalb der Kategorien können die Ergebnisse noch einmal feiner gefiltert werden.

Ein Rezept beinhaltet jeweils eine Möglichkeit, es zu bewerten und kommentieren, einen kurzen Einleitungstext, Angaben zum zeitlichen Aufwand, eine Toolliste und die Möglichkeit, persönliche Notizen zu speichern. Außerdem kann die Zutatenmenge vervielfacht oder auf die eigene Backformgröße umgerechnet werden. Die Zutaten können zur Einkaufsliste hinzugefügt und es können Alternativvorschläge eingesehen werden. Darunter befindet sich eine schriftliche Zubereitungsanleitung.

Wird der Backmodus innerhalb eines Rezepts gestartet, öffnet sich eine Schritt-für-Schritt-Anleitung, welche pro Schritt einen Video-Clip, eine Toolliste, eine Zutatenliste sowie eine knappe schriftliche Zubereitungsanleitung enthält. In der Video-Anleitung wird anschaulich und detailliert, jedoch dennoch nicht ausschweifend die Zubereitung gezeigt und gleichzeitig Tipps für Anfänger genannt. Befindet sich in der schriftlichen Anleitung eine Zeitangabe, kann an dieser Stelle ein Timer innerhalb der App gestellt werden.

Des Weiteren gibt es eine Suchfunktion, innerhalb welcher zusätzlich gefiltert werden kann. Unter „Favoriten“ können alle favorisierten Rezepte, wahlweise sortiert nach Kochbüchern, angesehen werden und in der Einkaufsliste befinden sich alle zur Einkaufsliste hinzugefügten Zutaten. Diese können entweder innerhalb der jeweiligen Einkaufsliste oder unter „Alle Zutaten“ gefunden werden. Zu jeder Einkaufsliste können individuell Zutaten hinzugefügt werden.

Außerdem können im Menüpunkt „Profil“ verschiedene Einstellungen angepasst werden.

Auch der High-Fidelity Prototyp wurde im Rahmen von insgesamt fünf Usability Tests getestet.

Der High-Fidelity Prototyp kann hier abgerufen werden.

Fazit

Die Usability der App kann durch Heranziehen von verschiedenen Richtlinien zur Gebrauchstauglichkeit und Nielsens Heuristiken für gelungenes Interaktionsdesign als hoch eingestuft werden. Der High-Fidelity Prototyp erfüllte darüber hinaus die acht identifizierten Nutzerbedürfnisse.

Zur User Experience können keine endgültigen Aussagen getroffen werden, da durch die Usability Tests nur die Phase der tatsächlichen Nutzung analysiert werden konnte. Über die antizipierte und die verarbeitete Nutzung des interaktiven Systems können keine Schlüsse gezogen werden.

Die App Backtorial vereint die Vorteile von Print-Rezepten mit jenen von Video-Anleitungen und wurde mit weiteren Elementen sublimiert, die den gesamten Prozess rund um das Backen planbar und überschaubar machen.