Rok
2025
Klient
zondacrypto
Kategoria
Web Design / Interakcje / Animacja
Czas realizacji
6 Tygodnie
🎯 Wyzwanie i cel — Przebudować, ale bez utraty DNA
Celem było unowocześnienie całej witryny ZND: od architektury informacji i nawigacji, przez system wizualny (nowe „szklane” ikony, dwa tryby — Dark i Light), po pełną spójność pomiędzy desktop i mobile. Dodatkowo gruntownie przebudowaliśmy Help Center, aby skrócić drogę do odpowiedzi i odciążyć support.
Klucz: zachować rozpoznawalność marki, a jednocześnie dać jej świeży, klarowny język.
Założenia:
szybsza orientacja w ofercie i dokumentacji,
wyraźne standardy UI, umożliwiające skalowalność wraz z rozwojem,
realna oszczędność czasu zespołu (projektowanie i wdrożenia).
Strategia i analiza — Od potrzeb użytkownika do priorytetów
Zaczęliśmy od mapy problemów: rozproszone wzorce UI, brak konsekwencji w stylu, ograniczona czytelność na mobile i w szczególności mało „samopomocowy” Help Center. Na tej bazie powstała lista priorytetów oraz nowa architektura treści.
Co zrobiliśmy:
audyt flow usera i treści (IA),
porządek w nawigacji ,
definicja stanów i edge-case’ów (pustki, błędy, ślepe zaułki),
zasady dostępności i kontrastu uwzględnione od startu.
✏️ Projektowanie doświadczenia
Całość zaprojektowana w Figma jako jeden spójny ekosystem. Powstała nowa baza komponentów (mini design system) z tokenami, wariantami. „Szklane” ikony dodały lekkości i charakteru, a motywy Dark i Light działają konsekwentnie w całym UI.
Elementy projektu:
biblioteka komponentów + style (typografia, siatki, stany, odstępy),
responsywność projektowana równolegle: desktop i mobile - w łatwych do użycia komponentach,
copy i komunikaty kontekstowe,
Help Center od nowa: lepsza kategoryzacja, dynamiczna wyszukiwarka, szybkie wejścia do najczęstszych tematów.
🛠 Rozwój i technologia
Mini design system przełożyliśmy na produkcyjne komponenty webowe z myślą o szybkości i powtarzalności wdrożeń. Motywy Dark i Light oparto o design tokens + zamknięto w komponenty.
Praktyki wdrożeniowe:
design tokens dla kolorów, typografii i odstępów,
warianty komponentów i stany (device, hover, focus, disabled, błędy)
💡 Efekt końcowy
Nowa witryna jest spójna wizualnie z funkcjonującym na rynku ZND, prostsza w nawigacji i łatwiejsza w utrzymaniu. Pomaga ludziom szybciej znaleźć odpowiedź, a zespołowi - szybciej dowozić kolejne elementy.
Co zyskaliśmy:
rozpoznawalny styl (szklane ikony, Dark/Light),
krótsze ścieżki użytkownika i przejrzyste mobile,
Help Center, które realnie odciąża support,
komponenty i zasoby które przyspieszają każde kolejne wdrożenie.
