Otwarcie Pon - Sob 09:00-18:00
Email info@westom.pl Zadzwoń +48 530 825 825
Otwarcie Pon - Sob 09:00-18:00
Email info@westom.pl Zadzwoń +48 530 825 825

User experience dla urządzeń mobilnych

Urządzenia mobilne stają się coraz bardziej popularne i coraz więcej użytkowników chętniej z nich korzysta. Dla wszystkich właścicieli witryn jest to wspaniała wiadomość. Mogą dzięki temu zyskać jeszcze więcej nowych użytkowników, dotrzeć do różnych grup potencjalnych klientów i zwiększyć ruch na stronie.

User experience w przypadku projektowania witryn dla urządzeń przenośnych wygląda nieco inaczej niż podczas pracy nad witrynami wyświetlanymi tylko na urządzeniach stacjonarnych. W zasadzie w obecnych czasach większość witryn jest już mobilna, responsywna lub posiada swoje aplikacje. Użytkownicy korzystają ze stron mobilnych i aplikacji w innym kontekście niż w przypadku urządzeń stacjonarnych. Projektowanie user experience wygląda w tym przypadku podobnie, ale trzeba wziąć dodatkowo pod uwagę kilka innych kwestii.

 

Kim są użytkownicy i kiedy korzystają z urządzeń mobilnych?

 

W pierwszej kolejności należy dowiedzieć się, kim są użytkownicy oraz kiedy i gdzie korzystają z urządzeń mobilnych. Czy wykonują w tym czasie jeszcze jakieś dodatkowe czynności? Może jadą w tym czasie komunikacją miejską do pracy, może korzystają ze smartfonu, pijąc kawę w centrum handlowym albo w domu podczas wykonywania codziennych obowiązków? Odpowiedz na te pytania, a będzie łatwiej podjąć Ci ważne decyzje projektowe. Pomogą Ci w tym odpowiednie narzędzia, które w większości już znasz:

  • Profile postaci.
  • Modele zadań.
  • Testy z udziałem użytkowników w środowisku mobilnym.
  • Ocena ekspercka z wykorzystaniem urządzeń przenośnych.
  • Analiza danych z narzędzi analitycznych (np. Google Analytics).

Następnie należy wyodrębnić sytuacje, w których użytkownicy najczęściej korzystają z urządzeń mobilnych. Do najczęściej używanych urządzeń mobilnych należą smarfony. Smartfonów użytkownicy używają głównie w poniższych sytuacjach:

  • W komunikacji miejskiej – osoby, które dojeżdżają do pracy często spędzają nawet kilka godzin w autobusach, pociągach czy metrze. Najlepszym umilaczem dla zabicia czasu jest smartfon.
  • W poczekalniach – gdy użytkownicy czekają w kolejce do lekarza, w banku, czy na lotnisku często mają w ręku telefon.
  • Czekając na kogoś – użytkownik umawia się z kimś na spotkanie, ale ta osoba się spóźnia. Nie ma za bardzo wielu opcji do wyboru – musi czekać. Smartfon może „skrócić” czas oczekiwania.
  • Szukając czegoś – użytkownicy używają smartfonów, gdy chcą znaleźć w pobliżu swojego miejsca zamieszkania sklep, restaurację, atrakcje turystyczne czy najbliższy przystanek autobusowy.
  • W momentach krytycznych – gdy coś stało się nagle np. popsuł samochód czy zachorowało dziecko i trzeba natychmiast wezwać pomoc czy znaleźć jak najszybsze rozwiązanie danego problemu.
  • W domu – w tym przypadku kontekst użytkowania jest bardzo zróżnicowany. Użytkownicy mogą korzystać tylko ze smartfonu traktując go jako formę odpoczynku, ale mogą też jednocześnie robić wiele innych rzeczy np. gotować obiad, oglądać telewizję czy słuchać muzyki.

Jakie działania użytkownicy wykonują najczęściej na urządzeniach mobilnych?

  • Korzystają z portali społecznościowych – użytkownicy smartfonów bardzo często korzystają z portali społecznościowych takich, jak Instagram, Facebook, Twitter czy Google+. Dodają swoje zdjęcia, udostępniają relacje, klikają polubienia i komentują interesujące ich tematy.
  • Korzystają z aparatu – robią zdjęcia prywatne, skanują kody kreskowe, robią zdjęcia produktów itp.
  • Notują – zapisują interesujące ich linki, wydarzenia w kalendarzu i robią inne zapiski w notatniku.

Korzystając z urządzeń przenośnych uwaga użytkowców jest rozproszona. Na ogół wykonują w tym czasie inne czynności i tylko pobieżnie zapoznają się z treścią. Jak pomóc użytkownikom? Jak ułatwić im pracę, aby szybko mogli załatwić to, co chcą? Oto kilka przydatnych wskazówek:

  • Umożliwienie użytkownikom szybkiego i prostego udostępniania oraz zapisywania informacji.
  • Stworzenie jak najkrótszej głównej ścieżki użytkownika na witrynie.
  • Zapewnienie szybkich i prostych sposobów na wykonanie pożądanych przez użytkowników działań.
  • Wykorzystanie geolokalizacji, jeśli tylko jest taka możliwość – użytkownik szybko znajdzie w swojej okolicy to, co go interesuje.
  • Stosowanie prostych formularzy – jeśli użytkownik ma coś wypełniać, to niech to będzie jak najprostsze i jak najszybsze.

 

Różne ścieżki użytkowników

 

Projektując interfejs witryny należy brać pod uwagę różne wielkości ekranów, na których będą wyświetlane strony. Użytkownicy nie ograniczają się tylko do laptopów i smarfonów. Mogą jeszcze wyświetlać witryny na tabletach, monitorach komputerów stacjonarnych, a nawet telewizorach. Każdy ekran ma inną wielkość i inną rozdzielczość. Zakres jest bardzo szeroki. Od kilkucalowych ekranów do tych wielkości niemal całej ściany.

Projektując witryny, które mają być obsługiwane na wielu urządzeniach należy przede wszystkim zachować spójność i jednolitość. Oferta na urządzeniach stacjonarnych nie może przedstawiać się zupełnie inaczej niż na urządzeniach mobilnych. Takie podejście tylko zdenerwuje użytkowników. Internauci muszą mieć dobre wrażenia bez względu na to, z jakiego urządzenia akurat korzystają.

Jakby tego było mało ścieżka użytkownika może zacząć się na jednym urządzeniu, a zakończyć na innym. Na przykład użytkownik może oglądać dany produkt w smarfonie (który zobaczył wcześniej w sklepie stacjonarnym) jadąc do domu komunikacją miejską, a ostatecznego zakupu może dokonać dopiero w domu na komputerze stacjonarnym. Przyjrzyjmy się bliżej takiej ścieżce na przykładzie zakupu plecaka turystycznego:

  • Użytkownik na ulicy zobaczył przechodnia, który miał dokładnie taki plecak, jaki by on sam potrzebował. Logo marki było bardzo wyraźne na plecaku, więc po pracy użytkownik udał się do tego sklepu stacjonarnego.
  • W sklepie stacjonarnym użytkownik otrzymał informacje, że ten model plecaka dostępny jest tylko w sklepie internetowym.
  • Wracając do domu komunikacją miejską użytkownik odwiedził sklep internetowy, gdzie ma być dostępny plecak. Ten model akurat jest w promocji, co jeszcze bardziej ucieszyło użytkownika. Dokonał rejestracji w sklepie, ale z ostatecznym zakupem jeszcze się wstrzymał.
  • Po powrocie do domu użytkownik jeszcze raz obejrzał plecak korzystając ze swojego komputera stacjonarnego i ostatecznie dokonał pomyślnej transakcji.

Jakie rozwiązania można zaproponować użytkownikowi, aby jeszcze łatwiej było mu korzystać jednocześnie z wielu kanałów?

  • Umożliwić użytkownikowi łatwe zapisywanie i udostępnianie informacji.
  • Można zaproponować użytkownikowi zainstalowanie aplikacji na smarfona ułatwiającej dokonywanie zakupów.
  • Dać możliwość szybkich zakupów na urządzeniach mobilnych dla użytkowników zarejestrowanych już na urządzeniach stacjonarnych.
  • Na witrynie zamieścić informacje o punktach stacjonarnych firmy – najbliższe placówki, godziny otwarcia itp.
  • Wszystkie najważniejsze treści i wezwania do działania powinny być dostosowane do wyświetlania na wyświetlaczach o różnej wielkości.

Przydatne wskazówki odnośnie projektowania witryn dla urządzeń mobilnych:

  • Ustalenie priorytetów – czego użytkownicy najbardziej oczekują od witryn i aplikacji dostępnych na urządzeniach mobilnych? W jakim celu będą z nich korzystać? Czy będą chcieli znaleźć lokalizację? Będą chcieli coś wyszukać na stronie? Zrobić zakupy czy tylko przeczytać artykuł? Określenie priorytetów ułatwi podjęcie dalszych działań.
  • Tworzenie szkieletów – tworzenie oddzielnych szkieletów dla witryny w wersji stacjonarnej, mobilnej i aplikacji może zając zbyt dużo czasu, którego możesz po prostu nie mieć. Najlepszym rozwiązaniem jest stworzenie jednego ogólnego szablonu i ewentualne dodanie elementów dla poszczególnych wersji. Taką koncepcję przekażesz następnie programistom, a oni nie powinni mieć problemu z opracowaniem dalszych szablonów.
  • Ekran dotykowy – należy uwzględnić inny sposób interakcji człowieka z urządzeniem. Na komputerze stacjonarnym człowiek posługuje się myszką, przez co łatwo jest mu wybrać konkretny element. Na laptopie też może użyć zwykłej myszy lub touchpada. Na tablecie ekran jest raczej duży i nie powinno być problemu z dotykową obsługą. Gorzej jest w przypadku smartfonów. Chociaż ich ekrany też są coraz większe, nadal na większości z nich jest problem z obsługą niektórych elementów witryny. Czasami są problemy z wybraniem konkretnego elementu, ponieważ znajdują się one zbyt blisko siebie albo przestrzeń jest zbyt mała, by posłużyć się gestami przesuwania czy zbliżania (oddalania) palców. Bezpośrednia interakcja za pomocą dotyku jest bardzo atrakcyjna, ale trzeba do tego odpowiedniego projektu witryny. Ekran jest o wiele mniejszy niż dużego monitora, a palce człowieka w tym przypadku są większe i mniej dokładne niż kursor myszy.
  • Prostota – im witryna prostsza, tym lepiej. Na urządzeniach mobilnych nie ma co szaleć. Zbyt dużo elementów, zdjęć, filmów i reklam tylko spowolni pracę witryny, a korzystanie z niej będzie bardzo męczące.
  • Wydajność – korzystając ze smarfonów użytkownicy mają rozproszoną uwagę. Dodatkowo transfer może być słaby, a wyświetlacz za mały. Dlatego liczy się zapewnienie jak największej wydajności i umożliwienie użytkownikom szybkiego działanie oraz wykonanie najważniejszych zadań. Wydajność można zwiększyć na wiele sposobów. Najlepiej jest usunąć wszystkie zbędne elementy na witrynie (głównie zdjęcia), a zostawić tylko to, co niezbędne. Dodatkowo warto jest wyróżnić pole wyszukiwania na witrynie. Jeśli użytkownik już wcześniej rejestrował się na witrynie na urządzeniu stacjonarnym, to należy wykorzystać jego dane na urządzeniu mobilnych. Użytkownik nie chce podawać jeszcze raz tych samych danych. Witryny mobilne powinny mieć również zaimplementowane metody płatności. Dokonanie transakcji za pomocą jednego kliknięcia na pewno bardziej zachęci użytkowników do zakupu.
  • Formularze – w wersji mobilnej należy dążyć do ich optymalizacji. Większość pól powinna być wypełniona wartościami domyślnymi – zaoszczędzi to sporo czasu użytkownikom. Ponadto, jeśli użytkownik logował się już w wersji stacjonarnej witryny, to większość jego danych powinna zostać ściągnięta. Wszystkie etykiety należy wyrównać w pionie, aby mieściły się na wąskich ekranach. Na małych wyświetlaczach nie sprawdzają się dobrze długie listy i rozwijane menu.
  • Testy użyteczności – jak wszystko w user experience, tak i w tym przypadku na końcu dobrze jest przetestować wersję mobilną strony z udziałem użytkowników. Zobaczysz w ten sposób, co działa poprawnie, co zdobyło przychylność użytkowników, a co według nich wymaga poprawy. Pozostaje kwestia wyboru urządzenia mobilnego. Czy dostarczysz użytkownikom smartfony czy mają skorzystać ze swoich urządzeń. A może odbiorcami danego produktu są w znacznej większości użytkownicy iPhone’ów? W takiej sytuacji to użytkowników iPhone’ów należy zwerbować do testów. Chyba, że firma chce zdobyć inne grupy użytkowników. Również należy się zastanowić nad wyborem miejsca do testów. Skoro użytkownicy korzystają z urządzeń mobilnych przeważnie „w biegu”, to czy testy w cichym laboratorium dadzą prawdziwe wyniki? Raczej nie. Dlatego testy użyteczności z wykorzystaniem urządzeń mobilnych zaleca się przeprowadzać w formie „partyzanckiej”.

Najczęściej popełniane błędy w trakcie projektowania witryn dla urządzeń mobilnych:

  • Ograniczenia na wersji mobilnej – niektórzy wychodzą z założenia, że skoro jest mniejszy ekran do wyświetlania zawartości strony, to użytkownik nie potrzebuje wszystkich informacji. W rezultacie wersja mobilna witryny jest uboga, nie ma na niej ważnych treści, co może powodować frustracje użytkownika.
  • Wymuszanie pobierania aplikacji – firmy błędnie zakładają, że jak ktoś korzysta z ich witryny na urządzeniu stacjonarnym, to także będzie chciał z niej korzystać w formie aplikacji. Nie wszyscy użytkownicy mają taką potrzebę. Owszem część z nich chętnie skorzysta z aplikacji, ale część woli pewne działania wykonywać tylko na komputerze stacjonarnym.
  • Nieprzystosowane elementy witryny na wersję mobilną – użytkownicy posługując się smarfonem oczekują, że będą mogli wykonać pewne działania za pomocą gestów – przesuwania i zbliżania czy oddalania palców. Niektóre działania się nie sprawdzają w wersji mobilnej – menu rozwijane po najechaniu na nie kursorem czy długie listy. Te różnice należy wziąć pod uwagę podczas projektowania witryny w wersji mobilnej.
  • Niezoptymalizowane formularze – formularze na urządzenia mobilne musza być jak najbardziej proste i szybkie w obsłudze. Niedostosowanie formularza może znacznie utrudniać wypełnianie go przez użytkownika, a w ostateczności użytkownik może opuścić stronę.