Synergia Piękna
Strona gabinetu beauty w Next.js z panelem CMS
Zaprojektowaliśmy i wdrożyliśmy stronę od zera: strukturę podstron, projekt graficzny, kod i uruchomienie na domenie gabinetu. Front stoi na Next.js i TypeScripcie, dane i media trzyma Supabase, a hosting prowadzi Vercel. Rezerwacje zostały w Booksy, z którego gabinet już korzysta, a my połączyliśmy z nim każdy przycisk na stronie razem z pomiarem kliknięć. Klientki prowadzą treści, zdjęcia i film w panelu Optiweb CMS.
Wykorzystane technologie
Czego wymagało to wdrożenie
Gabinet łączy pięć obszarów, od trychologii po terapię blizn, a klientka często nie wie, który zabieg odpowiada na jej problem. Strona musiała prowadzić ją do właściwej specjalistki, przekazywać rezerwację do Booksy i dać się prowadzić dwóm właścicielkom bez pomocy programisty.
Jak przebiegła produkcja
Każdy obszar dostał własną podstronę, a strona główna działa jak mapa: pięć kart prowadzi do zabiegów, a sekcja dla niezdecydowanych podpowiada, od czego zacząć. Podstrony mają wspólny układ, więc klientka porusza się po nich bez szukania.
Paletę oparliśmy na bordo, szampańskim złocie i ciepłym beżu, a nagłówki złożyliśmy cienkim krojem szeryfowym Butler. Dekor z gałązek eukaliptusa odsłania się przy przewijaniu, a łuki na styku sekcji zmiękczają układ strony.
Stronę zbudowaliśmy w Next.js i TypeScripcie, z hostingiem na Vercel. Na telefonie karty zabiegów i opinie układają się w rzędy przewijane palcem, a strona otwiera się szybko także na telefonie.
Rezerwacja została w Booksy, które gabinet już prowadzi. Podpięliśmy do niego przyciski w nagłówku, na pierwszym ekranie i na podstronach, ze znakiem Booksy i pomiarem kliknięć, żeby było widać, ile osób przechodzi ze strony do rezerwacji.
Każda podstrona ma własny tytuł, opis i grafikę udostępniania, a Google dostał uporządkowany opis gabinetu z adresem i godzinami otwarcia. Mapa Google i analityka ładują się dopiero po zgodzie na pliki cookies.
Klientki dostały panel Optiweb CMS, w którym same edytują sekcje, wymieniają zdjęcia i film oraz poprawiają opisy zabiegów. Do każdej zmiany wystarczy przeglądarka, bez pomocy programisty.
Zamów bezpłatną konsultację
Zadaj nam dowolne pytanie, wystarczy, że klikniesz poniższy przycisk i skontaktujesz się z jednym z naszych specjalistów.