FlavorFusion Landingpage -
UI Konzept & Design

Im Rahmen des UX/UI-Boot Camps entwickelte ich eine Landingpage für die fiktive Koch-App FlavorFusion. Ziel war es, Menschen zu motivieren, die App herunterzuladen.

FlavorFusion macht Kochen zu Hause einfacher und angenehmer – mit einer großen Auswahl köstlicher Rezepte und personalisierten Empfehlungen.

Die Herausforderung: FlavorFusion Launch-Landingpage

Unternehmensziel: Gestaltung einer High-Converting Landingpage für den Launch der Rezept-App «FlavorFusion».

Kernherausforderung: Der Markt ist gesättigt. Es musste eine Landingpage entwickelt werden, die den zentralen Mehrwert von FlavorFusion – kreatives, abwechslungsreiches Kochen und die Reduzierung von Food Waste – klar und überzeugend kommuniziert. Das Endziel war, App-Downloads zu generieren, was eine starke Conversion-Optimierung im Design erforderte.

Der Strategische Ansatz:  Die Persona & Das Ziel

Um die Conversion-Ziele zu erfüllen, wurde der Fokus auf den  «Kreativen Restehelden» Peter Muffin gelegt. 

Die Persona: Peter Muffin ist ein kochbegeisterter Flexitarier, der im Alltag oft  mit Lebensmittelresten und fehlender schneller Inspiration kämpft (Pain Point).  Er ist praktisch veranlagt und sucht eine Lösung, die seine Nachhaltigkeitswerte unterstützt, aber dennoch locker und inspirierend ist.

Design-Prinzipien (Die Vision): Meine Design-Entscheidungen  basierten auf diesen drei Leitprinzipien:

Emotionaler Minimalismus: Visuell appetitlich und ansprechend,  aber ohne Ablenkung vom Kernthema Nutzwert. 
Alltagsnah & Adaptiv: Der Fokus liegt auf der schnellen  Lösungsfindung und einem vollständig responsiven Layout. 
Kulinarische Neugier wecken: Einsatz von Bildern und Texten,  die das Fusion-Food-Thema greifbar machen.

Die Kernfrage (How Might We): Wie gestalte ich die Landingpage so, dass sie sofort zum Download einlädt?

Visuelles Design & UI-Entscheidungen

Die Ästhetik sollte die Verschmelzung von Tradition und Innovation widerspiegeln und dabei appetitlich wirken.

Farbpalette und Emotion:

Ich wählte eine dunkle, elegante Grundfarbe (Dunkelblau/Nachtblau) im Kontrast zu warmen, appetitlichen Akzentfarben (Gold-Gelb/Orange). Das Dunkelblau vermittelt Professionalität und setzt die leuchtenden Food-Bilder in Szene, während die warme Akzentfarbe die kulinarische Leidenschaft emotionalisiert.

Konsistenz (Design System):

Ich erstellte ein kleines, konsistentes Design System in Figma, um die Wiederverwendbarkeit zu gewährleisten. Dazu gehörten einheitliche Call-to-Action-Buttons, eine klare Typografie-Hierarchie und appetitliche Piktogramme in der Akzentfarbe.

Heading

Body Text

Informationsarchitektur & Wireframing

Informations-architektur & Wireframing

Um die Conversion-Ziele zu erfüllen, folgt die Landingpage einem logischen Storytelling-Flow:
Problem – Lösung – Beweis – Aktion.

Layout-Entscheidungen:

Hero-Bereich: Direkte Ansprache des Kernproblems («Weniger Food Waste») und dominanter Download-CTA sofort «Above the Fold».

Die Headline ist kurz, prägnant und löst sofort das Problem des Nutzers. Die Kombination aus lebendigen Food-Visuals und der modernen App-UI vermittelt das Gefühl von Kreativität und Einfachheit.

Wichtige Features: Präsentation der App-Funktionen als konkrete Vorteile (z.B. «Intuitive App»), um den Alltagsnutzen zu zeigen.

Alleinstellungsmerkmal (USP): Der KI-Rezept-Generator ist zentral platziert. Die Kommunikation fokussiert auf die Lösung für Food Waste, indem kreative Rezepte aus vorhandenen Lebensmittelresten generiert werden.

Conversion-Optimierung: Testimonials (Social Proof) sind strategisch vor dem abschließenden Download-CTA positioniert, um Glaubwürdigkeit aufzubauen und den Nutzer zur finalen Aktion zu führen.

Leistungen:

UI/UX Design (Konzeptentwicklung, User Research, Informationsarchitektur, Visuelles Design, Prototyping und Aufbau eines responsiven Layouts).