Octosoup
オクトスプ
「がいよう」
Über das Projekt
Octosoup ist eine Website, die darauf abzielt, die Online-Präsenz von Restaurants zugänglicher und einprägsamer zu machen.
Dieses Projekt wurde initiiert, um die Mängel und Unzulänglichkeiten bestehender Restaurant-Websites zu beheben und eine einladende, benutzerfreundliche und informative Plattform zu schaffen.
Problemstellung
Viele bestehende Restaurant-Websites nutzen PDF-Speisekarten, die wenig einladend sind und zu mehreren Klicks und längeren Ladezeiten führen. Zudem fehlen oft Zutatenlisten sowie Nährwertangaben. Diese Informationen sind besonders wichtig für Nutzer, die auf eine bewusste Ernährung achten. Durch ein einzigartiges Design soll die Website einladend wirken und im Gedächtnis bleiben.
Benutzerziel
Benutzer suchen nach einer einfach zu navigierenden, visuell ansprechenden Website, die vollständige Informationen inklusive Zutatenlisten und Nährwertangaben bietet und auf allen Geräten gut funktioniert. Sie möchten eine Plattform, die ihnen hilft, die Restaurantwahl zu erleichtern, indem sie alle relevanten Informationen schnell und unkompliziert zugänglich macht. Ziel ist es, eine Website zu schaffen, die sowohl ästhetisch ansprechend als auch funktional ist, um eine positive Benutzererfahrung zu gewährleisten.
「プロセス」
Design Prozess
Empathize
Marktanalyse
Projektziel definieren
Define
User Persona
Empathy Map
Ideate
Skizzen
Mid-Fidelity Wireframes
Prototype & Testing
Visuelle Gestaltung
Interaktiver Prototyp
「ユーザー」
User Persona
Sophia Brown
Berlin, Deutschland
Marketing Managerin
Ziele:
Einfache und schnelle Restaurantwahl
Zugang zu detaillierten Menüinformationen (Zutaten, Nährwerte)
Angenehme Benutzererfahrung auf mobilen Geräten
Inspiration für neue Restaurantbesuche
Sophia Brown:
Sophia lebt in Berlin und arbeitet als Marketingmanagerin. Sie entdeckt gerne neue Restaurants und legt Wert auf eine gesunde Ernährung.
Bedürfnisse:
Einfache Navigation und schnelle Ladezeiten
Übersichtliche Darstellung von Menüs mit detaillierten Informationen
Mobile-optimiertes Design
Einladendes und einzigartiges Website-Design, das im Gedächtnis bleibt
Frustrationen:
Langsame und unübersichtliche Restaurant-Websites
Fehlende Informationen zu Zutaten und Nährwerten
Schwierigkeiten, mobile Websites zu navigieren
Mehrere Klicks notwendig, um an relevante Informationen zu gelangen
Empathy Map
Sagt:
Ich möchte schnell und einfach gute Restaurants finden.
Gesunde Ernährung ist mir wichtig, ich brauche Infos zu Zutaten und Nährwerten.
Ich liebe es, mit Freunden neue Lokale auszuprobieren.
Denkt:
Warum ist es so schwer, aktuelle und vollständige Informationen zu finden?
Eine gut gestaltete Website würde das Leben so viel einfacher machen.
Wie kann ich sicher sein, dass ein Restaurant meinen Ernährungsbedürfnissen entspricht?
Fühlt:
Frustriert über schlecht gestaltete Restaurant-Websites.
Begeistert, wenn sie neue, einladende Orte entdeckt.
Zufrieden, wenn sie genaue Infos zu Essen und Nährwerten hat.
Tut:
Nutzt regelmäßig Restaurant-Websites und Apps.
Sucht aktiv nach neuen Restaurants mit gesunden Optionen.
Teilt ihre Entdeckungen gerne mit Freunden und in sozialen Medien.
「きのう」
Alles auf einen Blick
Die Website verwendet auffällige Farben und bietet eine klare Struktur. Alle wichtigen Informationen sind auf einer einzigen Seite zugänglich, ohne Weiterleitungen.
So bleibt der Besuch einprägsam.
Interaktive Erlebnisse
Die Website bietet interaktive Elemente, um eine lebendige und ansprechende Benutzererfahrung zu gewährleisten.
Einheitliches Design sorgt für eine konsistente und nahtlose Navigation.
Einfaches Buchungssystem
Unser Buchungssystem ist klar strukturiert und einfach zu bedienen.
Es ermöglicht eine unkomplizierte Reservierung und sorgt für eine angenehme Benutzererfahrung.
「デザイン」
Visuell Design
Prototyp
「ガイド」
Stylguide
Header
Aa
Cherry Bomb One
Body 1
Aa
KoHo
Body 2
Aa
Londrina Solid
Color:
Coral
HEX:
RGB:
HSB:
#FE8D59
254,141,89
19,65,100
Color:
Vista Blue
HEX:
RGB:
HSB:
#7FD1AE
127,209,174
154,39,82
Color:
Grain Brown
HEX:
RGB:
HSB:
#DED0B2
222,208,178
41,20,87
Color:
Ecru White
HEX:
RGB:
HSB:
#F3EDE1
243,237,225
40,7,95
Color:
Shark
HEX:
RGB:
HSB:
#212427
33,36,39
210,15,15