Kontekst projektu
Projekt zrealizowany w ramach prac akademickich, mający na celu stworzenie kompleksowego systemu SaaS do zarządzania flotą i ładunkami w branży TSL. Moja rola ograniczała się ściśle do projektowania UX/UI. Zaprojektowałem cztery kluczowe ekrany aplikacji oraz architekturę systemu designu, z naciskiem na czytelność skomplikowanych danych logistycznych.
Widok planowania załadunku
Projektowanie zawsze zaczynam od zderzenia wymaganych danych z architekturą ekranu, a nie od doboru kolorów. Serce systemu, czyli Planning Lab (moduł załadunku), wymagało połączenia listy dostępnych ofert, wizualizacji paki pojazdu oraz kalkulacji kosztów.
W pierwszej kolejności przygotowałem wireframe, który pozwolił zweryfikować ułożenie informacji (m.in. dane o wadze, LDM i oknach czasowych) bez rozpraszania się warstwą wizualną.
Następnie wdrożyłem docelowy interfejs. Zastosowałem czytelne karty ofert po lewej stronie, widok naczepy w centrum oraz wykres rentowności trasy na dole. Choć na etapie developmentu zrezygnowano z implementacji interakcji drag&drop (ze względu na stopień skomplikowania kodu), interfejs został w pełni przygotowany do obsługi przeciągania ładunków z listy bezpośrednio na naczepę.
Dashboard – Centrum dowodzenia
Główny ekran aplikacji miał dostarczać dyspozytorowi najważniejszych informacji w kilka sekund. Zaprojektowałem centralną mapę z podglądem na żywo wszystkich pojazdów.
Po kliknięciu w wybrany pojazd na mapie, użytkownik otrzymuje jego szybki podgląd. Prawą kolumnę przeznaczyłem na feed powiadomień systemowych, które bezpośrednio wpływają na decyzje biznesowe – alerty o wolnej przestrzeni ładunkowej, ryzyku opóźnienia (Time Window Risk) oraz nowych, rentownych okazjach z giełdy (Hot Offers). Górna sekcja to zwięzłe podsumowanie kluczowych wskaźników (m.in. dzisiejszy zysk netto i odsetek pustych przebiegów).
Fleet Manager – Zarządzanie zasobami
Ekran przeznaczony do administracji flotą oraz kierowcami. Skupiłem się tu na łatwym dostępie do specyfikacji technicznej wybranego pojazdu. Interfejs wyświetla kluczowe parametry (DMC, waga, klasa emisji, typ zabudowy) wraz z bieżącym statusem trasy i stopniem zapełnienia (LFIL). Moduł ten pozwala na szybką identyfikację zasobów bez konieczności przeklikiwania się przez głębokie menu.
Market Hub – Analiza trendów
Narzędzie wspierające decyzje strategiczne. Zamiast standardowych tabel z ofertami, zaprojektowałem widok analityczny. Zawarłem w nim mapę ciepła (heatmap), która wizualizuje największe zagęszczenie dostępnych ładunków, oraz wykres trendów, pokazujący wahania stawek (EUR/LDM) w ujęciu tygodniowym. Dzięki temu dyspozytor od razu widzi, w jakich regionach opłaca się szukać zleceń.
System komponentów i architektura
Aby zachować pełną spójność interfejsu i przyspieszyć ewentualne skalowanie aplikacji o nowe widoki, pracę oparłem na uporządkowanej bibliotece komponentów. Zaprojektowałem reużywalne warianty kart (oferty, pojazdy), nawigacji, powiadomień systemowych oraz elementów informacyjnych, zachowując ścisłe reguły odstępów i typografii.
