Przelew krajowy w aplikacji Pekao

2️⃣ Zidentyfikowane problemy UX

1. Długość formularza: 

Wszystko jest na jednym, bardzo długim ekranie. To powoduje „paraliż decyzyjny” i zmusza do ciągłego przewijania. Zbyt dużo opcji na jednym ekranie przytłacza. Opcja zamknięcia przelewu + skanera zajmuje zdecydowanie za dużo miejsca.

2. Hierarchia wizualna: 

Użytkownik najpierw chce wiedzieć komu przesyła pieniędze i na jaki rachunek, na końcu zazwyczaj chce widzieć input z kwotą. Pole z jakiego rachunku robi przelew nie powinnno być pierwszym co klient widzi (z automatu itak zawsze ustawione jest konto na którym obecnie jesteśmy, a spora cześć osób prywatnych ma tylko jedno konto)

3. Brak łatwego dostępu do zapisanych odbiorców:

Formularz zmusza do ręcznego wpisywania danych. Brak wyraźnego skrótu do listy kontaktów lub zdefiniowanych odbiorców sprawia, że proces jest wolny i podatny na błędy (literówki w numerze konta)

4. Data przelewu nie powinna być ukryta pod switchem.

Użytkownik chce mieć pewność że przelew wyjdzie np. dziś.

5. Opcje dodatkowe widoczne po kliknięciu w switche zajmują za dużo miejsca.

Można to ograć inaczej oszczędzajac miejsce.

6. Zmiana microcopy na przyciskach.

Przycisk ‘dalej’ nic nie mówi użytkownikowi. Słowo ‘Autoryzuj’ – jest zbyt techniczne.

7. Ukryte koszty/opcje:

„Opłata zostanie pobrana zgodnie z taryfą” – to budzi niepokój.Przydała by się odrazu konkretna kwota – system zna opłaty, także powinien tutaj podawać konkretna kwotę w czasie rzeczywistym.

8. Zarządzanie informacjami / błędami:

Informacja o dniu wolnym – ten komunikat zajmuje sporo miejsca i zmusza użytkownika żeby ponownie wybrał datę + ewentualnie jeszcze żeby kliknął X do zamknięcia tego komunikatu. Do tego wygląda jak błąd a nie informacja.

9. Ekran podsumowania jest nudny

Zbyt prosty. Brakuje opcji edycji danych – trzeba się cofać.

3️⃣ Kluczowe decyzje UX

1. Likwidacja scrollowania i eliminacja drugorzednych bloków

Zmiana: Zintegrowanie funkcji skanowania kodu QR jako ikony nad klawiaturą po kliknięciu w pola 'Odbiorca’ lub 'Numer konta'”. Mniej istotne pola (Adres, Zapisz odbiorcę itd.) będą widoczne w opcjach dodatkowych po kliknięciu w suwak. Zmiana marginesów zaoszczędzi nam miejsce.
Uzasadnienie: Likwidujemy paraliż decyzyjny poprzez ograniczenie liczby elementów widocznych na starcie. Wszystkie kluczowe pola mieszczą się nad linią ucięcia ekranu co eliminuje konieczność scrollowania.

2. Odwrócenie priorytetów – najpierw Cel, potem Pieniądze

Zmiana: Pole „Z rachunku” zostaje przeniesione poniżej danych Odbiorcy, a pole “kwota” na sam dół
Uzasadnienie: Zmieniamy logikę z systemowej na ludzką: Najpierw cel (Kto?), potem źródło (Z konta?), a na końcu wartość (Ile?). Kwota zostaje na końcu jako finalna decyzja, co tworzy logiczny ciąg zdarzeń zamiast chaosu.

3. Lista kontaktów zawsze pod ręką

Zmiana: Wewnątrz pola „Odbiorca” dodajemy ikonę sylwetki. Wewnątrz pola “Numer konta” dodajemy ikonkę skanera.
Uzasadnienie: Wybranie zapisanego odbiorcy z auitomatu wypełni nam też numer konta. 
Skracamy czas operacji z kilkudziesięciu sekund na wpisanie nr konta do 2 kliknięć

4. Data zawsze widoczna

Zmiana: Wyciągnięcie daty z ukrytego menu na wierzch. Pole jest zawsze widoczne.
Uzasadnienie: Użytkownik nie musi szukać w opcjach dodatkowych (suwaki) daty zlecenia przelewu. 
Po kliknięciu w kalendarz automatycznie mamy zaznaczoną obecną datę. 
W inpucie z automatu będzie juz wpisana obecna data – ograniczamy wtedy kolejne 2 kliknięcia.

5. Porządek w opcjach dodatkowych (Suwaki)

Zmiana: Przeniesienie rzadko używanych funkcji do panelu ustawień pod ikoną suwaków w górnym rogu.
Uzasadnienie: Zyskujemy sporo miejsca – Interfejs staje się przejrzysty i czytelny.

6. Odpowiednie microcopy

Zmiana: korekta copy na bardziej “ludzkie” i intuicyjne. (1 krok – “Podsumowanie”. 2 krok “Wyślij przelew”.)
Uzasadnienie:  Przycisk „Podsumowanie” na pierwszym ekranie działa jak „wentyl bezpieczeństwa”. Użytkownik nie boi się kliknąć, bo wie, że system nie wyśle pieniędzy natychmiast, tylko pozwoli mu jeszcze raz wszystko sprawdzić. Na drugim ekranie „Wyślij przelew” jest jasnym przekazem. Nie ma tu miejsca na domysły – kliknięcie oznacza realny przepływ gotówki.

7. Konkretna kwota zamiast „Taryfy opłat”

Zmiana: Zastąpienie bankowego żargonu o „taryfie” konkretną informacją: „Opłata: 0,00 PLN”, wyliczaną w czasie rzeczywistym.
Uzasadnienie: Likwidujemy niepewność. Klient od razu wie, czy operacja go coś kosztuje, bez konieczności szukania cenników w PDF-ach.

8. Asysta zamiast wytykania błędów

Zmiana: Przeniesienie komunikacji o dniach wolnych bezpośrednio do widoku kalendarza. Dni wolne mogą być wizualnie oznaczone (np. innym odcieniem), a po ich kliknięciu, jeszcze przed zatwierdzeniem, pojawia się informacja: „Sobota – przelew zostanie zrealizowany w poniedziałek, 21.04”.
Uzasadnienie: Użytkownik otrzymuje kluczową informację dokładnie wtedy, gdy jej potrzebuje (w momencie wyboru). Dzięki temu świadomie decyduje, czy zostaje przy tej dacie, czy sam wybiera kolejny dzień roboczy, co eliminuje konieczność późniejszych poprawek i zamykania irytujących komunikatów. Po wejściu w kalendarz uprzedzamy błędy i informujemy że w dni wolne nie zlecimy przelewu. Jeśli mimo to użytkownik klika dzień wolny – dostaje stosowny komunikat że przelew wyjdzie w najbliższym dniu roboczym.

9. Interaktywne i czytelne podsumowanie

Zmiana: Odświeżenie wizualne ekranu podsumowania oraz dodanie ikon edycji (ołówków) przy każdej sekcji danych.
Uzasadnienie: Likwidujemy „nudę” i brak funkcjonalności. Możliwość edycji danych bezpośrednio na podsumowaniu skraca ścieżkę naprawczą i zapobiega porzucaniu procesu w przypadku znalezienia literówki.

4️⃣ Rezultat

Zanim przeszedłem do warstwy wizualnej, opracowałem makiety typu wireframe. Ich celem było przetestowanie nowego układu, który zmieściłby cały proces na jednym ekranie (bez przewijania). Dzięki temu mogłem szybko zweryfikować, czy skrócenie ścieżki o 2-3 kliknięcia (poprzez integrację kontaktów i skanera bezpośrednio w polach) zachowuje pełną zrozumiałość dla użytkownika.Stworzony prototyp Hi-Fi charakteryzuje się nowoczesnym, „lekkim” wyglądem, który nie tylko poprawia estetykę, ale przede wszystkim zwiększa pewność użytkownika podczas wykonywania transakcji dzięki czytelnemu podsumowaniu.