Jak zepsucie końca poprawia UX
Opowiadanie historii polega na tym, że nieznane staje się znane. Ale projektanci nie są gawędziarzami, a miejsca docelowe, które projektują, powinny zawsze być jasne dla użytkownika. Wstawiając małe spoilery do naszych projektów UI i psując zaskoczenie, projektujemy znacznie ulepszone wrażenia użytkownika.
Często twierdzili, że są fani pop-mądrości tylko dwie odrębne działki w całej zachodniej kulturze: człowiek wyrusza w podróż, a nieznajomy przybywa do miasta.
Krótki rzut oka na twój regał będzie obalał regułę - chyba że zezwalasz na metaforyczne podróże, w których wszystko pasuje - ale częstotliwość, z jaką pomysł się powtarza, i sens, jaki wydaje się robić, mówi wiele o centralności nieznanego w zachodniej pomysły narracji.
Na obu działkach człowiek zostaje wprowadzony w coś nowego i nieoczekiwanego, jedyną wariacją jest punkt widzenia, z którego mówi narracja; w obu przypadkach fabuła jest nieznana i staje się znana . Kiedy Clint Eastwood jedzie do rozbitego miasta w 1800 roku Idaho, nasza ciekawość co do jego tożsamości napędza nasze zaangażowanie. Kiedy czytamy trylogię " Władca Pierścieni " Tolkiena , nigdy nie mamy wątpliwości, że Frodo w końcu dotrze do Góry Doom, interesuje nas to, co dzieje się po drodze.
Kluczem do opowiadania historii jest to, że istnieje nieznany i nieznany stanie się znany.
Projektanci nie są opowiadaczami
Wielu projektantów nazywało siebie opowiadaczami, ale jest to po prostu kiczowaty sposób odwoływania się do komunikacji. Aby opowiedzieć jakąś historię, musimy przygotować nieznane w ramach przygotowań do wielkiego odkrycia, a główną przeszkodą w tym podejściu jest to, że doświadczenia internetowe - i twierdzę, że większość spotkań z projektowaniem - są nieliniowe i otwarte.
Design jest bowiem znacznie bliższy poezji. Poezja zazwyczaj istnieje w niewielkich fragmentach, w których badane są tematy, które są otwarte na interpretację.
Dalekie od skonstruowania opowieści, zadaniem projektanta jest doprecyzowanie jak najbardziej nieinwazyjnie.
Używanie spoilerów w mikronakcjach
Jaki jest najbardziej wciągający element w Szczękach ? Czy Brody kłóci się z burmistrzem? Czy Quint opowiada historię Indianapolis? Czy to romans Hoopera z Ellen Brody (tak, naprawdę, przeczytaj książkę!)? Nie. To jest muzyka. Gdy tylko ten rekin zacznie grać na wiolonczeli, wiemy, że nadchodzi, jego przybycie jest dosłownie zwiastowane. [Nawiasem mówiąc, Szczęki są ciekawym przykładem filmu, w którym zarówno przybysz (rekin) przybywa do miasta, jak i człowiek udaje się w podróż (do morza).]
Możemy tworzyć zaangażowanie w projekt poprzez ciągłe upuszczanie spoilerów, wskazując na to, co nadchodzi, z własną muzyką wiolonczelową. Aby to zrobić, używamy mikrointerakcji - prostych składników interfejsu użytkownika, zawierających wyzwalacz i informację zwrotną. Część sprzężenia zwrotnego z mikrointerakcji to miejsce do wstawienia spoilera.
Działa poprzez podgląd danych, które w linearnym doświadczeniu zostaną wprowadzone na późniejszym etapie. Kluczem jest doprowadzenie danych do przodu.
Miniatury
Zacznijmy od czegoś znajomego: klasycznym przykładem przekazania informacji do przodu jest miniatura. Miniatura to podgląd większego elementu, wizualny przewodnik po tym, czego można się spodziewać po drugim końcu łącza.
Jacky Winter jest agencją talentów dla artystów, ilustratorów i animatorów. Dzięki różnorodnym talentom, najlepszym sposobem przeglądania pracy jest korzystanie z tradycyjnych miniatur.
Miniatury nie muszą być tradycyjne. Alexandre Nacache jest dyrektorem artystycznym i interaktywnym projektantem, którego witryna wykorzystuje podglądy elementów projektu, a nie reprodukcje projektu w miniaturze.
Bao to tajwańska restauracja z trzema lokalizacjami w Londynie. Ich ilustracje lokalizacyjne zachowują się jak miniatury, sugerując nie tylko wygląd restauracji, ale także możliwe doznanie.
Dzień wolny to studio projektowe z Glasgow. Miniatury na ich stronach stanowią główny element kierunku artystycznego i ustanawiają własną estetykę marki.
5 minut czytania
Wracając do tego dnia, jedynym sposobem sprawdzenia, ile czasu zajmuje czytanie tego artykułu, było sprawdzenie czasu, przeczytanie artykułu i sprawdzenie czasu.
W oparciu o jego zastosowanie, jednym z najbardziej udanych elementów UI z ostatnich lat jest pomocny mały wskaźnik, który mówi nam, ile czasu zajmie przeczytanie artykułu. Spopularyzowane przez takie strony jak Medium, nie ma śledzenia wzroku lub oblicza się szybkość czytania, oszacowanie "czytania 5-minutowego" opiera się na liczbie słów-125 słów oczekuje się, że zostanie odczytany za 30 sekund lub w tym miejscu. Ale nawet te rażąco uogólnione dane są wystarczające, aby umożliwić użytkownikom podejmowanie świadomych decyzji dotyczących ich zaangażowania w witrynę, artykuł lub produkt.
Monotonia Australian Design Radio jest zepsuty tylko przez kontrastującą czerwoną, używaną dla stanów najechania. Jedyny element, który wykorzystuje czerwień bez interakcji? Głowica odtwarzania z pozycją i całkowitą długością.
Sekwoja jest spółką typu venture capital z siedzibą w Kalifornii. Profile firm technologicznych zajmują ich stronę docelową. Każdy profil ma numerowaną pozycję, a animowany timer suwaka zwraca uwagę na to, gdzie dokładnie się znajdujesz.
Vimeo zawiera jedne z najlepszych filmów w internecie. Mogli wyświetlić dowolne informacje, które chcieli - producent, temat, tytuł - po najechaniu kursorem na ich miniaturki. Wybrali czas trwania.
Cinelli to najfajniejsza włoska marka rowerowa. Ich suwak produktów ma ponumerowane przyciski "następny" i "poprzedni". Samo strzały wystarczą, by przekazać znaczenie, ale projektanci wprowadzili dane do przodu za pomocą prostego dodatku do przycisków.
Kwalifikujące się dane
Jednym z najprostszych sposobów ulepszania interfejsu jest kwalifikowanie danych w znaczącym kontekście. Kluczem do tego nie jest dostarczanie zbyt wielu informacji, tylko proste streszczenie, które można przeczytać na pierwszy rzut oka.
Pomóż Skautowi to usługa SaaS dla klienta. Na ich desce rozdzielczej wyświetlane są kluczowe dane, takie jak całkowita liczba rozmów, które nie mają znaczenia bez dodania strzałki i procentu wskazującego, czy jest to poprawa, czy porażka.
Rezerwacja biletu z Lyon do Bordeaux jest prostsze, gdy Linia kolejowa wyświetla pasek pod czasem podróży, aby dać wizualną informację o czasie trwania i liczbie zmian.
Mapy i reasekuracja
Kiedy przewidujemy podróże, zwłaszcza podróż w nieznane, często demistyfikujemy doświadczenie z mapą. W świecie rzeczywistym mapa jest bardzo podobna do miniatury miejsca docelowego. W projektowaniu interfejsu użytkownika wykorzystywane mapy wyjaśniają architekturę informacji.
Etykiety są jednym z najbardziej złożonych obszarów architektury informacji, ponieważ mają tendencję do żargonu, często żargonu wyłącznego firmy. Dodanie mikroskopu bez żargonu wyświetla podgląd miejsca docelowego dla użytkowników i pomaga im znaleźć właściwe informacje.
Krata to SaaS do zarządzania wydajnością, ale ich produkty są bardzo skoncentrowane na firmie. Rozwiązują ten problem, sygnalizując kluczową cechę każdego produktu w menu.
Thriva pomaga śledzić twoje zdrowie dzięki badaniom krwi, które możesz wykonać w domu. Mają trzy poziomy produktu, które są wyraźnie wyjaśnione w ich menu.
Transakcje finansowe są technicznie skomplikowane. Pled oferuje różne produkty API dla programistów. Ich menu wyjaśnia nie tylko kluczową cechę każdego produktu, ale także wyświetla podgląd dwóch potencjalnych rozwiązań opartych na kombinacjach produktów.
Kluczem do skutecznego projektowania interfejsu użytkownika są spoilery
Opowiadanie historii jest antytezą efektywnego projektowania, ponieważ historie z ich natury, podążają za nieznanymi elementami w doświadczeniu. Design przeciwnie, stara się wyeliminować nieznane przez wyjaśnienie.
Kiedy wprowadzamy dane do projektu, zwykle robimy to w prosty sposób. Pojedynczy fragment dobrze dobranych danych może wyjaśnić cały proces. Mikrointerakcje są idealnym sposobem na wstawienie tych "spoilerów", które umożliwiają użytkownikom tworzenie własnych doświadczeń, a jednocześnie zawsze dokładnie wiedzą, gdzie znajdują się w szerszym kontekście.
Ujawniając więcej niż linearną historię, angażujemy użytkowników znacznie efektywniej i projektujemy doświadczenia, które są solidne i przyjemne w użyciu.