Felietony

Jak zachować doświadczenie użytkownika w prototypach mobilnych?

Grzegorz Marczak
Jak zachować doświadczenie użytkownika w prototypach mobilnych?
7

Tworzenie prototypów mobilnych jest problematyczne, ponieważ narzędzia do prototypowania nie pozwalają na odzwierciedlenie wszystkich interakcji typowych dla interfejsów dotykowych. Warto się jednak przyjrzeć możliwościom tworzenia interaktywnych makiet dla tego typu ekranów. Tworzenie mobilnych...

Tworzenie prototypów mobilnych jest problematyczne, ponieważ narzędzia do prototypowania nie pozwalają na odzwierciedlenie wszystkich interakcji typowych dla interfejsów dotykowych. Warto się jednak przyjrzeć możliwościom tworzenia interaktywnych makiet dla tego typu ekranów.

Tworzenie mobilnych prototypów wiąże się z tymi samymi zaletami, co dla aplikacji desktopowych czy webowych, a mianowicie:

  • Prototypowanie jest szybkim i tanim sposobem tworzenia kolejnych wersji projektu. Przetestowanie wielu koncepcji ułatwia znalezienie najlepszego rozwiązania. Zauważone wady poprawiane są w kolejnych iteracjach, bez kosztownego angażowania programistów i grafików.
  • Na prototypach przeprowadzać można badania z użytkownikami. Testy pozwalają na wykrycie błędów użyteczności, których projektant nie przewidział. Każdy badacz nie raz się przekonał, że interpretacja projektów przez użytkowników bywa zaskakująca.
  • Prototypy mogą posłużyć jako specyfikacja dla programistów. Dzięki odwzorowaniu mechanizmów działania, są one jednoznacznie interpretowane przez wszystkie osoby zaangażowane w projekt. Jest to szczególnie ważne w przypadku braku nadzoru nad etapem wdrażania projektu.
  • Prototypy usprawniają współpracę z Klientem. Zobrazowanie koncepcji daje pewność jednakowego zrozumienia omawianych rozwiązań. O wiele łatwiej jest też przekonać Klienta do swoich pomysłów, jeśli może się przez nie „przeklinać” i zobaczyć sposób ich działania.

Narysowanie omawianych koncepcji często uzmysławia, że członkowie zespołu mówili o różnych rzeczach.


Źródło.

Wyzwania związane z projektowaniem mobilnym

  1. Wykorzystanie możliwości ekranów dotykowych. Podstawowym sposobem obsługi urządzeń przenośnych są gesty. Opisać można ponad kilkadziesiąt różnych ruchów, na które reagują nasze smartfony. Na rynku pojawiają się coraz częściej programy do prototypowania dedykowane wyłącznie projektowaniu mobilnemu (np. narzędzie Proto.io). Ich zaletą jest obsługa większości gestów. Są to jednak dość proste programy, w których tworzenie interakcji ogranicza się do przechodzenia na kolejne ekrany. Nie ma tam możliwości zastosowania różnorodnych akcji na pojedynczym ekranie. Axure, pozwala na zastosowanie kilku gestów (np. tap, będący odpowiednikiem kliknięcia lewego przycisku myszki), jednak ich ilość jest ograniczona. Niektóre gesty w Axure można uzyskać dzięki właściwościom warstw (np. OnDragStart, OnSwipeLeft), jednak sprawne stosowanie tych funkcji wymaga dość dużych umiejętności obsługi tego narzędzia.
  2. Biblioteki gestów są coraz bogatsze.

    Źródło.

  3. Reakcja na zmianę orientacji urządzenia. Sposób trzymania smartfonów zależy często od przeglądanej treści. Zdarza się, że przeglądając jedną stronę kilkukrotnie zmieniamy orientację z horyzontalnej na wertykalną i odwrotnie. Zmiany te są jeszcze częstsze, kiedy korzystamy z telefonu wyposażonego w klawiaturę QWERTY. Zachowanie w prototypach zmiany orientacji jest szczególnie istotne podczas testów z użytkownikami, gdzie chcemy stworzyć jak najbliższe rzeczywistym warunki korzystania np. ze smartfonów. Niewiele narzędzi do prototypowania umożliwia stworzenie makiet reagujących na zmianę orientacji. Jednym z nich jest program Justinmind, przypominający wspomnianego wcześniej Axure.
  4. Narzędzie Justinmind obsługuje liczne gesty oraz zmianę orientacji

  5. Dopasowanie do zmian wielkości ekranu. Stworzenie interaktywnego prototypu, którego elementy reagowałyby na zmiany szerokości okna przeglądarki jest szczególnie trudne. W związku z coraz większą popularnością responsive web design, na rynku pojawia się wiele narzędzi mających ułatwiać projektowanie responsywne. Niestety, za ich pomocą można tworzyć jedynie proste szkice stron, bez dodawania pełnych interakcji, lub są to tylko programy generujące płynne gridy. Najbardziej rozwiniętym narzędziem jest Foundation firmy Zurb. Jego obsługa wymaga jednak umiejętności kodowania w HTML.
  6. Konieczność znalezienia specyficznych ikon np. projektując pod iOS. Większość narzędzi do projektowania wyposażyć można w dodatkowe biblioteki, w których znajdziemy ikony wykorzystywane w najpopularniejszych mobilnych systemach operacyjnych. Przykładowo, prototypując aplikację na iPada za pomocą Axure’a, wszystkie potrzebne elementy można znaleźć tutaj.

Jak przezwyciężyć problemy projektując prototypy mobilne?

Zacznij od kartki. Proces projektowania najlepiej zacząć od kartki i flamastra. Tworzone funkcjonalności nie są wtedy warunkowane przez ograniczenia narzędzi. Jest to najlepsza droga do stworzenia rzeczy innowacyjnych. Czasem zaprojektujemy na papierze funkcjonalność, która jest trudna lub nawet niemożliwa na do pokazania na klikanym prototypie. Jej działanie można wtedy oddać za pomocą dokładnego opisu lub odesłania do case’a, który zainspirował jej powstanie. Nie porzucajmy dobrych pomysłów tylko dlatego, że nie potrafimy pokazać ich działania w prototypie!

Papierowe prototypy są najlepszą drogą do tworzenia innowacyjnych rozwiązań.

Źródło.

Znajdź narzędzie odpowiednie dla Ciebie. Przeszukując sieć natrafić można na mnóstwo programów do prototypowania. Pomocne są również zestawienia porównujące wybrane narzędzia czy różnego rodzaju rankingi. Może Axure nie jest odpowiednim narzędziem w Twoim nowym projekcie i warto rozejrzeć się za czymś nowym?

Kombinuj i obchodź ograniczenia. W prezentacji Lennarta Henninga znajduje się kilka sztuczek, dzięki, którym można uczynić program Axure bardziej „mobile-friendly”. Jedną z nich jest manipulacja w kodzie programu, dzięki której podczas generowania prototypu otrzymujemy również QR kod. W szybki sposób można więc otworzyć projekt na urządzeniu mobilnym.

Podsumowanie

Narzędzia do prototypowania nie nadążają za wymaganiami jakie niesie ze sobą rozwój rynku mobilnego. Prototypować jednak trzeba. Decydując się na wykonanie w pełni interaktywnego prototypu mobilnego należy pamiętać o jednym. Im prototyp lepiej zachowuje doświadczenia użytkownika, tym nasza praca przeznaczona na jego stworzenie, przyniesie większe korzyści. Warto więc tej pracy włożyć trochę więcej.
W kolejnym artykule zamierzam dokładnie porównać programy do tworzenia w pełni interaktywnych makiet. Postaram się odpowiedzieć na pytanie, które narzędzie jest najlepiej przystosowane do tworzenia prototypów mobilnych.

Autor artykułu
Krzysztof Kozak
Krzysztof.Kozak@symetria.pl
UX Specialist

 

 

Symetria
Grupa Symetria świadczy kompleksowe usługi z obszaru
biznesu elektronicznego. Od 1998 roku eksperci Symetrii
doradzają i wykonują wdrożenia dla największych polskich
firm. Doświadczenie Symetrii budują także własne projekty
internetowe (Sympatia.pl, Vitalia.pl i Trener.pl).

www.symetria.pl
www.symetryczna.pl
www.facebook.com/Symetria.news

Hej, jesteśmy na Google News - Obserwuj to, co ważne w techu