Skycash - Jak Zima UX&UI zaprojektowała aplikację mobilną dla firmy z branży transportowej

Zaprojektowaliśmy nową aplikację mobilną dla ponad 3 milionów użytkowników, która upraszcza opłacanie parkowania w mieście.

Nowa aplikacja Skycash przedefiniowała kategorię, wprowadzając model subskrypcyjny. To nie jest kolejna „apka do płatności”, tylko narzędzie, które realnie ułatwia codzienne parkowanie, dzięki dodatkowo zaprojektowanym funkcjom.

1700
godzin pracy
12
miesięcy
5
projektantów

Co robimy

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

O projekcie

Skycash to marka, która od 2010 roku porządkuje jeden z najbardziej niedocenianych obszarów doświadczeń użytkownika: płatności mobilne w mieście.

Wtedy, kiedy się spieszysz, poruszasz się - parkujesz, albo kupujesz bilety w komunikacji miejskiej. Aplikacja SkyCash umożliwia m.in. zakup biletów komunikacji miejskiej, opłacenie parkingu i przejazdy koleją, a z jej rozwiązań korzysta już ponad 3 mln użytkowników.

Nowy branding

W projekcie zaszła kompleksowa zmiana. Skycash zdecydował się na odświeżenie brandingu, zmianę modelu biznesowego oraz przebudowę aplikacji.

Smart features

Aby spełnić obietnicę komfortowego podróżowania, Skycash wprowadził nowe funkcje. Automatyczne włączanie i zatrzymywanie parkowania, czy zapisywanie lokalizacji zaparkowanego pojazdu.

Zakres

UX & UI
Design System

Model projektowy
Czas: 12 miesięce

Kontekst projektu

Skaycash pozyskał nowego inwestora i z aplikacji do opłacania biletów parkingowych, przeobraził się w rozwiązanie ułatwiające poruszanie się po mieście. Marka przeszła całkowity redesign. Pojawienie się nowej aplikacji to równocześnie premiera nowego pozycjonowania na rynku, nowego brandingu oraz nowych funkcji aplikacji.



Nowa aplikacja Skycash rozwiązuje problem wielu kierowców, cztli potrzebę szybkiego opłacania parkingu, nie wysiadając z auta, bez konieczności tracenia czasu na szukanie parkometru. Kierowcy obawiają się mandatu, jeśli zapomną uruchomić parkowanie, a jednocześnie nie chcą przepłacać, gdy zapomną zakończyć parkowanie. Obecna aplikacja adresowała podstawowy problem opłacania parkingu, ale aby dostarczyć kompleksowe narzędzie dla kierowców, postanowiliśmy wdrożyć kolejne funkcje ułatwiające życie kierowców.



Nasza agencja zaprojektowała prosty i intuicyjny proces rozpoczynania oraz kończenia parkowania, który wspiera użytkownika w kluczowych momentach - podczas uruchamiania postoju, w trakcie jego trwania oraz zakończenia parkowania. Dzięki temu aplikacja daje kierowcom komfort codziennego użycia, ogranicza ryzyko mandatu i pomaga uniknąć niepotrzebnych opłat parkingowych.

Cele projektu

  • Zrozumieć, za co użytkownicy podobnych aplikacji chcą płacić– opracowaliśmy analizę oferowanych przez konkurencję funkcji,
z uwzględnieniem, które z nich są bezpłatne, a za które użytkownik musi  zapłacić dodatkowo.
  • Zaprojektować nowy UX, który daje komfort  – naszym celem było zaprojektowanie aplikacji, która daje zabieganym kierowcom poczucie bezpieczeństwa, że nie zapłacą mandatu podczas parkowania w strefie płatnej. Nowa aplikacja nie pozwoli też zapomnieć o włączonym parkingu po odjechaniu z miejsca.
  • Rozwiązanie problemu z przedłużaniem parkowania – UX, który wspiera nowe, inteligentne funkcje aplikacji. Wyeksponowaliśmy najważniejsze funkcje w interfejsie aplikacji Skycash tak, aby użytkownik mógł je łatwo zauważyć, zrozumieć ich wartość i w naturalny sposób z nich korzystać.
  • Wyróżniający UI – Na rynku istnieje wiele aplikacji do opłacania parkingu na mieście. Wyzwaniem było więc zaprojektowanie takiego interfejsu użytkownika, który odzwierciedla nową propozycję wartości - komfort podróżowania, niezależnie od wybranego środka transportu.

Proces projektowy

Projektowanie podzielone było na fazy:

  • badania i zrozumienie rynku
  • analiza konkurencji w Polsce, jak i analogicznych rozwiązań ze świata
  • analiza features do wersji podstawowej i subskrypcyjnej
  • ścieżka ux
  • nowy ui
  • mikroanimacje
  • design system

Proces projektowy trwał ponad pół roku. Podczas cotygodniowych spotkań, na których omawialiśmy wypracowane ścieżki, otrzymywaliśmy feedback i poprawki do projektu. Dzięki temu współpraca przebiegała zgodnie z harmonogramem.

Parking „One click”

Kierowcy wybierają samochód jako środek transportu, bo zapewnia im niezależność od rozkładów jazdy komunikacji miejskiej. Wskazało na to 62% badanych, a dla 13% jest to najczęstszy powód korzystania z auta. Kolejnymi ważnymi czynnikami są wygoda 
i komfort podróżowania.*

Jednocześnie parkowanie w miastach powoduje duży stres! 21% kierowców otrzymało mandat za parkowanie w niedozwolonym miejscu, a 17% za przekroczenie opłaconego czasu postoju. Mandaty niemal dwa razy częściej otrzymują mężczyźni, niż kobiety. Skycash wykorzystał tę wiedzę i zdecydował się na podjęcie kilku kluczowych decyzji biznesowych, które miały duży wpływ na design:

  • Parkowanie przez aplikację musi być ekstremalnie wygodne
  • Aplikacja powinna zabezpieczyć obawę otrzymania mandatu
  • Smart features wspierają użytkownika w trakcie parkowania, zwiększając poczucie kontroli nad czasem postoju i kosztami.

*Badanie własne Skycash

Dlatego najważniejszym elementem nowej aplikacji było uwypuklenie możliwości włączenia parkingu za pomocą jednego kliknięcia (one click parking).

Aplikacja umożliwia rozpoczęcie parkowania nawet wtedy, gdy użytkownik nie ma jeszcze dodanej metody płatności. System daje dodatkowe 5 minut na jej uzupełnienie, zapewniając kierowcy komfort psychiczny i eliminując ryzyko otrzymania mandatu.

Wyzwaniem była komunikacja nowych funkcji w aplikacji. Aby zaadresować ten problem, wykorzystaliśmy format znany z mediów społecznościowych - reelsy. Każdy z nich w prosty, narracyjny sposób pokazuje, jak działają smart features i w jaki sposób pomagają użytkownikowi podczas parkowania.

W przypadku aplikacji Skycash komfort oznacza wspieranie użytkownika w kluczowych momentach parkowania. Aplikacja przypomina o uruchomieniu opłaty za postój, a także pomaga zakończyć parkowanie, gdy użytkownik odjedzie z zajmowanego miejsca. Dodatkowo zapisuje lokalizację pojazdu i umożliwia łatwe odnalezienie auta.

UI, który wyróżni Skycash na rynku

Na rynku istnieje wiele aplikacji rozwiązujących podobny problem. Wyzwaniem nie było więc samo umożliwienie opłacenia parkowania, lecz zaprojektowanie interfejsu, który odzwierciedla nową propozycję wartości - komfort podróżowania niezależnie od wybranego środka transportu. W praktyce oznaczało to odejście od myślenia o aplikacji wyłącznie jako o narzędziu do płacenia za parking.

W rezultacie powstał interfejs, który nie tylko umożliwia wykonanie transakcji, ale realnie zwiększa poczucie komfortu podczas poruszania się po mieście samochodem.

W szczególności skupiliśmy się na następujących aspektach:
  • Dolna nawigacja inspirowana parkometrem– Projektując interfejs, dążyliśmy do stworzenia wizerunku marki wspierającej, a jednocześnie przyjaznej i dostępnej dla szerokiego grona użytkowników.
  • Każdy z kolorów reprezentuje inną funkcję w nawigacji
    W projekcie wykorzystujemy ciepłe, mocne barwy, które nadają interfejsowi charakterystyczny wygląd. Mocne kolory pozwalają na wyraźnie kluczowych usług w nawigacji.
  • Playful twist
    Nowy branding nawiązuje do znaków drogowych, pokazując je w uproszczony sposób. Geometryczne kształty nadają aplikacji dużo wizualnej przestrzeni.
W UI zaproponowaliśmy subtelne animacje, które podkreślają elegancję strony i wzbogacają interakcję, dodając jej nowoczesnego charakteru.

Kompletny Design System dla Skycash

Projekty digitalowe, a szczególnie aplikacje mobilne, wymagają przygotowania kompletnego design systemu. 



Design system porządkuje wszystkie elementy interfejsu: kolory, typografię, komponenty, stany interakcji oraz zasady ich użycia. Dzięki temu projekt pozostaje spójny wizualnie i funkcjonalnie, a zespół projektowy i deweloperski może szybciej rozwijać kolejne funkcje aplikacji bez konieczności projektowania wszystkiego od podstaw.



W przypadku Skycash design system był również fundamentem skalowania produktu - umożliwiał konsekwentne rozwijanie nowych usług i inteligentnych funkcji, przy jednoczesnym zachowaniu prostoty i czytelności.



UI powstał we współpracy z agencją microdose.

WCAG

W kontekście aplikacji używanej często „w biegu” dostępność staje się także elementem bezpieczeństwa - użytkownik musi być
w stanie szybko zrozumieć interfejs i wykonać kluczową akcję bez ryzyka pomyłki. Z aplikacji będą korzystać bardzo różne grupy użytkowników - w tym osoby starsze, osoby z ograniczeniami wzroku - każda z tych grup użytkowników znajdzie się w ruchu ulicznym lub w pełnym słońcu.

Dlatego każda ścieżka jest przygotowana w taki sposób, aby spełniać wymogi dokumentów:

Finalny projekt UI

Projekt łączy wszystkie aspekty w całość. Nowy branding, odświeżone logo, UX, który wspiera użytkownika, mikroanimacje i magiczny UI.

Zima pomagała nam przy nowej aplikacji mobilnej. Zespół dostarczył makietę, prototypy, finalne pliki UI oraz dokumentację WCAG. Zespół ZImy wprowadził również poprawki do naszego projektu panelu B2B. Trafiliśmy na ich dzięki rekomendacjom. Zdecydowlaiśmy się na współpracę ze względu na model pracy, jakość poprzednich projektów oraz rzetelną osobowość Ilony.

Magdalena Baltyn-Tokłowicz
Head of Product, Skycash

Nasz zespół pracował w modelu projektowym

Anna ŚląskaAnna Śląska
Anna Śląska
UX Designer
Karol MasternakKarol Masternak
Karol Masternak
UX Designer
Oskar PokorskiOskar Pokorski
Oskar Pokorski
UI Designer
Radek RejselRadek Rejsel
Radek Rejsel
Co-Owner | Strategy Designer
Ilona SkarbowskaIlona Skarbowska
Ilona Skarbowska
Co-Owner | Strategy Designer
zima design projekt yestersen

Zaprojektujmy  to razem!

Podczas 15-minutowej rozmowy z ekspertem możesz porozmawiać między innymi o tym, jak poprawić zadowolenie Twoich klientów, zaprojektować i przetestować MVP, stworzyć atrakcyjny i konkurencyjny design produktu, przeprowadzić audyt UX, UI, czy też usprawnić ścieżkę zakupową.

Przeczytaj