Realizacja
Cocks & Cows: strona internetowa sieci restauracji
Cocks & Cows to duńska sieć burgerowni z sześcioma lokalami, z których każdy ma własną atmosferę. Zaprojektowaliśmy i wdrożyliśmy stronę internetową sieci restauracji na Headless CMS i Next.js: jedna marka, sześć podstron lokali i treści edytowane przez zespół.
Dla Cocks & Cows zaprojektowaliśmy i wdrożyliśmy serwis, który łączy sześć lokali w jednej platformie. Każdy lokal ma własną podstronę z menu i atmosferą miejsca, a całość opiera się na wspólnym design systemie i szybko ładującym się front-endzie.
Zakres prac
- Branża
- Gastronomia
- Typ produktu
- Strona internetowa restauracji
- Rynek
- Gastronomia
Technologie
- Headless CMS
-
Next.js - Product Design
Next.js
Najważniejsze fakty
- Sześć lokalizacji w jednym serwisie, każda z własną podstroną
- Design system dla spójnej, ale zróżnicowanej prezentacji menu i lokali
- Dynamiczne ładowanie treści do porównywania oferty lokali
- Headless CMS i front-end w Next.js
- Strona responsywna na wszystkich urządzeniach
Sześć burgerowni, jedna marka i strona, na której każdy lokal ma własne miejsce.
Cele
01
Oddać charakter marki
Przenieść do sieci ducha burgerowni, w której burgery i koktajle są tak samo ważne jak atmosfera lokalu.
02
Sześć lokali w jednym serwisie
Pokazać każdą lokalizację osobno, z jej menu i nastrojem, bez rozbijania marki na kilka stron.
03
Szybka strona z dużą ofertą
Zapewnić krótki czas ładowania, bo oferta burgerów i koktajli jest obszerna i ma być wygodna na każdym urządzeniu.
Proces
Co dostarczyliśmy
Serwis marki z sześcioma podstronami lokali i zapleczem do samodzielnej edycji treści.
- Design system - wspólne komponenty dla menu, opisów lokali i zdjęć, z miejscem na różnice między lokalizacjami.
- Podstrony lokalizacji - sześć osobnych prezentacji, każda z własnym układem i ofertą.
- Porównanie oferty - dynamiczne ładowanie treści, dzięki któremu ofertę różnych lokali przegląda się bez czekania.
- Headless CMS - panel, w którym zespół marki aktualizuje treści, oddzielony od front-endu.
- Front-end w Next.js - responsywna strona zbudowana pod krótki czas ładowania.
Wyzwanie: jedna marka i sześć różnych lokali
Cocks & Cows to duńska sieć burgerowni z sześcioma lokalizacjami. Każde miejsce ma swoją atmosferę, a wszystkie łączy jedna, wyrazista marka.
Strona musiała pokazać to naraz: wspólny charakter sieci i to, czym wyróżnia się konkretny lokal. Do tego dochodziła obszerna oferta burgerów i koktajli, którą trzeba podać czytelnie i bez długiego ładowania.
Strona miała działać na dwóch poziomach: jednej marki i sześciu lokali, z których każdy wygląda trochę inaczej.
Rozwiązanie: podstrona każdego lokalu z tych samych komponentów
Każda z sześciu lokalizacji dostała własną podstronę, zbudowaną z tych samych komponentów.
Design system pilnuje spójności marki, a jednocześnie pozwala nadać każdemu lokalowi inny układ i inny nastrój. Treści ładują się dynamicznie, więc przejście między lokalizacjami i porównanie ich oferty trwa chwilę.
Headless CMS i Next.js
Treści są zarządzane w Headless CMS, a stronę renderuje front-end w Next.js. Zespół marki zmienia menu i opisy lokali w panelu, a gość dostaje lekką, responsywną stronę. Serwis korzysta z design systemu przygotowanego dla wszystkich marek NoHo Partners.
Efekty: jeden serwis dla sześciu lokali
Cocks & Cows ma jeden serwis dla sześciu lokali, który zespół marki sam aktualizuje.
Po starcie strony klient sygnalizował większy ruch i więcej rezerwacji online. Użytkownicy zwracali uwagę na łatwą nawigację i wygląd strony.
Opracowanie: Radosław Kołacki Publikacja: Aktualizacja:
Powiązane
Wiedza do tej realizacji
Kilka lokali i jedna marka? Pokażmy każdy z nich osobno.
Zaczynamy od analizy, czym różnią się lokalizacje.
