Zaprojektowanie i wdrożenie kompleksowego systemu Guideline UI/UX dla wewnętrznych narzędzi firmowych. Celem było ujednolicenie wyglądu interfejsów, poprawa użyteczności oraz stworzenie spójnego języka wizualnego, który mógłby być skalowany wraz z rozwojem produktów.
Zakres prac
Analiza istniejących interfejsów
Projekt rozpocząłem/am od analizy aktualnie używanych widoków i komponentów. Zidentyfikowałem/am niespójności wizualne, problemy z hierarchią informacji oraz elementy utrudniające pracę użytkownikom wewnętrznym.
Definicja zasad UI
Projekt obejmował reguły m.in.:
– kolorystykę i kontrast zgodny z WCAG
– typografię i skalę nagłówków
– spacing i siatkę layoutu
– style ikon, przycisków, formularzy i komunikatów systemowych
Wszystkie zasady zostały opisane w formie przejrzystej dokumentacji, dostępnej dla zespołów projektowych i developerskich.
Projekt systemu komponentów
Stworzyłem bibliotekę komponentów (Design System) w Figma, obejmującą m.in.:
– przyciski w różnych stanach (default, hover, disabled, loading)
– pola formularzy i walidację
– tabele danych i filtry
– modale, tooltipy, powiadomienia
– karty, listy i nawigację
Każdy komponent był zaprojektowany w wariantach responsywnych oraz przygotowany do łatwego wdrożenia przez developerów.
Ujednolicenie UX i flow użytkownika
Poza warstwą wizualną przeanalizowałem kluczowe ścieżki użytkownika (user flows) w systemach wewnętrznych.
Uprościłem nawigację, zredukowałem liczbę kroków w procesach oraz poprawiłem czytelność komunikatów i etykiet.
Efekty projektu
spójny wygląd wszystkich narzędzi wewnętrznych
skrócenie czasu wdrażania nowych widoków
mniejsza liczba błędów UI
lepsza czytelność interfejsów dla pracowników
łatwiejsze skalowanie systemu wraz z rozwojem firmy
