54

New #mBank - Change of Design is Change of Everything

  • Upload
    mbank

  • View
    107

  • Download
    1

Embed Size (px)

DESCRIPTION

This deck was presented at the UX Poland convention - the largest UX/UI focused event in Central & Eastern Europe, in April 2013. New mBank - 10 most impactful financial innovations in one go. New mBank is a modern banking rendition of the 3rd largest retail bank in Poland with 3.5 million customers. New mBank won "Best of Show Award" at Finovate Europe in London in February 2013

Citation preview

Page 1: New #mBank - Change of Design is Change of Everything
Page 2: New #mBank - Change of Design is Change of Everything

Informacje nie są płaskie - bilety z podróży to historia przeżyć i emocji

Page 3: New #mBank - Change of Design is Change of Everything

Bankowość internetowa lat 90.

Page 4: New #mBank - Change of Design is Change of Everything

Banki internetowe z lat 90.

Page 5: New #mBank - Change of Design is Change of Everything

a

2013 rok – czy jest różnica?

Page 6: New #mBank - Change of Design is Change of Everything
Page 7: New #mBank - Change of Design is Change of Everything
Page 8: New #mBank - Change of Design is Change of Everything
Page 9: New #mBank - Change of Design is Change of Everything

Słuchanie na magnetofonie

Słuchanie na PC

Odkrywanie utworów moich znajomych

ŚWIAT ZMIENIA SIĘ NIELINIOWO

Nowe serwisy zmieniają to jak słuchamy i korzystamy z usług muzycznych…

Przesyłanie MP3

Page 10: New #mBank - Change of Design is Change of Everything

Poprzednio Nowe zachowania

Oglądanie Domowy TV Polecane %lmy z YT

Praca Wysyłanie CV Uzupełnianie rekomendacji na LinkedIn

Wymiana Stadion X-lecia z grami Zakup z Allegro bez oglądania

Notowanie Xero notatek Ani Ściągi z chomika

Prasa Kupowanie gazet do autobusu Czytniki z GSM w metrze

Poszukiwanie Słownik XX tomowy w domu Wikipedia z searchem

Mapy Planowanie drogi za granicę GPS z informacją o POI i ceną benzyny

Filmy Kluczowe zdanie krytyka Rekomendacja społeczności co zobaczyć

Wydarzenia Ogólnopolska gazeta i wiadomości Lokalny Internet i prywatny news-feed

Księgarnia Zakup i pożyczanie książek Przeglądanie komentarzy i zamawianie z Amazon.com

NOWY DESIGN – EMERGENCJA NOWYCH USŁUG

Page 11: New #mBank - Change of Design is Change of Everything

Płaskie 2D Gra+czne 3D Kontekstowe 4D

Statyczna informacja z ery informacji

Wizualizacja informacji przyśpieszająca odbiór

komunikacji

Wydarzenia informacyjne oddające kontekst zakupu

w erze konceptualnej

Obecnie korzystamy z informacji zależnej od kontekstu i czasu, znacznie silniej niż poprzednio

DLACZEGO BRAK ZMIAN W BANKOWOŚCI?

Page 12: New #mBank - Change of Design is Change of Everything

INNOWACJE ZMIENAJĄ BANKOWOŚĆ

Payoff.com – MOTYWACJA JAK GRA Nagradzanie za osiąganie celów %nansowych, abym miał więcej na

koncie

Simple - TYLKO POTRZEBNE

INFORMACJE $4,00 za kawę wskazane na mapie,

automatycznie z kategoryzowane, tak więc wiem ile mi zostało do wydania

SmartyPig - SPOŁECZNOŚĆ MNIE

ZMOTYWUJE Zbierasz szybciej na MacBooka ze

wsparciem rodziny i znajomych

Page 13: New #mBank - Change of Design is Change of Everything

INNOWACJE ZMIENAJĄ BANKOWOŚĆ

AKBANK – ŚLEDŹ ZMIANY GOTÓWKI

Z cash)ow szybko dowiesz się o efektywności wydawania

SQUARE - ZAPŁAĆ KARTĄ WSZĘDZIE Nawet mała %rma może zbierać opłaty

za pomocą karty – w dowolnym miejscu przez telefon

CARDLITICS – PROMOCJE BEZ KUPONÓW

Oferta BodyShop w historii konta, dostępna na kliknięcie

Page 14: New #mBank - Change of Design is Change of Everything

JUŻ CZAS NA ZMIANY W BANKACH

BANKI nie rozumieją

projektowania

nie znają procesu UX

nie potra+ą ocenić pracy

designera nie chcą zmieniać

swoich procesów

Page 15: New #mBank - Change of Design is Change of Everything

Proces – design to zmiana myślenia

Page 16: New #mBank - Change of Design is Change of Everything
Page 17: New #mBank - Change of Design is Change of Everything

Limit czasowy i ogromna złożoność projektu UX stał się integralną %lozo%ą organizacji i myślenia

REKONSTRUKCJA DO MODELU Z UX

14 miesięcy przygotowań

Page 18: New #mBank - Change of Design is Change of Everything

PROCES PROJEKTOWANIA UI/UX

Analizy eksploracyjne i innowacji •  Trendy •  Benchmarki •  Doświadczenia z

mBanku

Strategia User Experience •  Persony mBanku •  Scenariusze

użytkowników •  Punkty interakcji •  UI/UX dla nawigacji

Koncepcje kreatywne •  Projektowanie

wyglądu •  Analizy

eyetrackingowe postrzegania

•  Testy UX koncepcji

Design development •  Projektowanie AI

nawigacji i makiet •  Wiele testów UX •  Projektowanie GUI •  Interakcje i

animacje

Page 19: New #mBank - Change of Design is Change of Everything

PROCES PROJEKTOWANIA UI/UX

Ponad 400 +nalnych makiet UI/UX (przy ponad

1700 makietach roboczych)

Analizy eksploracyjne i innowacji •  Trendy •  Benchmarki •  Doświadczenia z

mBanku

Strategia User Experience •  Persony mBanku •  Scenariusze

użytkowników •  Punkty interakcji •  UI/UX dla nawigacji

Koncepcje kreatywne •  Projektowanie

wyglądu •  Analizy

eyetrackingowe postrzegania

•  Testy UX koncepcji

Design development •  Projektowanie AI

nawigacji i makiet •  Wiele testów UX •  Projektowanie GUI •  Interakcje i

animacje

Page 20: New #mBank - Change of Design is Change of Everything

PROCES PROJEKTOWANIA UI/UX

1050 godzin testów UX z klientami i potencjalnymi użytkownikami

(bez UAT i beta testów)

Ponad 400 +nalnych makiet UI/UX (przy ponad

1700 makietach roboczych)

Analizy eksploracyjne i innowacji •  Trendy •  Benchmarki •  Doświadczenia z

mBanku

Strategia User Experience •  Persony mBanku •  Scenariusze

użytkowników •  Punkty interakcji •  UI/UX dla nawigacji

Koncepcje kreatywne •  Projektowanie

wyglądu •  Analizy

eyetrackingowe postrzegania

•  Testy UX koncepcji

Design development •  Projektowanie AI

nawigacji i makiet •  Wiele testów UX •  Projektowanie GUI •  Interakcje i

animacje

Page 21: New #mBank - Change of Design is Change of Everything

STARTUJĄC Z BIAŁĄ KARTKĄ

Page 22: New #mBank - Change of Design is Change of Everything

PROJEKTOWANIE JAK W APPLE

Page 23: New #mBank - Change of Design is Change of Everything

W BUDOWANIU NOWYCH USŁUG NMB WSPÓŁPRACUJĄ ZE SOBĄ 3 ŚWIATY: BIZNES, IT ORAZ UX

Ściany i odległość utrudniają współpracę

Page 24: New #mBank - Change of Design is Change of Everything

NOWY MODEL: BIZNES, IT ORAZ UX

Zaufanie i efekty zmian w UI/UX tylko przy głębokiej współpracy biurko w biurko

Page 25: New #mBank - Change of Design is Change of Everything

Każdy jest królem w swoim królestwie. Niestety, w królestwach panują inne języki. Trudno się dogadać.

Mamy wspólne królestwo, którym jest platforma transakcyjna. Wszyscy mówimy po polsku dlatego rozumiemy się bez problemu. Wspieramy się i dajemy z siebie to, co najlepsze.

NOWY MODEL: BIZNES, IT ORAZ UIUX

START PROJEKTU NmB– SPOTKANIE EKSPERTÓW OBECNIE W NmB – ONE TEAM EKSPERCKI

Page 26: New #mBank - Change of Design is Change of Everything

ROBOCZY WIDOK UI BUDŻETÓW

Page 27: New #mBank - Change of Design is Change of Everything

KONCEPCJA 3 WIDOKU UI OSZCZĘDNOŚCI

Page 28: New #mBank - Change of Design is Change of Everything

KONCEPCJA UI SZYBKICH PRZELEWÓW

Page 29: New #mBank - Change of Design is Change of Everything

KONCEPCJA UI AKTYWÓW I PASYWÓW

Page 30: New #mBank - Change of Design is Change of Everything

KONCEPCJA UI PULPITU

Page 31: New #mBank - Change of Design is Change of Everything

KONCEPCJA UI TRENDÓW

Page 32: New #mBank - Change of Design is Change of Everything

KONCEPCJA UI PLANOWANIA PŁATNOŚCI

Page 33: New #mBank - Change of Design is Change of Everything

ROBOCZA UI OSZCZĘDNOŚCI

Page 34: New #mBank - Change of Design is Change of Everything

ITERACYJNE BADANIA UX

Page 35: New #mBank - Change of Design is Change of Everything

Metro UI czy skeumor%zm?

GUI CZĘSTO MIĘDZY SZKOŁĄ FALENICKĄ I OTWOCKĄ ;-)

Page 36: New #mBank - Change of Design is Change of Everything

WORD czy iA writer?

GUI CZĘSTO MIĘDZY SZKOŁĄ FALENICKĄ I OTWOCKĄ ;-)

Page 37: New #mBank - Change of Design is Change of Everything

Vine (z Twittera) czy Instagram (z Facebooka)?

GUI CZĘSTO MIĘDZY SZKOŁĄ FALENICKĄ I OTWOCKĄ ;-)

Page 38: New #mBank - Change of Design is Change of Everything

Haze App czy pogoda na iOS?

GUI CZĘSTO MIĘDZY SZKOŁĄ FALENICKĄ I OTWOCKĄ ;-)

Page 39: New #mBank - Change of Design is Change of Everything

GUI

Page 40: New #mBank - Change of Design is Change of Everything

GUI

Page 41: New #mBank - Change of Design is Change of Everything

Rede+nicja usług wymaga pełnego koła

Page 42: New #mBank - Change of Design is Change of Everything

TRUDNE ZADANIE DLA ZESPOŁU…

Page 43: New #mBank - Change of Design is Change of Everything

…ALE TO JEDEN Z WIELU ETAPÓW PRAC

Page 44: New #mBank - Change of Design is Change of Everything

1. NOWE UX - ANALIZA PŁYNNOŚCI przewidywane wydatki obciążają konto, identy%kując problem na eKoncie użytkownika…

REKONSTRUKCJA PROCESÓW PRZEZ UX

Page 45: New #mBank - Change of Design is Change of Everything

2. NOWE UX - REKOMENDACJA BANKU …w szczegółach pojawia się dedykowana oferta rozwiązania problemu mniejszych środków…

1. ANALIZA RTM - identy+kacja niskiej płynności

REKONSTRUKCJA PROCESÓW PRZEZ UX

Page 46: New #mBank - Change of Design is Change of Everything

3. NOWE UX - BRAK FORMALNOŚCI TO NOWY PROCES …konkretna, kontekstowa, oferta kredytu nie wymaga

więcej formalności od stałego klienta banku, tylko 2 kliknięcia i…

REKONSTRUKCJA PROCESÓW PRZEZ UX

Page 47: New #mBank - Change of Design is Change of Everything

4. NOWE UX - SCORING W 2 MIN TO ZMIANA PROCESU …scoring kredytowy online – na jednym ekranie, bez

papieru, a decyzja o przyznanym kredycie może trwać 2 min!

REKONSTRUKCJA PROCESÓW PRZEZ UX

Page 48: New #mBank - Change of Design is Change of Everything

Spełnianie trudnych oczekiwań

REALNE UX TO ZMIANA W ŻYCIU

Bank Klient Merchant

Page 49: New #mBank - Change of Design is Change of Everything

REALNE UX TO ZMIANA W ŻYCIU

Dla realnych udoskonaleń konieczne jest zmienienie procesu biznesowego i back-endu IT o nowe komponenty social share i gift

Page 50: New #mBank - Change of Design is Change of Everything

WERSJA BETA - mOKAZJE

Page 51: New #mBank - Change of Design is Change of Everything

mOkazje – świetny fornt-end i value dla klienta, natomiast w back-endzie nowe procesy biznesowe. Wykorzystanie natywnych cech Facebooka – sharing, gifting, MGM nie byłoby możliwe bez przemodelowania procesów bankowych. ERGO: Ale AI i design, to nie tylko to co widzi klient i to, co kryje się pod wierzchołkiem góry lodowej. W dzisiejszych czasach design wnika już nawet w życie klienta, w jego zachowanie i preferencje.

ODCZUWALNE UX - W REALNYM ŻYCIU

WARTOŚĆ Z UX – REALNY ZYSK

REKONSTRUKCJA PROCESÓW

Page 52: New #mBank - Change of Design is Change of Everything

mBank już niedługo startujemy

Page 53: New #mBank - Change of Design is Change of Everything

JUŻ NIEDŁUGO STARTUJEMY

Pre-launch Launch

§  Otwarcie dla wszystkich §  Szeroka komunikacja

zmian

§  Ekskluzywny dostęp dla chętnych

§  Kampanie odkrywające innowacje

§  Dedykowany dla innowatorów i early

adopterów

Page 54: New #mBank - Change of Design is Change of Everything

Zmiana designu to zmiana wszystkiego!