Jak dostosować UX dla telefonów komórkowych
Więc co ma z tym wspólnego psychologia? Jeśli chodzi o wrażenia użytkownika, prawie wszystko.
Przy tak wielu rodzajach i rozmiarach urządzeń oraz na wielu różnych sposobach projektowania witryn internetowych dla tych urządzeń, doświadczenie użytkownika, które tworzy projekt, decyduje o ogólnym sukcesie witryny i o tym, czy użytkownik powróci.
Czym jest psychologia użytkownika?
Psychologia użytkowników to nauka stojąca za tym, czego ludzie chcą i potrzebują, gdy odwiedzają witrynę lub aplikację mobilną. Psychologia jest zakorzeniona we wszystkim, od tego, czy użytkownik ufa swojej marce, jak się czuje w związku z wiadomością, którą próbujesz przekazać.
A design jest dużą częścią tego. Wszystko, od koloru, poprzez obrazy, wzorce, po sposób działania witryny może wpłynąć te uczucia i związki emocjonalne.
Każdy z tych elementów powinien ostatecznie prowadzić do działania ze strony użytkownika. Większość podręczników do psychologii odwołuje się do wyzwalaczy, które powodują, że ludzie reagują. Te wyzwalacze mają również zastosowanie do projektowania stron internetowych, a jeszcze bardziej do projektowania mobilnego, gdzie użytkownik prawie zawsze musi fizycznie wchodzić w interakcję ze stroną internetową, aby coś się stało, np. Przeciągnięcie palcem po ekranie lub dotknięcie palcem.
- Wzajemność: jeśli zrobisz coś dla użytkowników, zrobią coś dla ciebie. (Zapisują się do newslettera, dajesz im freebie.)
- Framing: użytkownicy będą porównywać rzeczy. (Czy chcę tego lub tego? Większość użytkowników mieści się w środku wszystkich opcji.)
- Wytrwałość: użytkownicy chcą teraz, co jest ważne. (To dlatego witryny e-commerce dodają powiązane elementy na ekranie podczas zakupów).
- Dowód społeczny: użytkownicy patrzą na innych, aby zobaczyć, co robić. (Wpływ mediów społecznościowych.)
- Niedobór: użytkownicy chcą tego, czego nie mogą mieć. (Ograniczona liczba pozycji.)
- Kontrast: co wyróżnia się w umyśle użytkownika. (Teoria projektowania 101.)
Dwa różne doświadczenia użytkownika
Chociaż wyzwalacze są takie same, niezależnie od urządzenia, użytkownik nie ma takiej możliwości. Użytkownicy w zdecydowanej większości oczekują, że treść będzie taka sama niezależnie od urządzenia, ale mają różne pomysły na wykorzystanie i interakcję z tą treścią.
Strony internetowe na komputery stacjonarne są przeznaczone do czytania i przeglądania. Czytanie i gromadzenie informacji może skutkować podjęciem działania, ale użytkownicy często mają wyraźny powód, aby udać się na stronę internetową, na przykład do pracy. Nie wszystkie z tych doświadczeń są oparte na rozrywce lub przyjemności, a większość z nich może nie być.
Użytkownicy komputerów stacjonarnych nadal znajdują się w relacjach online. Każda czynność wykonywana jest za pomocą klawiatury lub myszy. Po prostu nie ma rzeczywistej fizycznej interakcji z urządzeniem. (Niewielu użytkowników kiedykolwiek dotknie ekranu.)
Doświadczenia użytkowników urządzeń mobilnych znacznie się różnią. Użytkownicy stale dotykają urządzenia - obudowy i ekranu. Więc rozmiar tych elementów i to, jak się czują, są dość ważne. Takie użycie fizycznego dotyku sprawia, że elementy projektu na ekranie są szczególnie ważne, ponieważ muszą być łatwe w użyciu, w przeciwieństwie do wersji komputerowych, w których kliknięcie myszy jest zawsze tego samego rozmiaru.
Użytkownicy urządzeń mobilnych często uzyskują dostęp do stron internetowych o różnych zamiarach. Rozrywka lub działania związane z realizacją zadań są częstsze niż czytanie i badania. (Wystarczy pomyśleć o tym, jak często wyciągasz telefon, aby grać w grę w sklepie spożywczym lub odpowiadać na wiadomość tekstową.)
Różnice fizyczne wpływają również na psychologię projektowania mobilnego. Musisz wziąć pod uwagę warunki oświetleniowe, rozmiar urządzenia i opcje dotykowe. W jaki sposób te elementy połączą się dla rzeczywistego użytkownika?
Oczekiwania użytkowników
Wszystko sprowadza się do centralnego pytania: czego użytkownik mobilny chce i czego oczekuje?
W przeciwieństwie do witryn internetowych na komputerach, gdzie użytkownicy oczekują wizualnie dynamicznego i wciągającego wrażenia, które jest względnie dwuwymiarowe, użytkownicy mobilni chcą, aby wszystko wyglądało realnie i żyło w trójwymiarowej przestrzeni.
Użytkownicy mobilni oczekiwali pewnych rzeczy z interfejsu:
- Każde działanie musi być możliwe do zastosowania. (I łatwo zobaczyć i dotknij.)
- Grafika i obrazy powinny ładować się szybko i mogą wcale nie wchodzić w skład aplikacji mobilnej.
- Opcje muszą być kontekstowe. Użytkownicy chcą wiedzieć, co dalej i gdzie mogą przejść; nie muszą znać każdej możliwej opcji.
- Witryny muszą integrować się ze wszystkimi funkcjami urządzeń mobilnych, takimi jak mapowanie, nawiązywanie połączeń i integracja z innymi aplikacjami.
- Interakcje muszą być łatwe i zgodne z ogólnie przyjętymi wzorcami. Użytkownicy mobilni mają prawie zerową koncentrację uwagi. Jeśli elementy nie działają po raz pierwszy - i bez wielu przemyśleń lub objaśnień - użytkownik jest tracony.
Jak to zaprojektować
Prawdziwym sekretem jest połączenie wyzwalaczy i oczekiwań użytkowników; następnie zaprojektuj dla nich. Przełóżmy kilka przykładów witryn, które to robią dobrze i jak łączą wyzwalacze i oczekiwania mobilne, by zapewnić im doskonałą obsługę.
Mennica
Mennica wykorzystuje interfejs w stylu karty, w którym każde pole jest klikalnym elementem w projekcie aplikacji mobilnej, podczas gdy wersja na komputery oferuje więcej kliknięć. Jasny kolor i dużo białej przestrzeni przyczyniają się również do usprawnienia wersji mobilnej.
Wyzwalacze: kluczowe są tutaj ramki i elementy wizualne, ponieważ w ramach bezpłatnej usługi mennica prosi o zarejestrowanie się w ograniczonej liczbie ofert na podstawie rzeczy, o których prawdopodobnie myślisz lub których potrzebujesz, od kart kredytowych po oferty ubezpieczeniowe.
Oczekiwania dotyczące urządzeń mobilnych: Mint ładuje się wyjątkowo szybko dzięki aktualnym danym użytkownika. Aplikacja mobilna upuszcza wiele cięższych obrazów wyświetlanych w witrynie na komputery i używa prostego pionowego wzoru do śledzenia informacji przez użytkownika. Zawiera również kilka ładnych narzędzi UX, takich jak dostęp do odcisku kciuka na iPhonie i intuicyjna kontrola gestów do poruszania się między elementami.
Destylator
Destylator korzysta z responsywnego frameworka, dzięki czemu treść wygląda i czuje się niemal identycznie zarówno w wersji na komputery stacjonarne, jak i mobilne. To, co robi witryna, to maksymalizacja potencjału formatu mobilnego dzięki unikalnym sposobom poruszania się po treści.
Wyzwalacze: Możesz łatwo zobaczyć, w jaki sposób ta witryna wykorzystuje kontrast, aby zwiększyć zaangażowanie użytkowników. Wykorzystanie koloru i białej przestrzeni w obu odmianach witryny ma na celu wywołanie emocji i zachęcanie do wezwań do działania. (Wystarczy spojrzeć na jaskrawo kolorowe przyciski i wyraźne miejsca docelowe.)
Oczekiwania dotyczące urządzeń mobilnych: Distiller używa wielu powszechnie akceptowanych wzorców, aby zachęcić użytkowników do angażowania się, z kilkoma subtelnymi wskazówkami na wypadek, gdyby użytkownik potrzebował pomocy. Spójrz na drugi ekran mobilny, na przykład: elementy w stylu karty (które są unikatowymi linkami) można przesuwać do przodu i do tyłu, aby zobaczyć więcej treści, a pasek typu "kropka" służy do pokazywania użytkownikom, ile elementów zostało. Nawigacja jest również znacznie uproszczona i ukryta w ikonie hamburgera, dzięki czemu użytkownicy nie są przytłoczeni opcjami i mogą swobodnie poruszać się po stronie mobilnej.
Kanał pogodowy
Kanał pogodowy dostarcza dokładnie tę samą treść na swojej stronie internetowej i aplikacji mobilnej, ale doświadczenia są drastycznie odmienne. Strona na komputery ma więcej informacji do przeczytania i obejrzenia, a aplikacja skupia się na tym, co użytkownik powinien teraz wiedzieć.
Wyzwalacze: Zasada (wspomniana powyżej) i dowód społeczny to duża część tego, co wyróżnia aplikację mobilną Weather Channel. Ekran początkowy to pogoda, w której użytkownik stoi w tym momencie. Jednym ruchem palca użytkownicy mogą zgłaszać warunki, dzielić się nimi w mediach społecznościowych i stać się częścią historii znanej marki.
Oczekiwania związane z urządzeniami mobilnymi: aplikacja wykorzystuje nowoczesny, płaski design w stylu kart, aby każdy element był łatwy w użyciu. Nie ma menu, o którym można by mówić, ponieważ cała przesłanka ma charakter kontekstualny, prowadząc użytkowników z jednego elementu do następnego w zależności od ich wyboru.
Pizza z Pizzeri Domino `s
Pizza z Pizzeri Domino `s złożył dużą, publiczną ofertę dotyczącą łatwości zamawiania. I mają rację. Podczas gdy strona na komputery stacjonarne ma bardzo tradycyjny charakter, aplikacja wykorzystuje wiele mobilnych narzędzi interfejsu użytkownika - takich jak zamawianie głosowe - aby ułatwić proces.
Wyzwalacze: Reciprocation i kadrowanie są kluczem do zakupów, z mnóstwem ofert i opcji do wyboru. Dodatkowo, wersja mobilna zapamiętuje preferencje użytkownika, aby proces był o wiele łatwiejszy.
Oczekiwania związane z urządzeniami mobilnymi: chociaż Domino używa niektórych funkcji, które nie są typowe dla tego typu aplikacji, jest dobrze objaśniony (na przykład ikona zamawiania głosowego). Nawigacja jest wbudowana kontekstowo, a aplikacja została zaprojektowana z dużą ilością kontrastu i małymi obrazami, które ładują się szybko.
The Tonight Show
The Tonight Show jest przeznaczony do rozrywki użytkowników na różnych urządzeniach. Pulpit i responsywna strona, a także aplikacja, podobnie wyglądają i działają. Opcje mobilne są usprawnione dzięki pionowej hierarchii, a elementy są łatwe do oglądania.
Wyzwalacze: podobnie jak w przypadku wielu innych witryn rozrywkowych, przekonanie i dowód społeczny sprawiają, że ludzie wracają. Chcesz wiedzieć, co jest gorące i modne, i to jest miejsce, w którym możesz go znaleźć.
Oczekiwania związane z urządzeniami mobilnymi: Jedną z wielkich sztuczek na stronie mobilnej jest to, że najpierw prosi użytkownika, czy chce aplikacji, jakby chciał powiedzieć "czy chcesz mieć najlepsze doświadczenie, jakie mamy do zaoferowania?" To wspaniałe narzędzie, które użytkownicy zaczęli się spodziewać. Aplikacja jest łatwa do odnalezienia, bo jest tylko o jeden kran, a użytkownicy nie muszą niczego szukać; wszystko jest tuż przed nimi.
Wniosek
Większość użytkowników chce i spodziewa się znaleźć tę samą zawartość witryny niezależnie od urządzenia, ale często chcą, aby interfejs użytkownika był dostosowany do urządzenia, z którego korzysta.
To doświadczenie dla konkretnego urządzenia pomoże zwiększyć lojalność użytkowników i te dobre uczucia, które większość właścicieli witryn ma nadzieję, że użytkownicy o nich myślą. Mówiąc prościej, posiadanie dobrego komputera stacjonarnego i doświadczenia oraz dobra mobilność użytkownika jest ważna; mogą nie być tym samym.
Zaprojektuj dla użytkowników, optymalizując sposób ich odczuwania, korzystania i interakcji ze swoimi urządzeniami.