UX/UI-Design
Web-Design
Branding
Ein Verzeichnis lokaler Lebensmittelgeschäfte
Overview
Hallokal ist eine Website, die einen schnellen Überblick über regionale Produkte und deren Lieferanten bietet. Regionales Einkaufen soll unkomplizierter und attraktiver gemacht werden. Wir möchten außerdem aufklären, warum regionales Einkaufen für unsere Gesellschaft wichtig ist und wollen das richtige Kaufverhalten fördern.
Deep Dive
Scroll
Problem
Das Interesse der Gesellschaft wächst an der Herkunft der Lebensmittel. Das Tierwohl und auch das regional Angebot rückt dabei immer mehr in den Mittelpunkt. Dies stellt aber einige Herausforderungen da, z.B. ist es oft mit höherem Aufwand verbunden, an Informationen zu gelangen wo genau diese Lebensmittel in der Region bezogen werden können.
01
Discover
Research
Um einen besseren Überblick zu erlangen, wurde wie immer mit einem kleinen allgemeinen Research gestartet.
Zielgruppe
Um die Zielgruppe besser einschränken zu können, wurde eine Zielgruppenanalyse durchgeführt.
Wettbewerbsanalyse
Um sich von den Mitbewerbern abzuheben, ist es entscheidend, diese zunächst zu kennen und gründlich zu analysieren.
02
Define
Personas
Die Entwicklung von Personas ist wichtig, denn sie helfen uns dabei, die Bedürfnisse unserer zukünftigen Nutzer*innen zu verstehen und repräsentieren sie. Wir tauchen tief in ihre Lebenswelt ein und Beschäftigen uns intensiv mit ihrem Alltag, dem Umfeld, den Interessen, den Werten und dem Nutzungsverhalten.
User-Journey
Um die Nutzerziele sowie Pain-Points zu identifizieren, wurden User-Journeys angefertigt.
Interviews, Content & Produktfotografie
Um die Regionalproduzenten optimal auf unserer Webseite zu präsentieren, haben wir ausführliche Interviews geführt. Zudem wurden vor Ort zahlreiche Fotos und Videos aufgenommen, um unseren Nutzern einen detaillierten Einblick zu ermöglichen.
03
Develop
Moodboards
Um verschiedene Designkonzept zu vermitteln, wurden Moodboards erstellt. Sie dienen als kreative Inspirationsquelle und helfen, Ideen zu visualisieren.
Click-Through / Prototyping
Mit Hilfe von Figma wurde ein interaktiver Prototyp erstellt. Dieser hilft dabei, Designideen zu visualisieren, Feedback zu sammeln und die User-Experience zu optimieren, bevor das endgültige Produkt entwickelt wird.
Usability Fragebogen, Testing, Korrektur
Um ein optimales Usererlebnis zu gewährleisten, wurden mehrere Tests mit verschiedenen Personen durchgeführt. Anschließend wurden die Ergebnisse ausgewertet und die notwendigen Korrekturen umgesetzt.
Tool Testing
Da das Konzept full-screen slider enthält, wurden unterschiedliche Tools getestet. Es wurden hierzu Wordpress, Webflow und Framer geprüft.
04
Deliver
Retusche
Der gesamte Content (Fotos, Videos) wurde retuschiert, um einen einheitlichen Look zu gewährleisten.
Illustrationen
Der Illustrationsstil wurde finalisiert und die finalen Illustrationen erstellt.
Finales Design
Um das oft eingestaubte Thema der regionalen Produkte aufzulockern, haben wir uns für ein modernes, freundliches Design entschieden. Hierzu wurden vier kräftige Farben gewählt. Ein Blau, ein Gelb, ein Orange und ein Grün, die zu allen Produktbereichen passen. Als Basis haben wir ebenso ein Weiß, ein Dunkelgrau und ein leichtes Beige. Passend zum modernen Design wurde eine schlichte Grotesk gewählt, die für jedermann gut lesbar ist.
Prototyping
Der Prototype wurde in Figma finalisiert.
Finales Testing
Nach dem finalisieren des Prototypen, wurde ein letztes Testing durchgeführt.
Styleguide
Um klare Richtlinien für das Design und die visuelle Identität eines Produkts zu wahren wurde ein übersichtlicher Styleguide angelegt. Er gewährleistet ein einheitliches Erscheinungsbild über alle Kommunikationskanäle hinweg.
