Nova Seafood
„Arctic Luxury” dla prawdziwego importera owoców morza — interaktywna mapa FAO i katalog 35 gatunków.
- Rok
- 2026
- Rola
- Zlecenie — design engineering
- Technologie
- Next.js 15 · React 19 · Tailwind CSS 3 · Lenis · Canvas 2D
- Status
- novaseafood.pl ↗
Przeprojektowanie strony Nova Seafood — szczecińskiego importera owoców morza działającego od 2013 roku. Założenie było proste: ma wyglądać, jakby zrobiła to agencja kreatywna, stać na twardym SEO i spełniać korporacyjne standardy bezpieczeństwa.
Art direction — Arctic Luxury
Głęboki granat, lodowcowy cyjan i biel lodu; Space Grotesk złożony bardzo ciasno na tle gradientów zorzy i delikatnego ziarna. Autorski system śnieżnych cząsteczek — bez żadnych zależności — działa na warstwie Canvas 2D, uwzględnia gęstość pikseli ekranu, skaluje się do okna i całkowicie się wyłącza przy prefers-reduced-motion.
Katalog, który da się przeszukać
35 gatunków — morskich i słodkowodnych — filtrujesz na żywo po nazwie polskiej, angielskiej lub łacińskiej, a każdy ma zdjęcie produktowe w lightboksie. Interaktywna mapa 15 obszarów połowowych FAO wiąże każdy produkt z miejscem połowu, zamieniając identyfikowalność pochodzenia w coś, co można wyklikać.
Marka własna i zabezpieczenia klasy korporacyjnej
Strona prezentuje też NovaTiger — autorską linię białych krewetek Nova Seafood — w najciemniejszej, najbardziej filmowej sekcji projektu. Pod spodem jest tak samo dopracowana: Content-Security-Policy rozdzielone na dev i produkcję (na produkcji bez unsafe-eval), HSTS z dwuletnim preloadem, pełne PL/EN oraz zabezpieczenie na wypadek braku JS, które i tak pokaże każdy produkt, gdyby hydratacja zawiodła.
- 0135 gatunków · 70 zdjęć · 15 obszarów FAO
- 02CSP rozdzielone dev/prod — bez unsafe-eval na produkcji
- 03HSTS preload · max-age dwa lata
- 04Silnik cząsteczek na Canvas · zero zależności
- 05i18n oparte na trasach · zlokalizowana mapa strony
- 06Zabezpieczenie bez JS · pełna treść zapasowa
- 07Rozwijana po starcie — blog SEO i zakładka kariera