// case study · freelance · realizacja end-to-end
Księgarnia Regionalna
Lokalna księgarnia bez strony — marka, copy, design i kod, dowiezione w pojedynkę w cztery tygodnie.
zobacz stronę na żywo ↗Welcome to my bookshop in Góra Kalwaria
WHAT YOU'LL FIND
Welcome to my bookshop
- rola
- Design · dev · copy — w pojedynkę
- czas
- 3–4 tygodnie
- zakres
- 0→1 — marka, copy, design i kod od zera
- klient
- Księgarnia Regionalna · Góra Kalwaria
- stack
- Next.js · Figma · v0 · Cursor
// problem
Lubiana lokalna księgarnia nie miała nic online — trafiało się do niej tylko przez pocztę pantoflową i Facebooka. Jedyne, co istniało, to logo.
// podejście
Zbudować wszystko od zera: identyfikację wizualną, tone of voice, strukturę strony, copywriting i kod — w workflow wspieranym AI, żeby działać szybko.
// wynik
Kompletna, responsywna strona w cztery tygodnie — zaprojektowana, napisana i zakodowana przez jedną osobę, ze statusem „otwarte teraz” liczonym na żywo w przeglądarce.
fig. 01
kontekst
Księgarnia Agaty służy Górze Kalwarii od lat — podręczniki szkolne, literatura regionalna Urzecza i przemyślany wybór dla każdego wieku. Mimo mocnej lokalnej renomy nigdy nie miała strony; klienci trafiali do niej przez pocztę pantoflową i Facebooka. Brief był prosty, ale wymagający: zbudować wszystko od zera. Jedyne, co istniało, to logo — i to ono nadało pierwszy kierunek kolorystyczny.
// komu służy
lokalni uczniowie i rodzice
sprawdzić listy podręczników, zapytać o tytuł, wiedzieć, czy jest na stanie
czytelnicy regionalni
odkryć literaturę Urzecza, której nie ma w sieciówkach
agata, właścicielka
strona, która brzmi jak ona — jest produktem, obsługą i osobowością naraz
Literatura regionalna
fig. 02
problem
Na start tylko logo.
Pełna marka, na żywo w cztery tygodnie.
// co trzeba było rozwiązać
- brak punktu startu — tylko logo
- jednoosobowa księgarnia potrzebuje autentycznie ludzkiego głosu
- literatura regionalna Urzecza ma brzmieć przystępnie, nie akademicko
- najpierw praktyka: czy otwarte? jak zamówić? gdzie to jest?
- okno 3–4 tygodni, dowiezione w pojedynkę
fig. 03
proces
// ślad rozumowania — każdy krok wynika z poprzedniego
Discovery z klientką
Rozmowy z Agatą były fundamentem. Zrozumienie jej oferty, wartości i tego, kim naprawdę są jej klienci, ukształtowało każdą decyzję — strukturę, ton i to, co strona główna musi powiedzieć.
Tone of voice i copywriting
Głos zdefiniowałem przed dotknięciem designu: pierwsza osoba, sąsiedzko, kompetentnie, ale bez pretensjonalności. Agata mówi wprost — „wiem, czego potrzebują lokalni uczniowie” — zamiast chować się za generycznym językiem marketingu. Całe copy napisane w tej personie.
Projekt w Figmie
Wyciągnąłem kolor akcentowy z logo i zbudowałem wokół niego ciepłą, papierową paletę. W Figmie powstały wireframe'y i finalny UI — układ sekcji, dobór typografii i detale podkreślające regionalny charakter księgarni.
// design tokeny — ciepły system zbudowany z jednego koloru logo
brown
#6b4327
akcent · z logo
espresso
#3f2817
nagłówki i tekst
paper
#f7f0e4
ciepłe tło
sage
#2f7d52
status otwarcia
taupe
#a08a6e
stonowany detal
display · serif
Zapraszam do
mojej księgarniciepło, osobiście, po ludzku — jak właściciel
body · sans
Od podręczników szkolnych po literaturę regionalną Urzecza.
czysto i czytelnie — do konkretnych odpowiedzi
Szkielet w v0, dopracowany w Cursorze
Projekty z Figmy brifowały v0, które wypluło działający szkielet React. Stamtąd wszystko poszło do Cursora: własna logika, animacje, responsywność i status na żywo pisałem i dopracowywałem tam.
◈ więcej szczegółów◈ zwiń
To workflow wspierany AI, którego używam dziś w projektach: AI kompresuje szkielet, ale każda decyzja — layout, copy, interakcja — zostaje ludzka.
Status otwarcia na żywo
Najbardziej praktyczna funkcja: pasek statusu mówiący od razu, czy księgarnia jest otwarta teraz — a jeśli nie, to kiedy otworzy. Bez backendu, bez ręcznych aktualizacji.
// status na żywo — liczony po stronie klienta, bez backendu
otwarte · do 18:00zamknięte · otwarcie pon. 10:00komponent porównuje lokalny czas z tygodniowym grafikiem — ustawiony raz w kodzie, zawsze aktualny
// kluczowy wniosek
W jednoosobowej księgarni głos musi brzmieć jak ona — nie jak agencyjne wyobrażenie o niej.
// ciepło, lokalnie, wprost — każda sekcja odpowiada na jedno realne pytanie.
fig. 04
wynik
Kompletna obecność od zera
Marka, copy, design i kod dowiezione jako jedna spójna całość — przez jedną osobę, w 3–4 tygodnie.
// jedna osoba, jeden głos, od początku do końca
Głos, który brzmi jak Agata
Pierwsza osoba, ciepło, lokalnie. Każda sekcja odpowiada na realne pytanie klienta — zero wypełniacza.
// bez korporacyjnego dystansu, bez marketingowych frazesów
Użyteczność wbudowana, nie doklejona
Status otwarcia na żywo, telefon jednym tapnięciem, jasne kroki zamawiania — praktyczne odpowiedzi są na wierzchu, nie zakopane.
// strona główna odpowiada, zanim zdążysz zapytać
fig. 05
refleksje
Projektowanie pod czyjś głos
Najtrudniejszą i najważniejszą decyzją był ton. W księgarni, gdzie właścicielka jest naraz produktem, obsługą i osobowością, strona musi brzmieć jak ona — nie jak agencyjna interpretacja jej.
Wspierane AI, prowadzone przez człowieka
v0 i Cursor skompresowały tygodnie budowania w dni — ale discovery, głos i każda decyzja zostały ludzkie. Szybkość była w realizacji, nie w decydowaniu, co budować.
Chcesz taką stronę dla swojego biznesu?
Projektuję i buduję całość — marka, copy, UI i kod — od pierwszej rozmowy po żywą, responsywną stronę.
albo napisz bezpośrednio: