- UX/UI
- luty 2022
- Tech To The Rescue × Mirumee
#TechFor
Projekt dla inicjatywy, która łączy firmy technologiczne z organizacjami pozarządowymi z Ukrainy. Wpłata miała być prosta, intuicyjna i mobilna — możliwa w dowolnym miejscu i czasie, w trzech tąpnięciach.
- 3tąpnięcia od kwoty do metody płatności
- 700+firm technologicznych z 84 krajów w inicjatywie
- 150+organizacji pozarządowych ze 117 krajów
Ilustracja: telefon ze stroną zbiórki — licznik zebranej kwoty w żółtych kafelkach i hasło „Pomóż osobom z Ukrainy”. Ktoś wybiera 65 zł, a licznik rośnie o tę wpłatę.
01 Brief
Wpłata, która mieści się w trzech tąpnięciach
Zadanie: zaprojektować web aplikację, która ułatwi i zachęci do wsparcia finansowego uchodźców z Ukrainy — i pokaże, jak organizacje humanitarne wykorzystują darowizny.
Prosta, intuicyjna i mobilna — żeby wpłacić można było w dowolnym miejscu i czasie.
- Kwoty, które mówią, co dająNocleg, leki, godzina terapii, bon żywnościowy — albo własna kwota.
- Trzy tąpnięciaKwota, „Pomagam”, metoda płatności.
- Metody z wyszukiwarkąPortfele, BLIK, karta i banki, filtrowane w trakcie pisania.
- BLIK cyklicznyNajpopularniejsza płatność w Polsce także dla wpłat co miesiąc.
- KartaKlawiatura numeryczna, rozpoznany wystawca, 3-D Secure.
- Rynki lokalnePre-authorized debit w Kanadzie.
- Zachęta do regularnościPo wpłacie jednorazowej — propozycja wpłat co miesiąc.
- PodziękowanieLicznik, filtr na Instagram i nakładka na FB.
02 Strona zbiórki
Kwota, która mówi, co za nią stoi
Strona zaczyna od licznika zebranej kwoty i hasła w barwach Ukrainy. Każda kwota ma opis tego, co sfinansuje — a niżej organizacja mówi, dlaczego pomoc musi być regularna.
Licznik
Zebrana kwota w żółtych kafelkach i liczba osób, które wpłaciły — od pierwszego ekranu.
Cyklicznie albo jednorazowo
Przełącznik stoi nad kwotami; wpłata cykliczna jest wybrana na start.
Kwoty z opisem
35 zł to interwencyjny nocleg, 65 zł dopłata do leków, 98 zł godzina psychoterapii, 150 zł bon żywnościowy dla rodziny. Można wpisać własną kwotę.
„Pomagam” po wyborze
Przycisk pojawia się dopiero przy wybranej kwocie i zostaje przy dolnej krawędzi ekranu.
- Teksty organizacji, mapa i ilustracje pochodzą z makiety pokazanej na planszach i nagraniu.
Przejdź do części strony
6 563 281 zł
Pomóż osobom z Ukrainy
Nawet niewielkie kwoty, wpłacane regularnie, pozwalają nam na stabilne działanie i długofalowe planowanie pomocy dla uchodźców.
#PomagamUchodźcom
#Regularnie
Do naszego kraju przybyło już ponad milion uchodźców. Do Polski w najbliższym czasie trafić może 4 mln uchodźców z Ukrainy. W związku z bardzo niskim kursem hrywny ludzie ci zostali z dnia na dzień pozbawieni środków do życia. Potrzebna jest długofalowa pomoc.
Nasze działania
Centrum Pomocy Cudzoziemcom
Organizujemy lekcje języka polskiego, przygotowujemy do rynku pracy, pomagamy wynająć mieszkanie, pomagamy wybrać odpowiednią szkołę dla dzieci i udzielamy pomocy w sytuacji kryzysowej.
Pomoc humanitarna
Prowadzimy monitoring sytuacji, udzielamy pomocy humanitarnej i prawnej uchodźcom i uchodźczyniom, nagłaśniamy sprawę, lobbujemy. Na miejscu otworzyliśmy tymczasową siedzibę naszej Fundacji. Wykorzystujemy całą wiedzę i doświadczenie 21 lat działalności.
Mieszkania dla uchodźców
Program integracyjno-mieszkaniowy Witaj w domu został uruchomiony w 2017 roku. Jest odpowiedzią Fundacji Ocalenie na podstawowe problemy w integracji uchodźców i uchodźczyń w Polsce: zagrożenie bezdomnością i ubóstwem, nieznajomość języka polskiego i problemy psychologiczne (w tym związane z traumą).
Pomoc psychologiczna
Oferujemy pomoc psychologiczną dla cudzoziemek i cudzoziemców – po polsku, angielsku i rosyjsku.
Kwoty, dane i kody są przykładowe
03 Trzy tąpnięcia
3 tąpnięcia do udzielenia wsparcia
Udzielenie wsparcia nigdy nie było tak proste.
Kwota
Jedno tąpnięcie wybiera kwotę i odsłania „Pomagam”.
„Pomagam”
Otwiera listę metod płatności — portfele są na górze.
Metoda
Apple Pay otwiera arkusz płatności z danymi z telefonu. Zostaje potwierdzenie Face ID.
Tąpnięcia
- 1
- 2
- 3
6 563 281 zł
Pomóż osobom z Ukrainy
Nawet niewielkie kwoty, wpłacane regularnie, pozwalają nam na stabilne działanie i długofalowe planowanie pomocy dla uchodźców.
Kwoty, dane i kody są przykładowe
04 Metody płatności
Wyszukiwarka metody płatności
Lista zaczyna się od portfeli, BLIK-a i karty, a pod nimi są banki. Wyszukiwarka zawęża ją przy każdej literze.
Portfele na górze
Apple Pay i Google Pay, potem BLIK i karta — metody, którymi płaci się najszybciej.
Szukanie w trakcie pisania
Pole „Szukaj” filtruje listę od pierwszej litery: „R” zostawia samego Revoluta, jak na nagraniu. Polskie znaki i wielkość liter nie mają znaczenia.
Dwie wersje listy
Nagrania pokazują listę z polskimi bankami i listę z metodami innych rynków: PayPal, PAD w Kanadzie, Boleto, Alipay i SEPA.
- Na planszy znak SEPA stoi przy Santanderze, a znak Santandera przy mBanku — w telefonie każdy znak jest przy swojej nazwie, a mBank ma monogram.
Wersja listy
Metody płatności
Metody płatności
Kwoty, dane i kody są przykładowe
05 BLIK
BLIK cykliczny
Wykorzystanie najpopularniejszej formy płatności w Polsce do płatności cyklicznych.
E-mail
Adres jest potrzebny do płatności — i do linku, którym darczyńca zarządza wpłatą cykliczną.
Kod z aplikacji banku
Sześć pól i klawiatura numeryczna; kod można skopiować w aplikacji banku i wkleić.
Potwierdzenie w banku
Ekran z latarnią prosi o potwierdzenie w aplikacji banku i powrót do zbiórki.
Aplikacja banku
370 454
Kod przykładowy — w telefonie obok można też wpisać dowolne 6 cyfr.
BLIK
Połączenie jest szyfrowanePodaj swój adres E-mail
Adres e-mail jest niezbędny do realizacji płatności. Otrzymasz na niego również link do zarządzania swoją płatnością cykliczną.
Kwoty, dane i kody są przykładowe
06 Karta
Płatność kartą
Klawiatura numeryczna od pierwszego pola, wystawca rozpoznany po pierwszych cyfrach i weryfikacja 3-D Secure z kodem SMS — jak na nagraniu.
Numer karty
Po pierwszych cyfrach podświetlony zostaje tylko znak wystawcy, a numer dzieli się na czwórki.
Data i CCV
Dwa krótkie pola obok siebie; „Dalej” zmienia kolor, gdy wszystkie są wypełnione.
3-D Secure
Strona banku z kodem SMS, który telefon podpowiada nad klawiaturą.
Karta
Połączenie jest szyfrowanePodaj dane karty
Raz w miesiącu będziemy pobierać z niej Twoją darowiznę.
Kwoty, dane i kody są przykładowe
07 Kanada
Pre-authorized debit in Canada
Autoryzacja w ujęciu lokalnym: kanadyjski PAD pobiera darowiznę raz w miesiącu z konta — po dwóch krótkich krokach.
Dane konta
Imię, nazwisko, numer instytucji i transit number — litery z klawiaturą liter, numery z numeryczną.
Numer konta
Osobny ekran na jeden, najdłuższy numer.
„Dalej” po komplecie
Przycisk ciemnieje dopiero wtedy, gdy wszystkie pola są wypełnione.
PAD Canada
Połączenie jest szyfrowanePodaj dane konta
Raz w miesiącu będziemy pobierać z niej Twoją darowiznę.
Kwoty, dane i kody są przykładowe
08 Regularnie
Zachęta do płatności cyklicznych
Jeśli użytkownik zamiast płatności cyklicznych wybierze płatność jednorazową, to w ostatnim kroku jest zachęcany do zmiany swojej decyzji.
Inne podziękowanie
Po wpłacie jednorazowej strona dziękuje, ale od razu tłumaczy, dlaczego ważna jest regularna pomoc.
Jeden przycisk
„Zadeklaruj regularne wpłaty” — w tym telefonie wraca do formularza z wpłatą cykliczną i tą samą kwotą.
Po wpłacie cyklicznej
Podziękowanie mówi o pierwszej pobranej płatności i comiesięcznym newsletterze.
„Ważna jest jednak regularna pomoc”
Podziękowanie po wpłacie
Dziękujemy za pomoc
6 563 281 zł
Twoje wsparcie pomoże sfinansować bieżące potrzeby. Ważna jest jednak regularna pomoc – wsparcie psychologiczne dla osób z traumą wojenną, lekcje wyrównawcze dla dzieci, programy aktywizacji zawodowej i wiele więcej. Dlatego ważna jest regularna pomoc.
Nakładka na profil, która pomaga
Powiedz światu o pomocy
W podziękowaniu za wsparcie przygotowaliśmy dla Ciebie specjalny filtr na Instagram Stories i nakładkę na zdjęcie profilowe na FB. Powiedz światu, że warto jest pomagać
Kwoty, dane i kody są przykładowe
09 Podziękowanie
Filtr na Instagram
Po dokonaniu wpłaty użytkownik jest zachęcany do podzielenia się informacją o zbiórce ze znajomymi.
Licznik z Twoją wpłatą
Podziękowanie pokazuje licznik — tutaj powiększony o przykładowe wpłaty z telefonów na tej stronie.
Filtr i nakładka
Filtr na Instagram Stories z barwami Ukrainy na policzkach i hasztagami zbiórki oraz nakładka na zdjęcie profilowe na FB.
Udostępnij zbiórkę
Trzeci przycisk przekazuje link do zbiórki dalej.
- Twarz w relacji jest rysunkiem — w makiecie było tu zdjęcie prawdziwej osoby.
Nakładka na profil, która pomaga
Powiedz światu o pomocy
W podziękowaniu za wsparcie przygotowaliśmy dla Ciebie specjalny filtr na Instagram Stories i nakładkę na zdjęcie profilowe na FB. Powiedz światu, że warto jest pomagać
Kwoty, dane i kody są przykładowe
10 Plansze i nagrania
Makiety, które działają
Sześć plansz, dwa pełne ekrany i sześć nagrań przepływów z case study. Dane osób, kart i kont w nagraniach są przykładowe, a twarz w relacji jest narysowana.
Apple Pay, Google Pay, BLIK, Visa, Mastercard, PayPal, Revolut, Alipay, Boleto, SEPA oraz nazwy i znaki banków należą do ich właścicieli; pokazane są tak, jak w makietach aplikacji.