Kontekst Projektu
System, który porządkuje złożone dane
Projekt dotyczył stworzenia nowej wersji systemu dla płatników składek — osób i firm, które codziennie pracują z danymi finansowymi, dokumentami ubezpieczeniowymi i raportami. Naszym zadaniem było uporządkowanie złożonych informacji i zaprojektowanie interfejsów, które będą spójne z pozostałymi usługami administracji państwowej.
System bazował na wzorcach design systemu mObywatel, ale wymagał rozszerzeń dostosowanych do realiów pracy biurowej — dużych tabel, wielu pól, intensywnej filtracji i porównań danych. Nasza rola polegała na wypracowaniu takich rozwiązań, które ułatwiają codzienną pracę, a nie tworzą dodatkowej złożoności.
Wyzwanie: praca z dużymi tabelami
Mobilny układ zaprojektowany od podstaw
Kluczowym elementem systemu były rozbudowane tabele — z wieloma kolumnami, statusem dokumentów, datami, kwotami, identyfikatorami. Analiza wykazała, że to właśnie tabele są najczęściej używaną częścią systemu: użytkownicy sortują, filtrują, porównują i eksportują dane.
Trudność polegała na tym, że klasyczny model responsywności nie sprawdził się. Poziome przewijanie na telefonach utrudniałoby pracę i prowadziło do błędów. Potrzebne było rozwiązanie, które nie traci informacji, ale dostosowuje strukturę do małego ekranu.
Zamiana kolumn w pionowe bloki
W wersji mobilnej zrezygnowaliśmy z przewijania w poziomie. Każda pozycja z tabeli została ułożona pionowo i podzielona na sekcje odpowiadające kolumnom desktopowym. Pierwszy wiersz został wyróżniony jako nagłówek rekordu, dzięki czemu użytkownik natychmiast orientuje się, czego dotyczy wpis.
Efekt?
- pełny dostęp do wszystkich danych,
- brak utraty kontekstu,
- wysoka czytelność na małych ekranach,
- spójność między desktopem a mobile, ale bez kopiowania rozwiązań „1:1”.
Wyzwanie: dostęp do akcji w długich tabelach
Kluczowe operacje zawsze pod ręką
Użytkownicy często zaznaczają wiele pozycji jednocześnie i wykonują akcje zbiorcze: pobieranie dokumentów, zmiana statusu, eksport. Na desktopie przyciski akcji były umieszczone nad tabelą — ale znikały z pola widzenia po przewinięciu strony.
To powodowało dezorientację i niepotrzebne przewijanie w górę, tylko po to, by wykonać prostą operację.
Podwójna dostępność akcji: u góry i u dołu ekranu
Na desktopie użytkownik widzi główne przyciski nad tabelą. Natomiast na telefonach i w przypadku długich list wprowadziliśmy wyjeżdżającą szufladę u dołu ekranu — pojawia się automatycznie, gdy górne przyciski znikną z widoku.
To połączenie dwóch modeli interakcji znacznie poprawiło płynność pracy:
- akcje są dostępne bez względu na długość tabeli,
- użytkownik nie musi wracać na górę,
- system jest przewidywalny i „zachowuje się tak, jak tego oczekujemy”.
Jak działa responsywność w tym module
Na koniec warto pokazać, jak cały układ zachowuje się w praktyce — szczególnie podczas przejścia między widokiem desktopowym a mobilnym.
Praca z tabelami to częsty problem w projektowaniu, a każdy przypadek jest inny i zależy od potrzeb użytkownika oraz kontekstu. W tym projekcie udało się stworzyć rozwiązanie, które działa wygodnie i przewidywalnie, niezależnie od tego, jak duża jest tabela czy gdzie na stronie znajduje się użytkownik.
Zakres współpracy
W projekcie Ubezpieczeń dla Biznesu odpowiadaliśmy za kluczowe prace UX związane z projektowaniem systemu webowego opartego o złożone dane i dokumenty. Nasze działania obejmowały:
- prowadzenie warsztatów koncepcyjnych z zespołami merytorycznymi,
- analizę potrzeb płatników i sposobów pracy z dokumentami,
- opracowanie przepływów, zależności i logiki interfejsu,
- projekt komponentów tabelarycznych i zachowań interakcji,
- przygotowanie makiet UX (Lo-Fi i Hi-Fi UX),
- prototypowanie i konsultacje z zespołami developerskimi,
- projekt makiet Lo-Fi,
- przygotowanie dokumentacji do implementacji.
Efekty
Zaprojektowane rozwiązania znacznie usprawnią codzienną pracę użytkowników, skracając czas przeglądania i filtracji danych. Dwupoziomowy dostęp do akcji oraz pionowy układ tabel w wersji mobilnej zostały szczególnie docenione w testach użyteczności — uczestnicy podkreślali, że system „nie przeszkadza”, „prowadzi przewidywalnie” i „po prostu pozwala pracować szybciej”.