Motion Design • Video Produktion • Prototyping

Motion Design • Video Produktion • Prototyping

Motion Design • Video Produktion • Prototyping

Motion Design • Video Produktion • Prototyping

PANTRY APP KONZEPT & VIDEO

PANTRY APP KONZEPT & VIDEO

PANTRY APP KONZEPT & VIDEO

PANTRY APP KONZEPT & VIDEO

12.07.2022

12.07.2022

12.07.2022

12.07.2022

Pantry Scanner Screen Mockup
Pantry Scanner Screen Mockup
Pantry Scanner Screen Mockup
Pantry Planer Screen Mockup
Pantry Planer Screen Mockup
Pantry Planer Screen Mockup
Pantry Rezepte Screen Mockup
Pantry Rezepte Screen Mockup
Pantry Rezepte Screen Mockup

Abstrakt

Im Rahmen dieses Projekts wurde das App Konzept »Pantry« als Küchenassistent entwickelt. Das Tool dient der vereinfachten Verwaltung von Lebensmitteln, Einkaufslisten und Rezeptvorschlägen. Die Applikation zielt darauf ab, Nutzern zu helfen, Lebensmittelverschwendung zu reduzieren und den Prozess der Essensplanung in Haushalten, wie beispielsweise in Wohngemeinschaften oder Familien, zu optimieren.

Kunde/Auftraggeber:

Dieses Konzept wurde an der Rheinischen Hochschule Köln unter der Betreuung von Professorin Karen Nennen entwickelt.

Teammitglieder:

Claudia Schulte, Marvin Helbig und Luca Kluger.

Meine Rolle:

In diesem Projekt war ich neben der Beteiligung an der Konzeption und Planung, für die Erstellung des Corporate Designs, das Prototyping und die Erstellung des Produktvorstellungsvideos verantwortlich, das die Kernfunktionen und das Design der App präsentiert.

Verwendete Programme:
  • Adobe Illustrator: für Logo, Icons, Grafikelemente und Screendesigns

  • Adobe XD: zur Umsetzung des interaktiven Prototyps

  • Adobe After Effects und Premiere: für die Erstellung des Produktvideos

Konzept

Die Pantry-App unterstützt Sie bei der Essensplanung und der Vorratspflege und fördert dabei Nachhaltigkeit. Die App bietet Ihnen Rezeptvorschläge basierend auf Ihren vorhandenen Lebensmitteln und eine Gruppenfunktion für WGs und Familien. So können Sie effizienter planen und vermeiden unnötiges Wegwerfen von Lebensmitteln. Die App beinhaltet zudem eine Scan-Funktion, mit der Sie Rechnungen oder Produkte schnell in den Vorrat übernehmen können, um einen aktuellen Überblick zu bewahren.

Ziel der App:
  • Reduzierung von Lebensmittelverschwendung durch gezielte Planung und Vorratsübersicht

  • Vereinfachung der Essensplanung in Gruppen (WGs/Familien)

  • Steigerung der Nutzerfreundlichkeit durch ein intuitives Design

Prozess

Problemdefinition und Ideenfindung

Nach intensiver Teamdiskussion haben wir uns auf das Thema Lebensmittelverschwendung und die damit verbundenen Herausforderungen bei der Vorratsverwaltung in privaten Haushalten als Schwerpunkt festgelegt. Ziel war die Entwicklung einer App, die Haushalten dabei hilft, Lebensmittel effizienter zu nutzen und den Überblick über Vorräte und Rezepte zu behalten.

Research und Analyse

Im Rahmen einer ersten Recherchephase haben wir die Lebensmittelverschwendung in Deutschland analysiert. Dabei haben wir festgestellt, dass jährlich pro Kopf etwa 55 kg an Lebensmitteln weggeworfen werden. Zudem führten wir eine Mitbewerberanalyse durch, bei der wir bestehende Apps zur Vorratsverwaltung untersuchten, um herauszufinden, welche Funktionen in der Pantry-App innovative Mehrwerte schaffen könnten.

Designentscheidungen

Unser Designfokus lag auf der Schaffung einer intuitiven Benutzeroberfläche, die sowohl funktional als auch optisch ansprechend ist. Im Verlauf des Designprozesses wurden unter anderem folgende Entscheidungen getroffen:

  • Farbpalette: Um ein frisches und nachhaltiges Image zu vermitteln, wurde eine Farbpalette gewählt, die auf einer Mischung aus aktiven Orange- und Gelbtönen in Kombination mit Grüntönen basiert, die sich an der Natur orientieren. Die daraus resultierende Farbmischung erinnert an einen frischen Salat und greift gleichzeitig die Themen »Natur« und »Nachhaltigkeit« auf.

  • Form / Bildwelt: Die Formenwelt zeichnet sich durch eine runde und organische Linienführung aus, die eine harmonische Gesamtästhetik schafft und dabei einen Bezug zur aus organischen Linien bestehenden Natur herstellt. Dieser Bezug wird durch die Bildwelt, welche auf natürlichen, frischen und authentischen Fotografien basiert, noch zusätzlich unterstrichen.

  • Benutzerführung: Die Hauptnavigation ist bewusst einfach gehalten, um den Nutzern die Übersicht über Funktionen wie Vorratsverwaltung, Rezepte und Einkaufsliste zu erleichtern. Um die verschiedenen Funktionen sowohl textlich als auch bildlich zu verdeutlichen, wurden Labels und Icons verwendet.

  • Icons und Typografie: Die Icons wurden klar und leicht erkennbar gestaltet, um die Benutzerfreundlichkeit zu maximieren. Für die Schriftwahl wurde eine Kombination aus einer geschwungenen und organischen Handschrift in Form der Bello Script Pro für Headlines und einer klaren und gut lesbaren geometrischen Groteskschrift in Form der Raleway gewählt.

  • Logo: Das Logo stellt eine Wort-Bild-Marke dar, bei der die Bildmarke in Form einer Gabel in die Punze der Initiale des Wortes »Pantry« eingelassen ist. Die Gabel verleiht dem Logo einen klaren Bezug zum Thema Essen und Lebensmittel. Die Verwendung einer organischen Handschrift sowie die grüne Farbgebung unterstreichen den persönlichen und nachhaltigen Charakter der App. Das Logo kann sowohl in ausgeschriebener Form als auch lediglich mit der Initiale als Favicon eingesetzt werden, was sich optimal für ein App-Icon eignet.

Prototyping und Usability-Tests

Der erste interaktive Prototyp wurde in Adobe XD erstellt, wobei der Fokus auf den Kernfunktionen lag: Vorratshaltung, Rezeptvorschläge, Einkaufsliste und Abstimmung in Gruppen. Nach der ersten Version führten wir Usability-Tests mit fünf Testpersonen aus unserer Zielgruppe durch. Die Tester gaben uns wertvolles Feedback zur Navigation und Funktionalität. Basierend auf den Ergebnissen wurden Anpassungen vorgenommen, um die Nutzerfreundlichkeit weiter zu verbessern. So wurde etwa die Scan-Funktion für Vorratsgegenstände optimiert, um den Aufwand für die Dateneingabe zu minimieren. Darüber hinaus erstellten wir basierend auf unseren Erkenntnissen eine Pattern Library, die die Bausteine unseres High-Fidelity-Prototyps nach der Theorie des Atomic Designs zusammenfasst. In der Folge gelang es uns, einen High-Fidelity-Prototypen zu realisieren, der die Funktionen der App interaktiv darstellt.

Videoproduktion

Um das Konzept und die Funktionen der Pantry-App überzeugend darzustellen, wurde ein Produktvorstellungsvideo produziert. Das Video verfolgt den Zweck, die App und deren Features anschaulich und ansprechend zu präsentieren.

  • Skript und Storyboard: Zunächst wurde ein Storyboard und ein Skript entwickelt, das die Benutzer durch die wichtigsten Funktionen der App führt – vom Anlegen eines Vorrats bis hin zur Abstimmung auf ein Rezept.

  • Visualisierungen und Animationen: In Adobe After Effects erstellte ich animierte Darstellungen der App-Screens, die in eine flüssige Erzählung eingebettet wurden. Eine besondere Herausforderung bestand darin, durch spannende und abwechslungsreiche Animationen und Übergänge die Aufmerksamkeit der Zuschauer aufrechtzuerhalten.

  • Audio und Musik: Das Video wurde mit einem klaren Voice-over ergänzt, das die einzelnen Funktionen erklärt. Begleitet wird es von Hintergrundmusik, die eine einladende Atmosphäre schafft.

Fertigstellung und Präsentation

Nach Abschluss des Designs und der Videoproduktion präsentierten wir die Pantry-App dem Auftraggeber. Das Projekt wurde dabei sehr positiv aufgenommen, insbesondere das klare Design und die durchdachte Benutzerführung stießen auf große Zustimmung. Das Produktvideo verhalf der App zu einem lebendigen und verständlichen Gesamtbild, das den Nutzen und die Vielseitigkeit der Pantry-App anschaulich darstellte.

Abstrakt

Im Rahmen dieses Projekts wurde das App Konzept »Pantry« als Küchenassistent entwickelt. Das Tool dient der vereinfachten Verwaltung von Lebensmitteln, Einkaufslisten und Rezeptvorschlägen. Die Applikation zielt darauf ab, Nutzern zu helfen, Lebensmittelverschwendung zu reduzieren und den Prozess der Essensplanung in Haushalten, wie beispielsweise in Wohngemeinschaften oder Familien, zu optimieren.

Kunde/Auftraggeber:

Dieses Konzept wurde an der Rheinischen Hochschule Köln unter der Betreuung von Professorin Karen Nennen entwickelt.

Teammitglieder:

Claudia Schulte, Marvin Helbig und Luca Kluger.

Meine Rolle:

In diesem Projekt war ich neben der Beteiligung an der Konzeption und Planung, für die Erstellung des Corporate Designs, das Prototyping und die Erstellung des Produktvorstellungsvideos verantwortlich, das die Kernfunktionen und das Design der App präsentiert.

Verwendete Programme:
  • Adobe Illustrator: für Logo, Icons, Grafikelemente und Screendesigns

  • Adobe XD: zur Umsetzung des interaktiven Prototyps

  • Adobe After Effects und Premiere: für die Erstellung des Produktvideos

Konzept

Die Pantry-App unterstützt Sie bei der Essensplanung und der Vorratspflege und fördert dabei Nachhaltigkeit. Die App bietet Ihnen Rezeptvorschläge basierend auf Ihren vorhandenen Lebensmitteln und eine Gruppenfunktion für WGs und Familien. So können Sie effizienter planen und vermeiden unnötiges Wegwerfen von Lebensmitteln. Die App beinhaltet zudem eine Scan-Funktion, mit der Sie Rechnungen oder Produkte schnell in den Vorrat übernehmen können, um einen aktuellen Überblick zu bewahren.

Ziel der App:
  • Reduzierung von Lebensmittelverschwendung durch gezielte Planung und Vorratsübersicht

  • Vereinfachung der Essensplanung in Gruppen (WGs/Familien)

  • Steigerung der Nutzerfreundlichkeit durch ein intuitives Design

Prozess

Problemdefinition und Ideenfindung

Nach intensiver Teamdiskussion haben wir uns auf das Thema Lebensmittelverschwendung und die damit verbundenen Herausforderungen bei der Vorratsverwaltung in privaten Haushalten als Schwerpunkt festgelegt. Ziel war die Entwicklung einer App, die Haushalten dabei hilft, Lebensmittel effizienter zu nutzen und den Überblick über Vorräte und Rezepte zu behalten.

Research und Analyse

Im Rahmen einer ersten Recherchephase haben wir die Lebensmittelverschwendung in Deutschland analysiert. Dabei haben wir festgestellt, dass jährlich pro Kopf etwa 55 kg an Lebensmitteln weggeworfen werden. Zudem führten wir eine Mitbewerberanalyse durch, bei der wir bestehende Apps zur Vorratsverwaltung untersuchten, um herauszufinden, welche Funktionen in der Pantry-App innovative Mehrwerte schaffen könnten.

Designentscheidungen

Unser Designfokus lag auf der Schaffung einer intuitiven Benutzeroberfläche, die sowohl funktional als auch optisch ansprechend ist. Im Verlauf des Designprozesses wurden unter anderem folgende Entscheidungen getroffen:

  • Farbpalette: Um ein frisches und nachhaltiges Image zu vermitteln, wurde eine Farbpalette gewählt, die auf einer Mischung aus aktiven Orange- und Gelbtönen in Kombination mit Grüntönen basiert, die sich an der Natur orientieren. Die daraus resultierende Farbmischung erinnert an einen frischen Salat und greift gleichzeitig die Themen »Natur« und »Nachhaltigkeit« auf.

  • Form / Bildwelt: Die Formenwelt zeichnet sich durch eine runde und organische Linienführung aus, die eine harmonische Gesamtästhetik schafft und dabei einen Bezug zur aus organischen Linien bestehenden Natur herstellt. Dieser Bezug wird durch die Bildwelt, welche auf natürlichen, frischen und authentischen Fotografien basiert, noch zusätzlich unterstrichen.

  • Benutzerführung: Die Hauptnavigation ist bewusst einfach gehalten, um den Nutzern die Übersicht über Funktionen wie Vorratsverwaltung, Rezepte und Einkaufsliste zu erleichtern. Um die verschiedenen Funktionen sowohl textlich als auch bildlich zu verdeutlichen, wurden Labels und Icons verwendet.

  • Icons und Typografie: Die Icons wurden klar und leicht erkennbar gestaltet, um die Benutzerfreundlichkeit zu maximieren. Für die Schriftwahl wurde eine Kombination aus einer geschwungenen und organischen Handschrift in Form der Bello Script Pro für Headlines und einer klaren und gut lesbaren geometrischen Groteskschrift in Form der Raleway gewählt.

  • Logo: Das Logo stellt eine Wort-Bild-Marke dar, bei der die Bildmarke in Form einer Gabel in die Punze der Initiale des Wortes »Pantry« eingelassen ist. Die Gabel verleiht dem Logo einen klaren Bezug zum Thema Essen und Lebensmittel. Die Verwendung einer organischen Handschrift sowie die grüne Farbgebung unterstreichen den persönlichen und nachhaltigen Charakter der App. Das Logo kann sowohl in ausgeschriebener Form als auch lediglich mit der Initiale als Favicon eingesetzt werden, was sich optimal für ein App-Icon eignet.

Prototyping und Usability-Tests

Der erste interaktive Prototyp wurde in Adobe XD erstellt, wobei der Fokus auf den Kernfunktionen lag: Vorratshaltung, Rezeptvorschläge, Einkaufsliste und Abstimmung in Gruppen. Nach der ersten Version führten wir Usability-Tests mit fünf Testpersonen aus unserer Zielgruppe durch. Die Tester gaben uns wertvolles Feedback zur Navigation und Funktionalität. Basierend auf den Ergebnissen wurden Anpassungen vorgenommen, um die Nutzerfreundlichkeit weiter zu verbessern. So wurde etwa die Scan-Funktion für Vorratsgegenstände optimiert, um den Aufwand für die Dateneingabe zu minimieren. Darüber hinaus erstellten wir basierend auf unseren Erkenntnissen eine Pattern Library, die die Bausteine unseres High-Fidelity-Prototyps nach der Theorie des Atomic Designs zusammenfasst. In der Folge gelang es uns, einen High-Fidelity-Prototypen zu realisieren, der die Funktionen der App interaktiv darstellt.

Videoproduktion

Um das Konzept und die Funktionen der Pantry-App überzeugend darzustellen, wurde ein Produktvorstellungsvideo produziert. Das Video verfolgt den Zweck, die App und deren Features anschaulich und ansprechend zu präsentieren.

  • Skript und Storyboard: Zunächst wurde ein Storyboard und ein Skript entwickelt, das die Benutzer durch die wichtigsten Funktionen der App führt – vom Anlegen eines Vorrats bis hin zur Abstimmung auf ein Rezept.

  • Visualisierungen und Animationen: In Adobe After Effects erstellte ich animierte Darstellungen der App-Screens, die in eine flüssige Erzählung eingebettet wurden. Eine besondere Herausforderung bestand darin, durch spannende und abwechslungsreiche Animationen und Übergänge die Aufmerksamkeit der Zuschauer aufrechtzuerhalten.

  • Audio und Musik: Das Video wurde mit einem klaren Voice-over ergänzt, das die einzelnen Funktionen erklärt. Begleitet wird es von Hintergrundmusik, die eine einladende Atmosphäre schafft.

Fertigstellung und Präsentation

Nach Abschluss des Designs und der Videoproduktion präsentierten wir die Pantry-App dem Auftraggeber. Das Projekt wurde dabei sehr positiv aufgenommen, insbesondere das klare Design und die durchdachte Benutzerführung stießen auf große Zustimmung. Das Produktvideo verhalf der App zu einem lebendigen und verständlichen Gesamtbild, das den Nutzen und die Vielseitigkeit der Pantry-App anschaulich darstellte.

Abstrakt

Im Rahmen dieses Projekts wurde das App Konzept »Pantry« als Küchenassistent entwickelt. Das Tool dient der vereinfachten Verwaltung von Lebensmitteln, Einkaufslisten und Rezeptvorschlägen. Die Applikation zielt darauf ab, Nutzern zu helfen, Lebensmittelverschwendung zu reduzieren und den Prozess der Essensplanung in Haushalten, wie beispielsweise in Wohngemeinschaften oder Familien, zu optimieren.

Kunde/Auftraggeber:

Dieses Konzept wurde an der Rheinischen Hochschule Köln unter der Betreuung von Professorin Karen Nennen entwickelt.

Teammitglieder:

Claudia Schulte, Marvin Helbig und Luca Kluger.

Meine Rolle:

In diesem Projekt war ich neben der Beteiligung an der Konzeption und Planung, für die Erstellung des Corporate Designs, das Prototyping und die Erstellung des Produktvorstellungsvideos verantwortlich, das die Kernfunktionen und das Design der App präsentiert.

Verwendete Programme:
  • Adobe Illustrator: für Logo, Icons, Grafikelemente und Screendesigns

  • Adobe XD: zur Umsetzung des interaktiven Prototyps

  • Adobe After Effects und Premiere: für die Erstellung des Produktvideos

Konzept

Die Pantry-App unterstützt Sie bei der Essensplanung und der Vorratspflege und fördert dabei Nachhaltigkeit. Die App bietet Ihnen Rezeptvorschläge basierend auf Ihren vorhandenen Lebensmitteln und eine Gruppenfunktion für WGs und Familien. So können Sie effizienter planen und vermeiden unnötiges Wegwerfen von Lebensmitteln. Die App beinhaltet zudem eine Scan-Funktion, mit der Sie Rechnungen oder Produkte schnell in den Vorrat übernehmen können, um einen aktuellen Überblick zu bewahren.

Ziel der App:
  • Reduzierung von Lebensmittelverschwendung durch gezielte Planung und Vorratsübersicht

  • Vereinfachung der Essensplanung in Gruppen (WGs/Familien)

  • Steigerung der Nutzerfreundlichkeit durch ein intuitives Design

Prozess

Problemdefinition und Ideenfindung

Nach intensiver Teamdiskussion haben wir uns auf das Thema Lebensmittelverschwendung und die damit verbundenen Herausforderungen bei der Vorratsverwaltung in privaten Haushalten als Schwerpunkt festgelegt. Ziel war die Entwicklung einer App, die Haushalten dabei hilft, Lebensmittel effizienter zu nutzen und den Überblick über Vorräte und Rezepte zu behalten.

Research und Analyse

Im Rahmen einer ersten Recherchephase haben wir die Lebensmittelverschwendung in Deutschland analysiert. Dabei haben wir festgestellt, dass jährlich pro Kopf etwa 55 kg an Lebensmitteln weggeworfen werden. Zudem führten wir eine Mitbewerberanalyse durch, bei der wir bestehende Apps zur Vorratsverwaltung untersuchten, um herauszufinden, welche Funktionen in der Pantry-App innovative Mehrwerte schaffen könnten.

Designentscheidungen

Unser Designfokus lag auf der Schaffung einer intuitiven Benutzeroberfläche, die sowohl funktional als auch optisch ansprechend ist. Im Verlauf des Designprozesses wurden unter anderem folgende Entscheidungen getroffen:

  • Farbpalette: Um ein frisches und nachhaltiges Image zu vermitteln, wurde eine Farbpalette gewählt, die auf einer Mischung aus aktiven Orange- und Gelbtönen in Kombination mit Grüntönen basiert, die sich an der Natur orientieren. Die daraus resultierende Farbmischung erinnert an einen frischen Salat und greift gleichzeitig die Themen »Natur« und »Nachhaltigkeit« auf.

  • Form / Bildwelt: Die Formenwelt zeichnet sich durch eine runde und organische Linienführung aus, die eine harmonische Gesamtästhetik schafft und dabei einen Bezug zur aus organischen Linien bestehenden Natur herstellt. Dieser Bezug wird durch die Bildwelt, welche auf natürlichen, frischen und authentischen Fotografien basiert, noch zusätzlich unterstrichen.

  • Benutzerführung: Die Hauptnavigation ist bewusst einfach gehalten, um den Nutzern die Übersicht über Funktionen wie Vorratsverwaltung, Rezepte und Einkaufsliste zu erleichtern. Um die verschiedenen Funktionen sowohl textlich als auch bildlich zu verdeutlichen, wurden Labels und Icons verwendet.

  • Icons und Typografie: Die Icons wurden klar und leicht erkennbar gestaltet, um die Benutzerfreundlichkeit zu maximieren. Für die Schriftwahl wurde eine Kombination aus einer geschwungenen und organischen Handschrift in Form der Bello Script Pro für Headlines und einer klaren und gut lesbaren geometrischen Groteskschrift in Form der Raleway gewählt.

  • Logo: Das Logo stellt eine Wort-Bild-Marke dar, bei der die Bildmarke in Form einer Gabel in die Punze der Initiale des Wortes »Pantry« eingelassen ist. Die Gabel verleiht dem Logo einen klaren Bezug zum Thema Essen und Lebensmittel. Die Verwendung einer organischen Handschrift sowie die grüne Farbgebung unterstreichen den persönlichen und nachhaltigen Charakter der App. Das Logo kann sowohl in ausgeschriebener Form als auch lediglich mit der Initiale als Favicon eingesetzt werden, was sich optimal für ein App-Icon eignet.

Prototyping und Usability-Tests

Der erste interaktive Prototyp wurde in Adobe XD erstellt, wobei der Fokus auf den Kernfunktionen lag: Vorratshaltung, Rezeptvorschläge, Einkaufsliste und Abstimmung in Gruppen. Nach der ersten Version führten wir Usability-Tests mit fünf Testpersonen aus unserer Zielgruppe durch. Die Tester gaben uns wertvolles Feedback zur Navigation und Funktionalität. Basierend auf den Ergebnissen wurden Anpassungen vorgenommen, um die Nutzerfreundlichkeit weiter zu verbessern. So wurde etwa die Scan-Funktion für Vorratsgegenstände optimiert, um den Aufwand für die Dateneingabe zu minimieren. Darüber hinaus erstellten wir basierend auf unseren Erkenntnissen eine Pattern Library, die die Bausteine unseres High-Fidelity-Prototyps nach der Theorie des Atomic Designs zusammenfasst. In der Folge gelang es uns, einen High-Fidelity-Prototypen zu realisieren, der die Funktionen der App interaktiv darstellt.

Videoproduktion

Um das Konzept und die Funktionen der Pantry-App überzeugend darzustellen, wurde ein Produktvorstellungsvideo produziert. Das Video verfolgt den Zweck, die App und deren Features anschaulich und ansprechend zu präsentieren.

  • Skript und Storyboard: Zunächst wurde ein Storyboard und ein Skript entwickelt, das die Benutzer durch die wichtigsten Funktionen der App führt – vom Anlegen eines Vorrats bis hin zur Abstimmung auf ein Rezept.

  • Visualisierungen und Animationen: In Adobe After Effects erstellte ich animierte Darstellungen der App-Screens, die in eine flüssige Erzählung eingebettet wurden. Eine besondere Herausforderung bestand darin, durch spannende und abwechslungsreiche Animationen und Übergänge die Aufmerksamkeit der Zuschauer aufrechtzuerhalten.

  • Audio und Musik: Das Video wurde mit einem klaren Voice-over ergänzt, das die einzelnen Funktionen erklärt. Begleitet wird es von Hintergrundmusik, die eine einladende Atmosphäre schafft.

Fertigstellung und Präsentation

Nach Abschluss des Designs und der Videoproduktion präsentierten wir die Pantry-App dem Auftraggeber. Das Projekt wurde dabei sehr positiv aufgenommen, insbesondere das klare Design und die durchdachte Benutzerführung stießen auf große Zustimmung. Das Produktvideo verhalf der App zu einem lebendigen und verständlichen Gesamtbild, das den Nutzen und die Vielseitigkeit der Pantry-App anschaulich darstellte.

Abstrakt

Im Rahmen dieses Projekts wurde das App Konzept »Pantry« als Küchenassistent entwickelt. Das Tool dient der vereinfachten Verwaltung von Lebensmitteln, Einkaufslisten und Rezeptvorschlägen. Die Applikation zielt darauf ab, Nutzern zu helfen, Lebensmittelverschwendung zu reduzieren und den Prozess der Essensplanung in Haushalten, wie beispielsweise in Wohngemeinschaften oder Familien, zu optimieren.

Kunde/Auftraggeber:

Dieses Konzept wurde an der Rheinischen Hochschule Köln unter der Betreuung von Professorin Karen Nennen entwickelt.

Teammitglieder:

Claudia Schulte, Marvin Helbig und Luca Kluger.

Meine Rolle:

In diesem Projekt war ich neben der Beteiligung an der Konzeption und Planung, für die Erstellung des Corporate Designs, das Prototyping und die Erstellung des Produktvorstellungsvideos verantwortlich, das die Kernfunktionen und das Design der App präsentiert.

Verwendete Programme:
  • Adobe Illustrator: für Logo, Icons, Grafikelemente und Screendesigns

  • Adobe XD: zur Umsetzung des interaktiven Prototyps

  • Adobe After Effects und Premiere: für die Erstellung des Produktvideos

Konzept

Die Pantry-App unterstützt Sie bei der Essensplanung und der Vorratspflege und fördert dabei Nachhaltigkeit. Die App bietet Ihnen Rezeptvorschläge basierend auf Ihren vorhandenen Lebensmitteln und eine Gruppenfunktion für WGs und Familien. So können Sie effizienter planen und vermeiden unnötiges Wegwerfen von Lebensmitteln. Die App beinhaltet zudem eine Scan-Funktion, mit der Sie Rechnungen oder Produkte schnell in den Vorrat übernehmen können, um einen aktuellen Überblick zu bewahren.

Ziel der App:
  • Reduzierung von Lebensmittelverschwendung durch gezielte Planung und Vorratsübersicht

  • Vereinfachung der Essensplanung in Gruppen (WGs/Familien)

  • Steigerung der Nutzerfreundlichkeit durch ein intuitives Design

Prozess

Problemdefinition und Ideenfindung

Nach intensiver Teamdiskussion haben wir uns auf das Thema Lebensmittelverschwendung und die damit verbundenen Herausforderungen bei der Vorratsverwaltung in privaten Haushalten als Schwerpunkt festgelegt. Ziel war die Entwicklung einer App, die Haushalten dabei hilft, Lebensmittel effizienter zu nutzen und den Überblick über Vorräte und Rezepte zu behalten.

Research und Analyse

Im Rahmen einer ersten Recherchephase haben wir die Lebensmittelverschwendung in Deutschland analysiert. Dabei haben wir festgestellt, dass jährlich pro Kopf etwa 55 kg an Lebensmitteln weggeworfen werden. Zudem führten wir eine Mitbewerberanalyse durch, bei der wir bestehende Apps zur Vorratsverwaltung untersuchten, um herauszufinden, welche Funktionen in der Pantry-App innovative Mehrwerte schaffen könnten.

Designentscheidungen

Unser Designfokus lag auf der Schaffung einer intuitiven Benutzeroberfläche, die sowohl funktional als auch optisch ansprechend ist. Im Verlauf des Designprozesses wurden unter anderem folgende Entscheidungen getroffen:

  • Farbpalette: Um ein frisches und nachhaltiges Image zu vermitteln, wurde eine Farbpalette gewählt, die auf einer Mischung aus aktiven Orange- und Gelbtönen in Kombination mit Grüntönen basiert, die sich an der Natur orientieren. Die daraus resultierende Farbmischung erinnert an einen frischen Salat und greift gleichzeitig die Themen »Natur« und »Nachhaltigkeit« auf.

  • Form / Bildwelt: Die Formenwelt zeichnet sich durch eine runde und organische Linienführung aus, die eine harmonische Gesamtästhetik schafft und dabei einen Bezug zur aus organischen Linien bestehenden Natur herstellt. Dieser Bezug wird durch die Bildwelt, welche auf natürlichen, frischen und authentischen Fotografien basiert, noch zusätzlich unterstrichen.

  • Benutzerführung: Die Hauptnavigation ist bewusst einfach gehalten, um den Nutzern die Übersicht über Funktionen wie Vorratsverwaltung, Rezepte und Einkaufsliste zu erleichtern. Um die verschiedenen Funktionen sowohl textlich als auch bildlich zu verdeutlichen, wurden Labels und Icons verwendet.

  • Icons und Typografie: Die Icons wurden klar und leicht erkennbar gestaltet, um die Benutzerfreundlichkeit zu maximieren. Für die Schriftwahl wurde eine Kombination aus einer geschwungenen und organischen Handschrift in Form der Bello Script Pro für Headlines und einer klaren und gut lesbaren geometrischen Groteskschrift in Form der Raleway gewählt.

  • Logo: Das Logo stellt eine Wort-Bild-Marke dar, bei der die Bildmarke in Form einer Gabel in die Punze der Initiale des Wortes »Pantry« eingelassen ist. Die Gabel verleiht dem Logo einen klaren Bezug zum Thema Essen und Lebensmittel. Die Verwendung einer organischen Handschrift sowie die grüne Farbgebung unterstreichen den persönlichen und nachhaltigen Charakter der App. Das Logo kann sowohl in ausgeschriebener Form als auch lediglich mit der Initiale als Favicon eingesetzt werden, was sich optimal für ein App-Icon eignet.

Prototyping und Usability-Tests

Der erste interaktive Prototyp wurde in Adobe XD erstellt, wobei der Fokus auf den Kernfunktionen lag: Vorratshaltung, Rezeptvorschläge, Einkaufsliste und Abstimmung in Gruppen. Nach der ersten Version führten wir Usability-Tests mit fünf Testpersonen aus unserer Zielgruppe durch. Die Tester gaben uns wertvolles Feedback zur Navigation und Funktionalität. Basierend auf den Ergebnissen wurden Anpassungen vorgenommen, um die Nutzerfreundlichkeit weiter zu verbessern. So wurde etwa die Scan-Funktion für Vorratsgegenstände optimiert, um den Aufwand für die Dateneingabe zu minimieren. Darüber hinaus erstellten wir basierend auf unseren Erkenntnissen eine Pattern Library, die die Bausteine unseres High-Fidelity-Prototyps nach der Theorie des Atomic Designs zusammenfasst. In der Folge gelang es uns, einen High-Fidelity-Prototypen zu realisieren, der die Funktionen der App interaktiv darstellt.

Videoproduktion

Um das Konzept und die Funktionen der Pantry-App überzeugend darzustellen, wurde ein Produktvorstellungsvideo produziert. Das Video verfolgt den Zweck, die App und deren Features anschaulich und ansprechend zu präsentieren.

  • Skript und Storyboard: Zunächst wurde ein Storyboard und ein Skript entwickelt, das die Benutzer durch die wichtigsten Funktionen der App führt – vom Anlegen eines Vorrats bis hin zur Abstimmung auf ein Rezept.

  • Visualisierungen und Animationen: In Adobe After Effects erstellte ich animierte Darstellungen der App-Screens, die in eine flüssige Erzählung eingebettet wurden. Eine besondere Herausforderung bestand darin, durch spannende und abwechslungsreiche Animationen und Übergänge die Aufmerksamkeit der Zuschauer aufrechtzuerhalten.

  • Audio und Musik: Das Video wurde mit einem klaren Voice-over ergänzt, das die einzelnen Funktionen erklärt. Begleitet wird es von Hintergrundmusik, die eine einladende Atmosphäre schafft.

Fertigstellung und Präsentation

Nach Abschluss des Designs und der Videoproduktion präsentierten wir die Pantry-App dem Auftraggeber. Das Projekt wurde dabei sehr positiv aufgenommen, insbesondere das klare Design und die durchdachte Benutzerführung stießen auf große Zustimmung. Das Produktvideo verhalf der App zu einem lebendigen und verständlichen Gesamtbild, das den Nutzen und die Vielseitigkeit der Pantry-App anschaulich darstellte.

Pantry Sitemap
Pantry Sitemap
Pantry UX Prototyp
Pantry UX Prototyp
Pantry Buttons
Pantry Buttons
Pantry Persona
Pantry Persona
Pantry Rechnung
Pantry Rechnung
Pantry Prototyp
Pantry Prototyp
Pantry Storyboars
Pantry Storyboars
Pantry Schriften
Pantry Schriften