Ograniczenia projektowania mobilnego UX, najlepsze praktyki i współpraca z programistami

Możemy osiągnąć lepsze doświadczenia użytkowników, przestrzegając najlepszych praktyk projektowania mobilnego UX, rozumiejąc ograniczenia i ułatwiając solidną współpracę z programistami.

Co to jest projektowanie mobilnego UX?

Niedawny artykuł na TechCrunch wskazał, że mobilny handel elektroniczny odpowiadał za prawie jedną trzecią całej sprzedaży online w okresie świątecznym w Święto Dziękczynienia 2018, a Digital Trends poinformował w 2017 r., że 5 miliardów ludzi na całym świecie ma teraz urządzenie mobilne. Google ogłosił również, że indeksowanie zoptymalizowane pod kątem urządzeń mobilnych jest obecnie używane w ponad połowie stron internetowych w wynikach wyszukiwania.

Ludzie codziennie polegają na urządzeniach mobilnych w zakresie komunikacji, handlu elektronicznym, konsumpcji treści, pracy, bankowości, kierunkach, a coraz częściej jako jedynego urządzenia komputerowego. Co więcej, korzystają z różnych urządzeń, takich jak telefony komórkowe, inteligentne zegarki, tablety, phablety, urządzenia do noszenia i laptopy hybrydowe.

Projektowanie doświadczeń użytkownika mobilnego (UX) odnosi się do projektowania pozytywnych doświadczeń podczas korzystania z urządzeń mobilnych i urządzeń do noszenia oraz aplikacji lub usług działających na takich urządzeniach… Projektowanie mobilnego UX koncentruje się mocno na wydajności i wykrywalności. - Fundacja projektowania interakcji

Dla projektantów UX te trendy dotyczące urządzeń mobilnych stanowią zarówno wyzwania, jak i możliwości. Z jednej strony musimy wziąć pod uwagę różnorodność urządzeń i sposobów ich wykorzystania. Z drugiej strony otwiera to zupełnie nowy zestaw obszarów zainteresowania w projektowaniu UX, a to oznacza tworzenie pozytywnych doświadczeń dla zupełnie nowej generacji użytkowników.

Najlepsze praktyki projektowania mobilnego UX

Projektowanie mobilnego UX jest trudne. Jak wspomniano wcześniej, musimy wziąć pod uwagę wiele rzeczy, w tym rosnącą listę urządzeń mobilnych, sposoby interakcji z nimi oraz fakt, że ludzie chcą spójnych i przyjemnych doświadczeń na wszystkich typach urządzeń.

25 porad Google dotyczących projektowania UX na urządzeniach mobilnych

W 2015 roku Google opublikował 25 najlepszych praktyk projektowania UX na urządzeniach mobilnych, opartych na wewnętrznych badaniach. Te wskazówki zostały niedawno zaktualizowane, aby były bardziej aktualne. Autor zawiera również plik PDF do pobrania zawierający wszystkie 25 wskazówek, które warto mieć pod ręką w przypadku każdego mobilnego projektu UX.

Wytyczne Apple dotyczące interfejsu użytkownika

Innym świetnym źródłem, które warto mieć pod ręką, są wytyczne Apple dotyczące interfejsu użytkownika dotyczące projektowania urządzeń mobilnych. Są łatwe do odczytania, mają piękny układ i są wypełnione najlepszymi praktykami, wskazówkami i własnym podejściem Apple do zasad projektowania. Dla mobilnych projektantów UX te wytyczne są świetnym źródłem dostarczania wysokiej jakości doświadczeń użytkowników.

Dodatkowe najlepsze praktyki dotyczące mobilnego UX

Oto kilka innych sprawdzonych metod projektowania mobilnego UX, które mogą nie być tak dobrze znane jak Google, ale są równie ważne, aby projektanci urządzeń mobilnych wzięli pod uwagę.

• Badania UX . W pewnym momencie możemy czuć się skłonni od razu przejść do makiet lub prototypów, jednak wykonanie najpierw odpowiednich badań UX jest czymś, czego nie można lekceważyć. Zawsze pamiętaj, że „nie jesteś swoim użytkownikiem”, a pozytywne wrażenia użytkownika w każdym przypadku zależą od dokładnych badań UX. Poniżej znajduje się obszerny przewodnik firmy Adobe po metodach badania UX, który można znaleźć w dalszych celach.
• Bałagan . Wszyscy doświadczyliśmy niepokoju związanego z zagraconym pulpitem — wyobraź sobie to na urządzeniu mobilnym! Każdy dodany przycisk, obraz, fragment treści itp. znacznie komplikuje sprawę. Dobrym pomysłem jest pozbycie się z mobilnego interfejsu użytkownika wszystkiego, co nie jest absolutnie konieczne. Świetną wskazówką jest dążenie do minimalizmu, ale nie narażając się na dobrą użyteczność. Często można to osiągnąć poprzez nadanie priorytetu jednej akcji głównej na każdym ekranie.
• Priorytet . Istnieje tendencja do dodawania jak największej liczby funkcji. Uważamy, że pominięcie czegoś w jakiś sposób zmniejszy wrażenia użytkowników. Wręcz przeciwnie, utrzymuj funkcje wysoce skoncentrowane w oparciu o podstawowe cele i udoskonalaj projekt, analizując, które funkcje są najczęściej używane, a następnie włóż wysiłek, aby te funkcje były zarówno intuicyjne, jak i przyjemne.
• Kliknij Cele . Użytkownicy mogą się zdenerwować fizycznie i zacząć uderzać w swoje urządzenia mobilne, gdy dotkną czegoś, a urządzenie nie reaguje. Badanie przeprowadzone w MIT wykazało, że dotykali czegoś, co miało zbyt mały cel dotykowy. Najlepszą praktyką jest tworzenie kontrolek, przycisków, linków itp. (wszystko, co jest celem dotykowym) o co najmniej 7-10 mm, co stanowi średnią szerokość opuszki palca. Dobrym pomysłem jest również zapewnienie wystarczających odstępów między tymi elementami interfejsu użytkownika.
• Czytelny tekst . Ponieważ wiele działań użytkowników opiera się na zużyciu treści, aby zapewnić spójne wrażenia na wszystkich typach urządzeń mobilnych, wybierz kroje pisma, które działają dobrze w wielu rozmiarach i gramaturach. Zalecane są czcionki o wielkości co najmniej 11 punktów, aby zmniejszyć zmęczenie oczu. Czyste i łatwe do odczytania kroje pisma, takie jak Roboto i Noto firmy Google lub nowa czcionka Apple San Francisco, to świetny wybór do zbadania.
• Opinia o interfejsie użytkownika . Dobrze zaprojektowane aplikacje informują nas o interakcji z nimi. Brak dobrych opinii może zdezorientować użytkowników i spowodować, że będą kwestionować, czy coś się wydarzyło, dzieje się lub dlaczego to się stało/nie wydarzyło się. Najlepszą praktyką jest użycie różnych form informacji zwrotnej (dźwięk, haptyka, wizualizacje) na podstawie elementu interfejsu użytkownika lub aktualnego stanu aplikacji.
• Dostępność . Jest to prawdopodobnie jeden z najbardziej pomijanych aspektów projektowania doświadczeń użytkownika, a zwłaszcza projektowania UX na urządzeniach mobilnych. 15% światowej populacji doświadcza jakiejś formy niepełnosprawności. Wytyczne dotyczące dostępności treści internetowych są ogólnodostępnym zasobem, a dla projektantów cyfrowych to element „obowiązkowy” jako część ich zestawu narzędzi.

Ograniczenia projektowania mobilnego UX

Celem większości projektantów UX jest dostarczanie przyjemnych doświadczeń i wymyślanie świetnych projektów, które zapewniają zarówno wykrywalność (jakie działania są możliwe), jak i zrozumienie (jak produkt ma być używany). W przypadku urządzeń mobilnych pojawiają się jednak pewne ograniczenia ze względu na rozmiar, przenośność i środowiska, w których te urządzenia są używane.

Ograniczenia przechowywania

Kiedy mają do czynienia z natywnymi aplikacjami mobilnymi, projektanci muszą wziąć pod uwagę, że niektórzy użytkownicy mogą mieć ograniczenia pamięci.

Aplikacja mobilna, w przeciwieństwie do aplikacji internetowej, wykorzystuje pamięć masową bezpośrednio na urządzeniu mobilnym. Ma to wpływ na projektowanie mobilnego UX, ponieważ wprowadza potencjalne ograniczenia jakości wideo, audio i obrazów, które można wykorzystać.

W przypadku aplikacji natywnych chcemy, aby projekty mobilnego UX uwzględniały ograniczenia pamięci. Gdy użytkownik napotka ograniczenie pamięci, musi podjąć trudne decyzje, co zachować, a co usunąć. Powoduje to złe wrażenia użytkownika, gdy zmuszamy go do dokonywania takich wyborów.

Ekrany i elementy sterujące

Kolejnym ograniczeniem, z jakim mamy do czynienia w projektowaniu mobilnego UX, jest rozmiar ekranu i sterowanie na naszych urządzeniach mobilnych.

Ekrany mobilne są mniejsze: czytanie przez wizjer zwiększa obciążenie poznawcze i sprawia, że ​​zrozumienie tego jest około dwa razy trudniejsze. — Jakob Nielsen, Konsultant ds. Użyteczności Sieci.

Najlepszym sposobem radzenia sobie z ekranami i elementami sterującymi jest wyeliminowanie jak największego tarcia. Zrestrukturyzuj informacje, zwróć uwagę na strefy kciuka, zmniejsz liczbę kliknięć (szczególnie w przypadku eCommerce) i zwróć uwagę na proces logowania, który często może być frustrujący.

Środowisko

W przypadku urządzeń mobilnych przy projektowaniu UX należy wziąć pod uwagę czynniki środowiskowe. Użytkownicy są znacznie częściej opuszczani w trybie offline, a takie sytuacje należy wziąć pod uwagę w ogólnym doświadczeniu użytkownika. Jak sprowadzić ich z powrotem tam, gdzie byli? Jak możemy upewnić się, że nie muszą zaczynać od początku tego, co robili?

Innym czynnikiem środowiskowym są rozpraszacze. Kiedy korzystamy z naszych telefonów komórkowych lub tabletów, często znajdujemy się w hałaśliwym lub zatłoczonym otoczeniu, które utrudnia koncentrację. Jak możemy zapewnić dobre wrażenia użytkownika, gdy elementy rozpraszające konkurują o uwagę użytkownika? Czy istnieją sposoby na zapisywanie stanów i pozwalanie naszym użytkownikom na ich zapisywanie?

Mały rozmiar ekranu, pojedyncze okno

Innym ograniczeniem, z którym zmagają się projektanci mobilnego UX, jest ograniczony rozmiar ekranu. Z tego powodu ludzie widzą tylko jedno okno na raz, co znacznie ogranicza wrażenia użytkownika.

Podejmowane są próby dostosowania „wielu ekranów” i „wielozadaniowości”, ale nie są to jeszcze normą i mają własne zestawy ograniczeń.

Kluczem do lepszego mobilnego UX z tym ograniczeniem pojedynczego okna jest to, że projekt powinien być samowystarczalny. Wszystko, co musi zrobić użytkownik, powinno być możliwe do wykonania w ramach jednego ekranu lub okna, tj. nie powinien on opuszczać aplikacji, aby znaleźć informacje itp.

Kiedy użytkownicy muszą opuścić aplikacje lub otworzyć nowe ekrany, zwiększa to ogólne obciążenie poznawcze, a to oznacza, że ​​sprawy stają się zbyt złożone i frustrujące.

Jak ludzie trzymają urządzenia mobilne

Jest jeszcze jedno ograniczenie, o którym należy pamiętać: Trzymanie naszych gadżetów. Jak ludzie je trzymają i co to oznacza dla mobilnego projektowania UX?

Według badań przeprowadzonych przez Stevena Hoobera i opisanych w części 2 Design for Fingers, Touch and People, odkryto, że ludzie wchodzą w interakcję ze swoimi urządzeniami w różny sposób w zależności od tego, jak je trzymają, co następnie ma wpływ na projektowanie mobilnego UX.

Ludzie trzymają swoje urządzenia mobilne na wiele sposobów i cały czas zmieniają swoją pozycję. Ma to wpływ na to, jakich palców używają i jak wchodzą w interakcję z mobilnym interfejsem użytkownika (patrz poniżej). Jak się okazuje, użytkownicy wolą środek ekranu i nie lubią klikać przedmiotów, które znajdują się zbyt blisko krawędzi.

Oto kilka dodatkowych wskazówek dotyczących UX na urządzeniach mobilnych z badań Stevena:

• Projekt dla każdego użytkownika i każdego typu i rozmiaru urządzenia mobilnego
• Projektuj na różne sposoby, w jakie ludzie pracują ze swoimi urządzeniami
• Weź pod uwagę, że w większości przypadków użytkownicy wolą dotykać środka ekranu
• Umieść kluczowe czynności w środkowej połowie do dwóch trzecich ekranu
• Upewnij się, że palce i kciuki nie zasłaniają treści
• Elementy do wyboru powinny być wystarczająco duże, aby można je było wygodnie stukać

Współpraca z programistami

Niezależnie od tego, czy pracujesz w zwinnym/szczupłym środowisku UX, czy nie, to programiści muszą interpretować i wdrażać projekty, które zostały tak starannie przygotowane. Dobrym pomysłem jest wcześniejsze ustalenie z programistami kilku sprawdzonych i prawdziwych najlepszych praktyk, aby upewnić się, że projekty są implementowane zgodnie z przeznaczeniem. Oto kilka sugestii i wskazówek.

Makiety

Przygotowując i przekazując makiety, staraj się, aby nazwy plików były proste, spójne i opisowe. Zaoszczędzi to dużo czasu na przemieszczanie się tam iz powrotem. Dobrym pomysłem jest również sfinalizowanie wszystkich makiet przed udostępnieniem ich twórcom, aby otrzymali tylko jedną wersję każdego ekranu. Kolejną wskazówką, która pozwala zaoszczędzić czas, jest przetestowanie wszystkich interakcji z prototypami, aby działały i działały. Dobre narzędzia do udostępniania makiet: InVision i Marvel .

Specyfikacje funkcjonalne

Większość pracy wykonywanej jako projektanci UX angażuje programistów na wczesnym etapie projektu, a świetnym sposobem na ułatwienie ciągłego zrozumienia procesu projektowania i stworzenie lepszej linii komunikacji jest utworzenie i wykorzystanie dokumentu specyfikacji funkcjonalnej lub „Func -Spec.”

Dokument Func-Spec jest podobny do planu tworzonego przez architektów, z wyjątkiem tego, że jest udostępniany programistom podczas całego projektu projektowego i pozwala im zrozumieć, jak będzie działać aplikacja lub witryna internetowa (w przeciwieństwie do wyglądu interfejsu użytkownika).

Dobry przykład działającej funkcji Func-Spec pokazano poniżej:

Kopiuj

Zwykle istnieje wiele kopii, które znajdują się poza makietą, które należy przekazać programistom. Oto pomysł, który na pewno docenią:

Jak widać powyżej, kontekst pomaga programiście zrozumieć, kiedy wiadomość powinna się pojawić lub zniknąć. Powinno to informować programistę, co się dzieje, aby nie musiał zgadywać. Wiadomość jest faktyczną kopią, która się pojawi. Użyj prawdziwej kopii, a nie bełkotu (np. lorem ipsum). Deweloperzy nie chcą być copywriterami i chcemy, aby wszystko było dla nich tak płynne, jak to tylko możliwe.

Specyfikacje

To jeden z najważniejszych elementów komunikacji projektów z deweloperami. Oto, gdzie narzędzia takie jak Zeplin i InVision Inspect naprawdę błyszczą, ponieważ dbają o przekazywanie specyfikacji, takich jak pomiary, przewodniki stylów, czcionki, przepływ doświadczeń użytkownika i sposób działania każdego elementu projektu.

Komunikacja IRL (w prawdziwym życiu)

Projektanci kochają swoje narzędzia. Tak bardzo, że naprawdę łatwo można zapomnieć o podniesieniu telefonu, rozpoczęciu rozmowy wideo lub podejściu do programistów i porozmawianiu. Dużo czasu zaoszczędziliśmy po prostu spotykając się z programistami po przekazaniu części projektu, ponieważ wszelkie pytania lub niuanse można omówić na miejscu. Często się o tym zapomina, ale jeśli stanie się to częścią normalnego procesu przekazywania, wszyscy docenią oszczędność czasu.

Łącząc to wszystko razem

Mobilność nie znika. W 2016 r. liczba użytkowników uzyskujących dostęp do sieci na urządzeniu mobilnym po raz pierwszy przekroczyła liczbę użytkowników komputerów stacjonarnych. Dla projektantów UX coraz większe zastosowanie urządzeń mobilnych i rozpowszechnienie różnych typów urządzeń sprawi, że projektowanie doświadczeń użytkownika będzie znacznie trudniejsze.

Z tych powodów przestrzeganie zestawu najlepszych praktyk, zrozumienie ograniczeń wprowadzanych przez urządzenia mobilne oraz zapewnienie płynnej współpracy z programistami będą kluczowymi czynnikami w tworzeniu projektów, które tworzą pozytywne ludzkie doświadczenia.

• • •

Dalsza lektura na blogu Toptal Design:

• Zasady projektowania i ich znaczenie
• Najlepsze portfolio projektantów UX – inspirujące studia przypadków i przykłady
• Odkrywanie zasad projektowania Gestalt
• Adobe XD kontra Sketch – które narzędzie UX jest dla Ciebie odpowiednie?
• 10 elementów UX, z których korzystają najlepsi projektanci