infoShare 2012 - Best practices dla dobrego mobile experience - Monika Mikowska, Anna Liszewska, Janmedia

2. Co to jest mobile experience?

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

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

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

8. Użytkownik
jest
najważniejszy!

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

10. Wyniki pewnego raportu…
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.

11. Na Androida projektuje się inaczej niż na iOS…
≠

12. Aplikacja iGetin - iOS vs. Anroid

13. Aplikacja Citi Mobile - iOS vs. Anroid

14. Język komunikatów i informacji zwrotnych
powinien byd jasny i precyzyjny
aplikacja Banku Millennium

15. Uwaga na zbyt długie komunikaty
aplikacja Banku Millennium

16. Kiedy layout nie jest dostosowany do kontekstu mobile…
aplikacja Alior Bank

17. Strona mobilna vs. aplikacja mobilna?

18. PlasticMobile.com

19. MobileAgency.nl

20. www.antyweb.pl

22. www.reserved.com/pl

24. Ale… niezależna strona mobilna może byd niepotrzebna! 
SmashingMagazine.com, źródło: http://www.awwwards.com/50-examples-of-responsive-web-design.html

25. Niezależna strona mobilna może byd niepotrzebna! 
StephenCaver.com, źródło: www.desingmodo.com

26. Niezależna strona mobilna może byd niepotrzebna! 
ForefathersGroup.com, źródło: www.desingmodo.com

27. Ograniczenia wynikające z technologii
mobilnych

28. Ograniczenia
• 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

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

30. Zaoferuj „więcej” albo „inaczej”
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
• ...

31. aplikacja Nearest Tube aplikacja The Milky Way

33. Best practices,
jak projektowad na mobile

34. Produkt należy dostosowad do sposobu, w jaki będzie
używany
strona mobilna m.ITAKA.pl

35. …dlaczego to takie ważne?
aplikacja Alior Bank

36. Dużo wiemy o tym, jak użytkownicy korzystają z aplikacji…
Źródło: „Mobile First”, Luke Wróblewski

37. …wykorzystajmy tę wiedzę!
aplikacja Endomondo Aplikacja Wezwij Taxi

38. Ułatwiajmy użytkownikom!
strona mobilna m.ITAKA.pl

39. Mała ilośd opcji – podstawowe funkcje są najistotniejsze
aplikacja Booking.com

40. Mała ilośd opcji – podstawowe funkcje są najistotniejsze
aplikacja Listonic aplikacja YouTube

41. Najważniejsza jest treśd (content is the king)
aplikacja Wyborcza

42. Aplikacja powinna wspierad działania użytkownika…
Strona mobilna JakDojade.com

43. …aby użytkownicy mogli się skupid na podstawowym
zadaniu
aplikacja iBankomaty

44. Jak wyróżnid najważniejsze elementy
aplikacja Evernote

45. Dodatkowe funkcje warto umieścid kontekstowo
aplikacja Chilli ZET

46. Trudne zadania należy podzielid na etapy
Realizacja przelewu w aplikacji PEKAO SA

47. Aplikacje mobilne projektuje się inaczej niż strony mobilne
aplikacja mBank strona mobilna mBank

48. „Zachowaj zgodnośd pomiędzy systemem a rzeczywistością”
Kontakty / iPad

49. Tam, gdzie to możliwe, warto naśladowad rzeczywistośd
aplikacja iBooks

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

51. Mobile First

52. The simple guideline is whatever you are
doing – do mobile first. Eric Schmidt, Google Chairman
Get into mobile first and then web second.
It’s teaching us a lot about how to design
back to the desktop. Kate Aronowitz, Facebook’s Director pf Design
A shift to think about mobile first is bigger
than we saw with the personal computing
revolution. Kevin Lynch, Adobe’s CTO
Źródło: „Mobile First”, Luke Wróblewski

53. DZIĘKUJEMY!
Gdybyście chcieli korespondowad:
mmikowska@janmedia.com
aliszewska@janmedia.com
Gdybyście chcieli poczytad:
http://jestem.mobi
http://webusability.pl