Ideate
Beobachten, wie angebrochene Zutaten nach Partys ungenutzt bleiben, und daraus einen konkreten Anwendungsfall entwickeln.
ALL WorkWasted App – Case Study
Eine spielerische Cocktail-App, die vorhandene Zutaten in passende Rezeptideen übersetzt und Resteverwertung mit einem einfachen, visuellen Nutzungserlebnis verbindet.
01 / Context
Context
Nach Partys bleiben häufig angebrochene Flaschen, Mixer und weitere Zutaten übrig. Vielen jungen Menschen fehlt eine schnelle und unkomplizierte Idee, wie daraus neue Cocktails entstehen können.
Wasted verbindet Resteverwertung mit Rezeptinspiration und macht aus bereits vorhandenen Zutaten den direkten Ausgangspunkt für ein spielerisches digitales Erlebnis.
Make it simple enough to use when attention is limited.
02 / Challenge
The challenge
Die Anwendung sollte eine beliebige Auswahl vorhandener Zutaten schnell in passende und verständlich dargestellte Cocktailrezepte übersetzen.
Die Bedienung musste auch dann intuitiv bleiben, wenn Zeit und Aufmerksamkeit begrenzt sind. Gleichzeitig sollte die visuelle Gestaltung eigenständig wirken und Orientierung bieten.
03 / PROCESS
From a simple observation to an interactive concept.
Aus der Beobachtung ungenutzter Alkoholreste entstand die Idee, Resteverwertung und kreatives Cocktailmixen zu verbinden. Erste Skizzen und Low-Fidelity-Wireframes halfen, Einstieg, Zutatenauswahl und Rezeptlogik zu strukturieren.
Anschliessend wurden unterschiedliche Layouts, Farbwelten und Illustrationsstile erprobt. Über Mid- und High-Fidelity-Wireframes entwickelte sich daraus eine eigenständige Designsprache und ein interaktiver Prototyp.
Structure
Den Weg von der vorhandenen Zutat zum passenden Cocktailrezept auf wenige verständliche Schritte reduzieren.
Design
Unterschiedliche Stilrichtungen, Layouts und Farbwelten von Low- bis High-Fidelity untersuchen und zu einer eigenständigen Designsprache verdichten.
Prototype
Interaktionen, Übergänge und Rezeptabläufe in einem klickbaren Prototyp umsetzen und unter realitätsnahen Bedingungen überprüfen.
04 / FEATURE — STYLE EXPLORATION
From low fidelity to a distinct visual style.
Von reduzierten Wireframes bis zum ausgearbeiteten Interface wurden unterschiedliche Layouts und Stilrichtungen erprobt. So entstand schrittweise eine visuelle Sprache, die Orientierung und spielerischen Charakter verbindet.
Low-fidelity structure
Reduzierte Wireframes klärten den grundlegenden Ablauf von der Zutatenauswahl bis zum passenden Rezept.
Visual exploration
Verschiedene Layouts, Farbwelten und Stilrichtungen wurden verglichen, kombiniert und gezielt weiterentwickelt.
High-fidelity direction
Das finale Interface verbindet eine klare Nutzerführung mit einer eigenständigen, spielerischen visuellen Sprache.
05 / FEATURE — VISUAL GUIDANCE
Icons instead of unnecessary complexity.
Ein eigens entwickeltes Icon-System macht Zutaten, Kategorien und Rezepte schnell erfassbar und prägt den eigenständigen Charakter der App.
DESIGN PRINCIPLE
Make it simple enough to use when attention is limited.
06 / FEATURE — MOTION
A playful and responsive experience.
Animationen und Übergänge verbinden Zutatenauswahl, Rezeptvorschläge und einzelne Zubereitungsschritte zu einem flüssigen, responsiven Nutzungserlebnis.
Motion
Gezielte Übergänge machen Wechsel zwischen Zutatenauswahl, Rezeptvorschlag und Zubereitungsschritten nachvollziehbar.
Playful feedback
Spielerische Animationen geben direktes Feedback und verleihen dem Interface einen lebendigen, charakteristischen Ausdruck.
Realistic prototype
Der Proto.io-Prototyp bildet zentrale Interaktionen und Rezeptabläufe realitätsnah ab und macht das Nutzungskonzept erlebbar.
07 / Feature – User Journey
A walkthrough of the complete user journey.
07 / OUTCOME
Turning leftovers into new possibilities.
Der funktionale Prototyp zeigt, wie aus einer alltäglichen Beobachtung ein eigenständiges digitales Produkt entstehen kann. Klare Abläufe, eine prägnante Bildsprache und spielerische Interaktionen machen vorhandene Zutaten unmittelbar nutzbar.
Der funktionale Prototyp verbindet Resteverwertung, Cocktailinspiration und eine eigenständige visuelle Identität. Die gezeigten Rezeptansichten und Interaktionen führen schnell von vorhandenen Zutaten zu einer konkreten Idee.
Ideation
Information Architecture
Wireframing
Prototyping
Branding
Illustration
Interaction Design