case study · Strona internetowa dla szkoły jazdy

PIXEL Drive

Szkoła jazdy z Marek: siedemnaście podstron, kalkulator jazd, FAQ z wyszukiwarką oraz motyw jasny i ciemny.

Rok: 2026
Typ: Strona szkoły jazdy
Zakres: 17 podstron
Rola: Projekt i kod, od początku do końca

W skrócie

Kompletna strona szkoły nauki jazdy zbudowana na prawdziwych materiałach klienta: zdjęciach auta i placu, cenniku i opiniach kursantów. Każdy kurs ma własną podstronę z programem i wymaganiami, a kontakt kończy się formularzem, który od razu zaznacza wybrany kurs.

Problem

Kursant porównuje kilka szkół w jeden wieczór, zwykle na telefonie. Szuka ceny, terminów i tego, jak wygląda egzamin. Jeśli musi o to dzwonić albo przekopywać się przez PDF-y, wybiera konkurencję.

Rozwiązanie

Każde pytanie kursanta dostało swoje miejsce: osobne podstrony kursów, cennik z opłatami urzędowymi i ratami, przewodnik po egzaminie i FAQ z wyszukiwarką. Dane firmy wpisuje się raz w pliku konfiguracyjnym, a strona rozsyła je na wszystkie podstrony.

Zbudowane na

+Next.js
+PostgreSQL
+Drizzle
+Zod
+Playwright

// Realizacja dla szkoły jazdy PIXEL Drive z Marek. Zdjęcia, cennik i opinie pochodzą od klienta, a zrzuty z działającej strony uruchomionej lokalnie.

Co potrafi

01

Motyw jasny i ciemny

Przełącznik w nawigacji zapamiętuje wybór i przywraca go przed pierwszym renderem, więc strona nie mruga przy wejściu.

02

Kalkulator jazd doszkalających

Suwak godzin i przełącznik manual lub automat od razu liczą koszt, stawkę za godzinę i oszczędność na pakiecie.

03

FAQ z wyszukiwarką

Pytania filtrowane po kategoriach i przeszukiwane na żywo, bez przeładowania strony.

04

Formularz, który prowadzi

Walidacja pól, podsumowanie błędów i ekran sukcesu, a link z podstrony kursu od razu zaznacza wybrany kurs.

05

Animacje w temacie jazdy

Auto jedzie po drodze razem ze scrollem, obrotomierz pokazuje zdawalność, a liczniki kręcą się jak odometr. Przy ograniczeniu ruchu w systemie wszystko stoi w miejscu.

06