Co to jest mobile experience?

Rok 2012 został okrzyknięty rokiem mobile.Ale… to my – branża – tak go nazwaliśmy! Nie nasi klienci, ani nie dalsi użytkownicy.

Też znamy te wszystkie statystyki ;)Ale nie one są najważniejsze…

Skupmy się na użytkownikach!Mobile experience może byd takie jak tu. A przecież…

Użytkownikjestnajważniejszy!

Najczęściej popełniane błędy projektantów

1. Wykorzystanie w aplikacjach na Android wzorów nawigacji i interakcji z platformy iOS.

2. Brak spójności w nawigacji.

3. Brak pomocy i wsparcia użytkownika podczas wykonywania zadao.

4. Mało precyzyjny język komunikatów i informacji zwrotnych.

5. Layout i grafika niedostosowana do kontekstu mobile.

Wyniki pewnego raportu…

Na Androida projektuje się inaczej niż na iOS…

≠

Aplikacja iGetin - iOS vs. Anroid

Aplikacja Citi Mobile - iOS vs. Anroid

Język komunikatów i informacji zwrotnych powinien byd jasny i precyzyjny

aplikacja Banku Millennium

Uwaga na zbyt długie komunikaty

aplikacja Banku Millennium

Kiedy layout nie jest dostosowany do kontekstu mobile…

aplikacja Alior Bank

Strona mobilna vs. aplikacja mobilna?

PlasticMobile.com

MobileAgency.nl

www.antyweb.pl

www.reserved.com/pl

SmashingMagazine.com, źródło: http://www.awwwards.com/50-examples-of-responsive-web-design.html

Ale… niezależna strona mobilna może byd niepotrzebna!

StephenCaver.com, źródło: www.desingmodo.com

Niezależna strona mobilna może byd niepotrzebna!

ForefathersGroup.com, źródło: www.desingmodo.com

Niezależna strona mobilna może byd niepotrzebna!

Ograniczenia wynikające z technologii mobilnych

• mały ekran = mniej miejsca

• internet mobilny = wolny transfer danych

• kontekst użycia

• miejsce -> wszędzie

• czas -> szybko

• niepełna uwaga = jednym okiem i jednym palcem

Ograniczenia

Wykorzystanie możliwości, które daje mobile

Zarówno rozwiązania na PC, jak i na urządzenia mobilne mogą zaspokajad potrzeby użytkownika, ale robią to w zupełnie odmienny sposób.

O wykorzystanie proszą się:

• aparat, kamera, speaker...

• czujnik światła

• akcelerometr

• NFC

• ...

Zaoferuj „więcej” albo „inaczej”

aplikacja Nearest Tube aplikacja The Milky Way

Best practices, jak projektowad na mobile

Produkt należy dostosowad do sposobu, w jaki będzie używany

strona mobilna m.ITAKA.pl

…dlaczego to takie ważne?

aplikacja Alior Bank

Źródło: „Mobile First”, Luke Wróblewski

Dużo wiemy o tym, jak użytkownicy korzystają z aplikacji…

…wykorzystajmy tę wiedzę!

aplikacja Endomondo Aplikacja Wezwij Taxi

Ułatwiajmy użytkownikom!

strona mobilna m.ITAKA.pl

Mała ilośd opcji – podstawowe funkcje są najistotniejsze

aplikacja Booking.com

Mała ilośd opcji – podstawowe funkcje są najistotniejsze

aplikacja Listonic aplikacja YouTube

Najważniejsza jest treśd (content is the king)

aplikacja Wyborcza

Aplikacja powinna wspierad działania użytkownika…

Strona mobilna JakDojade.com

…aby użytkownicy mogli się skupid na podstawowym zadaniu

aplikacja iBankomaty

Jak wyróżnid najważniejsze elementy

aplikacja Evernote

Dodatkowe funkcje warto umieścid kontekstowo

aplikacja Chilli ZET

Trudne zadania należy podzielid na etapy

Realizacja przelewu w aplikacji PEKAO SA

Aplikacje mobilne projektuje się inaczej niż strony mobilne

aplikacja mBank strona mobilna mBank

„Zachowaj zgodnośd pomiędzy systemem a rzeczywistością”

Kontakty / iPad

Tam, gdzie to możliwe, warto naśladowad rzeczywistośd

aplikacja iBooks

Na koniec najważniejsze – zgodnośd z wytycznymi!

Mobile First

Źródło: „Mobile First”, Luke Wróblewski

The simple guideline is whatever you are doing – do mobile first.

Get into mobile first and then web second. It’s teaching us a lot about how to design back to the desktop.

A shift to think about mobile first is biggerthan we saw with the personal computingrevolution.

Eric Schmidt, Google Chairman

Kate Aronowitz, Facebook’s Director pf Design

Kevin Lynch, Adobe’s CTO

DZIĘKUJEMY!

Gdybyście chcieli korespondowad:

mmikowska@janmedia.comaliszewska@janmedia.com

Gdybyście chcieli poczytad:

http://jestem.mobihttp://webusability.pl