Sztuka Projektowania Aplikacji Mobilnych

Wielkość: px

Rozpocząć pokaz od strony:

Download "Sztuka Projektowania Aplikacji Mobilnych"

Sylwia Marciniak
6 lat temu
Przeglądów:

2 Sztuka Projektowania Aplikacji Mobilnych

3 Aktywacji telefonów z Androidem dziennie

4 2 Miesiące

5 250 mln Aktywacji Androida do Stycznia 2012

6 250 mln 250 mln 1 mln

7 Ogromny rynek dla twórców aplikacji

8 Ogromny rynek dla twórców aplikacji ale...

9 Ponad 400 tys. Aplikacji w Android Market Źródło grafiki:

10 Ponad 400 tys. Aplikacji w Android Market (olbrzymia konkurencja) Źródło grafiki:

11 Jak zostać zauważonym przez Użytkowników?

12 Źródło grafiki:

14 Ikona jest opakowaniem, pierwszym wrażeniem przy zetknięciu z aplikacją szata graficzna ogólny wygląd, zachęca do dłuższego zwrócenia uwagi i pobrania aplikacji wrażenia z użytkowania smak aplikacji pozwala zatrzymać użytkownika na stałe i przywiązać go do aplikacji Źródło grafiki:

aplikacji wrażenia z użytkowania smak aplikacji pozwala zatrzymać użytkownika

15 Ikona jest opakowaniem, pierwszym wrażeniem przy zetknięciu z aplikacją szata graficzna ogólny wygląd, zachęca do dłuższego zwrócenia uwagi i pobrania aplikacji wrażenia z użytkowania smak aplikacji pozwala zatrzymać użytkownika na stałe i przywiązać go do aplikacji Źródło grafiki:

16 Design Istota doskonałej aplikacji

17 Niestety...

18 Niestety... Większość aplikacji w Android Market jest fatalnie zaprojektowana

20 Rozwiązanie problemu: Design UI patterns

21 3 wzorce

22 1

23 Action Bar

24 Przycisk Home

25 Przycisk Home Tytuł aktualnego okna

26 Przycisk Home Przyciski akcji Tytuł aktualnego okna

27 2

28 Dashboard

30 Action Bar

31 Action Bar Menu w postaci siatki

32 Ludzkość od najdawniejszych czasów używała symboliki obrazów. Źródło grafik: flickr.com autorzy: JackVersloot, espinr

33 Ludzkość od najdawniejszych czasów używała symboliki obrazów. Człowiek dużo szybciej rozpozna symbol, niż słowo pisane Źródło grafik: flickr.com autorzy: JackVersloot, espinr

34 Action Bar Menu w postaci siatki Dodatkowa funkcjonalność

35 Co jednak kiedy potrzebujemy zaprezentować dużą liczbę danych na małym ekranie?

36 3

37 Workspaces

39 Action Bar

40 Action Bar Zakładki z tytułami

41 Action Bar Zakładki z tytułami Treść aktualnej zakładki

42 Przykłady

43 Android Market

44 Gigbeat

45 doubletwist Player

46 Podsumowując 3 ogólne wzorce projektowania UI

47 Action Bar pomaga w nawigacji. Mówi w jakiej aplikacji jesteśmy, w którym z jej okien się znajdujemy, oraz co w tym miejscu możemy zrobić 3 ogólne wzorce projektowania UI

48 Dashboard okno główne aplikacji. Pozwala w mgnienu oka zorientować się jakie możliwości daje nam aplikacja 3 ogólne wzorce projektowania UI

49 Workspaces daje możliwość prezentacji dużej ilości powiązanych ze sobą danych w intuicyjny sposób 3 ogólne wzorce projektowania UI

50 Porozmawiajmy o szczegółach

51 Demo

52 Aplikacja Demo Android 2.1 lub nowszy

53 Studium przypadku: TimePicker

55 ? Jak łatwiej i efektywniej ustawiać czas bądź wybierać godzinę?

56 Zmienić sposób myślenia

57 Źródło grafiki: flickr.com autor: Dave Dugdale

58 Źródło grafiki: flickr.com autor: A6U571N

59 kliknięcie

60 kliknięcie

61 przewijanie

62 Spinner hasło: spinner

63 Spinner TimePicker + ekspresowa implementacja - nieatrakcyjny wygląd - nie działa w 100% jak powinien

64 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna?

65 Wykorzystać doświadczenia projektantów innych platform

66 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna

67 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna a

68 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna a a

69 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna a a a

70 Jak udoskonalić koncepcję? Wymagania kontrolki: - prostota użycia - efektywność - mechanizm przewijania - atrakcyjność wizualna a a a a

71 Jak zaimplementować TimePicker wzorowany z ios na platformie Android?

72 ListView hasło: list

73 ListView TimePicker + dość szybka implementacja + niemal w pełni spełnia oczekiwania wobec kontrolki - stwarza pewne ograniczenia

74 Własne View hasło: view

76 CustomView TimePicker + działa zgodnie z wymaganiami + atrakcyjny wygląd + w pełni konfigurowalna + brak ograniczeń - dłuższa implementacja

77 Studium przypadku: TimePicker TimePicker - zły design, prosty, lecz nieefektywny Spinner TimePicker lepszy, ale ma nieatrakcyjny wygląd ListView TimePicker posiada wszystko czego trzeba, lecz ma również ograniczenia CustomView TimePicker idealne rozwiązanie. Wymaga dłuższej implementacji

78 Przesada?

79 Najważniejszy jest użytkownik

80 Be a yardstick of quality. Some people aren't used to an environment where excellence is expected. Steve Jobs Bądźcie miarą jakości. Ludzie nie przywykli do środowiska gdzie oczekiwana jest doskonałość

82 Jeszcze jedna rzecz...

84 Dziękuję Plik pdf prezentacji, aplikacja demo, oraz jej kod, będą dostępne pod adresem:

Podobne dokumenty

Projektowanie, tworzenie aplikacji mobilnych na platformie Android

Program szkolenia: Projektowanie, tworzenie aplikacji mobilnych na platformie Android Informacje: Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania: Forma: Projektowanie, tworzenie aplikacji mobilnych