Jak zaprojektować interfejs użytkownika oparty na gestach
Pamiętacie dni, w których najeżdżanie i klikanie myszą były najczęściej używanymi wyzwalaczami interakcji z witryną lub aplikacją? Te dni minęły. Kiedy Apple wprowadził pierwszego iPhone'a, wielodotykowa technologia stała się głównym nurtem, a użytkownicy nauczyli się, że mogą nie tylko wskazywać i wybierać interfejs, ale także szczypać, rozszerzać i przesuwać. Gesty stały się nowymi kliknięciami.
Dziś sukces mobilnego interfejsu użytkownika można uzyskać dzięki temu, jak skutecznie korzysta z gestów.
Jak wybrać dobry gest
Jeśli chodzi o wprowadzanie gestów w interfejsie użytkownika, ważne jest, aby znać swój rynek i inne aplikacje, z których mogą korzystać docelowi odbiorcy. Spróbuj użyć tych samych gestów w swojej aplikacji. W ten sposób nie tylko optymalizujesz swój interfejs użytkownika w oparciu o zachowanie rynku docelowego, ale także od samego początku projektujesz bardziej komfortowe podejście dla użytkowników.
Nauczanie gestów
Gesty są koniecznością w każdej aplikacji mobilnej, ale zawsze wyzwaniem jest uczynienie ich oczywistymi dla użytkowników. Interfejsy dotykowe zapewniają wiele możliwości korzystania z naturalnych gestów, takich jak dotykanie, przesuwanie i szczypanie, aby wykonać pewne czynności, ale w przeciwieństwie do graficznych elementów interfejsu użytkownika, interakcje oparte na gestach są często ukrywane przed użytkownikami. Więc jeśli użytkownicy nie mają wcześniejszej wiedzy o tym, że dany gest istnieje, nie spróbują.
Dlatego projekt do odkrycia ma kluczowe znaczenie. Musisz mieć pewność, że zapewniasz odpowiednie znaczniki cue-wizualne, które pomagają użytkownikom w łatwym wykryciu interakcji z interfejsem.
Unikaj samouczków i poradników podczas wstawiania
Samouczki i instruktaże są popularną praktyką w aplikacjach opartych na gestach. Umieszczanie samouczków w Twojej aplikacji w wielu przypadkach oznacza pokazywanie użytkownikowi instrukcji wyjaśniających interfejs. Jednak samouczek dotyczący interfejsu użytkownika nie jest najbardziej eleganckim sposobem wyjaśnienia podstawowej funkcjonalności aplikacji. Główny problem z samouczkami z góry polega na tym, że użytkownicy muszą pamiętać wszystkie nowe sposoby korzystania z aplikacji, gdy już się do niej dostaną. Zbyt wiele informacji naraz może doprowadzić do większego zamieszania. Na przykład aplikacja Wyczyść rozpoczyna się obowiązkowym 7-stronicowym samouczkiem, a użytkownicy muszą cierpliwie czytać wszystkie informacje i próbować przekazać je do swojej pamięci. To kiepski projekt, ponieważ wymaga od użytkowników pracy z góry, zanim jeszcze wypróbują aplikację.
Kształcić w kontekście działania
Jeśli chodzi o uczenie użytkowników korzystania z interfejsu użytkownika, zalecałbym to głównie poprzez edukację w kontekście działania (kiedy użytkownik faktycznie tego potrzebuje). Aby nauczyć ludzi nowego gestu, musisz zacząć powoli. W związku z pewną iteracją instrukcje mogą zostać przekształcone w bardziej stopniowe odkrycie. Używaj wskazówek w czasie i skup się na wyjaśnieniu pojedynczej interakcji, zamiast próbować wyjaśnić każdą możliwą akcję w interfejsie użytkownika. Podpowiedź w gestach, dostarczając oczywistych, kontekstualnych wskazówek.
Poniżej możesz zobaczyć ekran edukacji gestów w aplikacji YouTube na Androida. Aplikacja działa w oparciu o gesty, ale nie używa samouczka do instruowania użytkowników. Zamiast tego używa wskazówek, które pojawiają się przy pierwszym uruchomieniu dla nowych użytkowników, po jednym na raz, gdy użytkownik dotrze do odpowiedniej sekcji aplikacji. Technika opiera się na komendach tekstowych, które zachęcają użytkowników do wykonania gestu i opisują wynik interakcji z krótkim i jasnym opisem.
Użyj animacji do komunikowania gestów
Gesty, nadające się do użytku tak jak są, byłyby niczym bez animacji. Jako projektant możesz skorzystać z animacji, aby przekazać informacje o dostępnych działaniach. Na przykład, aby uświadomić użytkownikom, że mogą wchodzić w interakcje z określonym elementem, można utworzyć polecenie tekstowe bezpośrednio na elemencie interaktywnym i ożywiać wyniki interakcji, jak pokazano w przykładzie poniżej.
Istnieją trzy popularne techniki, które pomagają kształcić użytkowników w oparciu o animację. Pierwszy to ruch podpowiedzi. Ruch wskazówka lub animowana podpowiedź wizualna pokazuje podgląd interakcji z elementem podczas wykonywania akcji. Ma on na celu tworzenie skojarzeń między gestem a działaniem, które on wywołuje. Na przykład mechanika gry Pudding Monsters opiera się wyłącznie na gestach, ale pozwala użytkownikom uzyskać podstawowe wyobrażenie o tym, co robić bez konieczności odgadywania. Animacja przekazuje informacje o funkcjonalności - scenariusz jest prezentowany z animacją i natychmiast staje się jasne dla użytkowników, co robić.
Druga technika to treść dokuczliwa. Treści treści są subtelnymi wizualnymi wskazówkami, które wskazują, co jest możliwe. Poniższy przykład demonstruje zawartość drażniącą karty - pokazuje po prostu, że inne karty istnieją za bieżącą kartą, a to wyjaśnia, że przesuwanie jest możliwe.
Trzecią i ostatnią techniką, o której chciałbym wspomnieć, jest afordancja. Możesz podać niektórym elementom swojego interfejsu wysoką indykcję, aby wskazywać użytkownikom funkcje w interfejsie i używać odskoków lub pulsów jako wskaźnika dostępnego gestu. Przykład tej techniki można znaleźć w Apple iOS. Gdy użytkownik kliknie ikonę kamery, ekran blokady podskakuje, ukazując pod nim aplikację aparatu.
Wniosek
Choć prawdą jest, że gesty dotykowe są dla nas niewidoczne, istnieje wiele technik projektowania, które pozwalają użytkownikom spojrzeć na to, co jest możliwe. Wskazówki na czas, animacje i treści to niektóre sposoby ujawniania ukrytych gestów.