TL;DR
- Kontekst: Jedyny UX owner segmentu małych firm w banku detalicznym.
- Problem: Edycja danych firmowych istniała tylko w aplikacji mobilnej retail; segment małych firm potrzebował jej też na desktopie — bez podwajania logiki dla developerów.
- Co zrobiłem: Zaprojektowałem jeden hybrydowy proces — te same kroki i dane, adaptuje się tylko układ — obejmujący podgląd danych, edycję kontaktu i zarządzanie zgodami.
- Wynik: Moduł wdrożony na mobile i desktop; klienci obsługują się sami, bez call centre.
Diagnoza
Trudne nie było zaprojektować mobile i desktop osobno — trudne było zatrzymać je jako jeden proces. Bank nazywa to hybrydą: jeden proces renderowany na obu platformach, gdzie każdy wyjątek platform-specific to dodatkowy development. Dyscypliną więc było zaprojektować jeden proces — te same kroki, te same dane, ta sama logika — i pozwolić, by adaptował się tylko układ, wg zasad design systemu. Mobile pokazuje cztery sekcje danych jako hub, w który wchodzi się w głąb; desktop jako sidebar z treścią obok. Ta sama nawigacja, dwie prezentacje — i zero powielonej logiki dla zespołu dev.
Co zrobiłem
- Zaprojektowałem cały moduł solo — moja inicjatywa, mój design; zespół design systemu zatwierdził zmiany, ja je prowadziłem.
- Utrzymałem linię 1:1 hybrydy: jeden proces, różnice tylko w układzie, zero logiki platform-specific.
- Zaprojektowałem nawigację raz — mobile: hub z wejściem w głąb i cofaniem (app-character); desktop: lewy sidebar (cztery zakładki) z treścią obok.
- Objąłem cztery obszary danych: podgląd danych firmowych; zarządzanie adresami (siedziby i korespondencyjnym, ze skrótem „taki sam jak adres siedziby” dla dedup); edycja emaila i telefonu ręcznie; zarządzanie zgodami marketingowymi.
Wyniki
- Uniwersalny moduł wdrożony dla klientów małych firm na mobile i desktop — edycja danych, wcześniej dostępna tylko w aplikacji mobilnej retail.
- Self-service: klient podgląda swoją kartotekę, edytuje dane kontaktowe i zarządza zgodami bez call centre.
Problem
Co trzeba było rozwiązać?
Te opcje edycji danych istniały tylko w aplikacji mobilnej retail. Segment małych firm też ich potrzebował — ale klienci małych firm żyją też na desktopie (web banku), więc moduł musiał działać na obu platformach.
Dlaczego po prostu nie zaprojektować dwóch wersji?
Bo dwie wersje to podwójna logika dla zespołu dev do zbudowania i utrzymania. Model banku to hybryda — jeden proces, obie platformy. Każdy wyjątek platform-specific kosztuje development, a te wyjątki się kumulują. Więc ograniczeniem nie było „zrób ładnie na każdej platformie” — tylko „utrzymaj jeden proces, a niech układ się adaptuje”.
Moja rola / zakres
- Jedyny UX owner segmentu małych firm; ten moduł to moja inicjatywa i mój design end-to-end.
- Zespół design systemu zatwierdził zmiany, w tym nowy pattern sidebar — ja prowadziłem design, oni wyrażali zgodę.
- Często to ja projektuję zachowanie mobile↔desktop po raz pierwszy, bo bank priorytetyzuje aplikację mobilną (retail), a małe firmy wciąż trzymają się desktopu.
Proces
- Projektowałem mobile-first: jak ekrany mają odzwierciedlać zachowanie aplikacji na mobile, a potem jak mają wyglądać na web/desktop.
- Utrzymałem linię 1:1 przy każdej decyzji — te same dane, te same kroki, ta sama logika; adaptuje się tylko układ.
Kluczowe decyzje i trade-offy
- Jeden proces hybrydowy, nie dwa. Te same kroki, te same dane, ta sama logika na obu platformach; adaptuje się tylko układ wg zasad design systemu. Trade-off: mniejsza optymalizacja platform-specific — ale zero powielonej logiki dev, a to był prawdziwy driver kosztów.
- Jedna nawigacja, dwie prezentacje. Mobile: hub czterech wejść z wejściem w głąb i cofaniem (app-character, głębia). Desktop: lewy sidebar z czterema zakładkami, treść obok (płasko, orientacja bez wchodzenia w głąb i cofania). Te same cztery sekcje, ten sam flow — nawigacja ta sama, układ nie.
- Nowy pattern sidebar na desktop. Design system go nie miał; zaproponowałem go, zespół design systemu zatwierdził. Trade-off: wprowadzenie patternu to praca governance — ale układ desktop tego potrzebował i tworzy precedens dla przyszłych ekranów hybrydowych.
- Skrót dedup adresu. Adres korespondencyjny oferuje „taki sam jak adres siedziby” zamiast osobnego wpisywania. Większość JDG używa jednego adresu do obu; skrót znosi powielanie.
Jak to się skończyło
Moduł wdrożono dla klientów małych firm na mobile i desktop — edycja danych, wcześniej dostępna tylko w aplikacji mobilnej retail. Klienci robią to sami: podgląd kartoteki, edycja danych kontaktowych, zarządzanie zgodami.
Co z tego wyniosłem
- Trudne w cross-platform to zatrzymać to samo, nie zrobić różnie. Projektuj jeden proces; niech układ się adaptuje. Każdy wyjątek platform-specific to koszt dev, który się kumuluje.