Moses KimUX Writer/ResearcherShakuro
Trendy w UX/UI na 2020 rok
Poznaj kreatywne trendy w projektowaniu UX i UI na 2020 rok.
Opowiem dziś o 20 trendach dla projektantów UX/UI na rok 2020. Do dzieła!
Znacząca wartość
W miarę postępu technologii, która dostarcza projektantom i programistom niesamowicie potężnych narzędzi, kultura technologiczna kieruje dyskurs w stronę znaczenia i narracji zamiast emocji i wrażeń.
Psychologia postaci (Gestalt) sugeruje, że całość jest większa niż suma jej części. Kiedy rozwiązujemy designerski problem biznesowy, przyczyniamy się do czegoś większego niż tylko dobrobytu firmy.
Wpływanie na ludzi za pomocą produktów jest czymś, co wykracza poza prawną odpowiedzialność. Wpływ społeczny nabiera tempa, a to, co firma reprezentuje podczas wykonywania swojej pracy, jest równie ważne, jak jakość produktu lub usługi.
Dlaczego coś robisz będzie ważniejsze niż to, co robisz.
Animacje robiące wrażenie
Ruch opowiada historię lepiej niż słowa. Dzięki technologiom takim jak TweenMax i WebGL, wyciągamy istotę animacji. Dla wielu firm projektujących jest to niezbadany teren, więc fajnie jest wreszcie uzyskać wysokiej jakości animację dostępną dla ogółu. Czas na ruch. Dosłownie :)
Np. firma GreenSock robi świetne rzeczy. Tworzą wtyczki i narzędzia programistyczne do interaktywnych animacji. Optymalizują proces wdrażania interaktywnych projektów do pracy na prawie każdym urządzeniu wydajnie i płynnie.
Asymetria i podzielony ekran
Układ blokowy to klasyk. Dzięki określonym granicom pozwala łatwo przyswajać konkretne informacje. Daje poczucie kompletności treści i pozwala od razu wyczuć strukturę. Bloki to symetria. Istnieje jednak również asymetryczny trend, który gdzieś tam się przewija, ale nie trafia do mainstreamu. Zwłaszcza teraz, gdy używamy szerokich ekranów.
Rok 2020 może okazać się powrotem asymetrii. Po pierwsze, wszyscy są już przyzwyczajeni do dużej ilości narzędzi, które pozwalają zachować nieruchomy ekran. Czujemy się komfortowo z konfiguracjami podzielonego ekranu i ta zasada zaczyna mieć zastosowanie również w przypadku układów jednoplatformowych.
To, co początkowo było po prostu praktyczne i polegało na tworzeniu dwóch oddzielnych bloków informacyjnych na jednym ekranie, teraz staje się wizualnie atrakcyjnym sposobem prezentowania każdego rodzaju informacji. Królową asymetrii w 2019 roku była Zhenya Rynzhuk. Jestem pełen podziwu, widząc jej postępy i uważam, że warto ją obserwować.
Kontrastowość
Ogólnie, trendy designu zmierzają w kierunku automatyzacji, delegowania AI, minimalistycznego podejścia oraz innych tego typu rzeczy. Nie ma co się nad tym rozwodzić. Elementy wizualne przypisywane tego rodzaju projektom wciąż jednak mocno wymagają czynnika ludzkiego.
Takie elementy to dobór idealnych kolorów, a także upraszczanie i redukcja. Myślenie, że wszystko będzie inteligentne i zautomatyzowane i da idealny efekt, to utopia.
2018 był rokiem niebieskich i fioletowych gradientów. W 2019 powtórzyło się to samo, tylko w bardziej zmiękczonej wersji. Spodziewam się, że w tym roku poziom rozmycia będzie jeszcze większy.
Harmonijne kolory
Odcienie roku 2020 łączą “optymizm z niedopowiedzeniem jako ponadczasowym sposobem na rozjaśnienie”. Ogólnie rzecz biorąc, kolory, które będą modne we wszystkich branżach projektowych, są o wiele bardziej naturalne niż w poprzednich latach.
Nie oznacza to jednak, że wszystkie kolory muszą być z tej samej palety. Jasny, niepasujący odcień może być jeszcze bardziej efektowny.
Ludzkie pisanie
Postęp tworzenia UX w ciągu ostatnich dwóch lat wysoko podniósł poprzeczkę w dziedzinie projektowania. Samo określenie „pisanie UX” zniknie, ponieważ każde pisanie będzie UX.
Tekst nie towarzyszy projektowi, lecz jest jego nierozłączną częścią. Kontekst ma znaczenie, autor również. Tekst jest tak samo ważny, jak to, co dzieje się po nim - obraz jest umysłem czytelnika i jego działaniem. Tekst stworzony przez człowieka pozwala czytelnikowi oceniać, wybierać i odnosić się do produktu.
Mieszanie doświadczeń
Efekty wizualne oddziałowują silniej niż słowa. Łączenie szybko ładującego się wideo do layoutu to dobry sposób na ożywienie wrażeń. Treść jest najważniejsza, a sposób jej dostarczania odgrywa ogromną rolę w jej oddziaływaniu.
Mieszanie treści oznacza budowanie korzystnych wrażeń, dokładnie tak jak chcemy. Później porozmawiamy o dostosowaniu oddziaływania w oparciu o zachowanie użytkownika, ale ostatecznie trendem jest strona internetowa, która nie tylko składa się z ekranów, ilustracji i filmów, ale jest połączeniem wszystkich tych elementów.
Piękno powraca
Nie ma tutaj wiele do powiedzenia. Zrozum to.
Desveloper
Kryptonit projektanta to rozwój. Czasami projektujemy rzeczy, których nie da się wdrożyć w określonym czasie, budżecie lub zespole. Niektórzy projektanci uczą się kodować i stają się „groźni”, ponieważ wiedzą wystarczająco dużo, aby dyskutować, ale nie dość, aby coś zrobić.
Ta dychotomia musi się skończyć, a dzięki takim narzędziom jak Webflow, to może się stać już teraz. Zasadniczo Webflow to narzędzie wizualne, które pozwala projektować, co tylko chcesz, o ile jest to możliwe w HTML i CSS. Każdy ruch piksela to zmiana kodu, co sprawia, że takie podejście jest idealnym sposobem dla projektantów na rozpoczęcie kodowania.
Kiedy wszystko zmierza w kierunku projektowania opartego na interakcji, trudniej jest wyjaśnić, jak kolejna interakcja powinna wyglądać i działać. Potrzebę takiego narzędzia wizualnego trudno przecenić.
Pusta przestrzeń
Kiedy elementy walczą ze sobą o uwagę, żaden z nich nie ma jej dość. Gdy uwaga skupiona jest na jednym z nich, kradnie on całe show. W zależności od komunikatu dostarczanego przez UI, warto dać takiemu elementowi trochę miejsca, aby wiadomość się zakodowała.
Istnieją puste mikro i makro przestrzenie, miejsca na tekst i akapity. Mogą być aktywne, pasywne i skalujące się. Jest w tym aspekt pragmatyczny, ponieważ skondensowane informacje przetwarzamy dłużej, a rozumiemy mniej.
Otoczenie pomysłu pustą przestrzenią jest sposobem na jego wyróżnienie. Upewnijmy się, że to, co się wyróżnia, jest tego warte.
Nic jest w tym przypadku czymś.
Ciężkie renderowanie
Chociaż trudno jest wyobrazić sobie projektanta, którego domyślne zachowanie nie obejmuje wektorowego zestawu ikon i bloku „our advantages”, przodownicy branży wracają do prostych scenariuszy.
Przy prezentacji produktów w 2020, więcej firm będzie używać bardzo szczegółowych zdjęć swoich produktów i osób, które z nich korzystają.
Renderowanie w wysokiej rozdzielczości emuluje wrażenia dotykowe, które dzielą użytkownika o krok od zakupu. Możliwe są jednak problemy z czasem ładowania, a z odpowiednimi technologiami i zmiennym UX, mogą pojawić się problemy.
Zmienny UX
Podobnie jak istnieją różne temperamenty, istnieją też różne rodzaje zachowań online. Przez długi czas zajmowaliśmy się jedynie uśrednionym użytkownikiem, w uśrednionym kontekście i z uśrednionym poziomem zaangażowania.
Jesteśmy w stanie wpłynąć na doświadczenie nieskończonej liczby osób w oparciu o pierwsze wrażenie ich zachowania. Nowoczesna analityka pozwala nam określić, z kim mamy do czynienia: po prostu scrollującym klikaczem, niepewnym tropicielem, czy zdeterminowanym użytkownikiem. W zależności od ilości czasu spędzanego na ekranie lub prędkości przewijania, witryna zachowuje się inaczej.
Zmienny UX powoduje agresywne podejście do badań użytkowników i może nie mieć zastosowania w projektowaniu usług, ale projektanci marek będą mogli dostosowywać doświadczenia do odbiorców. Oznacza to zrozumienie tła, nastroju i konsekwencji działań podejmowanych przez użytkownika.
Mobilne przeglądanie
PWA wypełnia lukę między aplikacjami a siecią mobilną. Dostęp do tej samej funkcjonalności można uzyskać na dwa sposoby, co zobowiązuje projektantów do budowania spójnych wzorców UX.
Jednym z czynników odróżniających aplikacje od stron mobilnych, jest potrzeba pośrednika, którym jest przeglądarka. 2019 to rok, w którym pierwsza prawdziwa przeglądarka mobilna, Cake, stała się popularna.
Technicznie rzecz biorąc, jest to apka z AppStore, która ma uwolnić użytkowników od aplikacji. W istocie jednak zapewnia aplikacjo-podobne doświadczenie przy korzystaniu z wyszukiwarek i stron internetowych. PWA już raczej z nami pozostanie, a dzięki obsłudze przeglądarek dostosowanych do urządzeń mobilnych możemy spodziewać się, że więcej takich aplikacji trafi na rynek.
Nachodzenie na siebie typografii
To przedłużenie śmiałego trendu typograficznego. Nakładające się na siebie nagłówki plakatów są alternatywą dla dźwięku, a za pomocą tejże techniki można w specyficzny i ciekawy sposób coś wyrazić.
Ze względu na ilość informacji tekstowych, które pochłaniamy każdego dnia, mamy tendencję do werbalizowania linii, które się wyróżniają. Wyróżnienie ich jest zatem prawdziwym wyzwaniem.
Largo Studio wykorzystuje nakładający się tekst, aby zilustrować swoją pracę nad projektem.
Inne ilustracje
Do 2020 roku wszystko zilustrujemy do tego stopnia, że zredefiniujemy na nowo style ilustracji, które są niczym innym, jak zredukowanymi obiektami sztuk pięknych, utworzonymi w mediach cyfrowych. Otwiera to możliwości dla artystów, którzy nie cierpią zdjęć ze stocków.
Dzięki temu trendowi wszystko sprowadza się do sposobu, w jaki sprzedajesz produkty lub usługi. Absurdalny design jest dobrym przykładem czysto artystycznego podejścia do tworzenia treści i umieszczania ich w biznesie.
Niestandardowa nawigacja
Produkty zapewniające niestandardowe doświadczenia to najważniejszy trend w nadchodzącym roku. Istnieją sprawdzone metody konwersji i wymogi do osiągnięcia konkretnych celów, ale jeśli myślimy o wspieraniu marki za pomocą zaawansowanych efektów wizualnych, możemy wykorzystać wszystkie zasoby witryny, a jednym z nich jest nawigacja.
Nawigacja może przyczynić się do porządanego efektu, jeśli zostanie mądrze wpleciona. Istnieją dwa rodzaje elementów nawigacyjnych: widoczne i ukryte. Ważne jest również zaprojektowanie nawigacji w oparciu o przepływ informacji.
Wizualizacje na pełnym ekranie
Odejście od przyjętego głównie przez social media centralnego umieszczenia treści stanowi wyzwanie na wielu poziomach. Po pierwsze, środek ekranu jest miejscem, do którego nasze oczy naturalnie wędrują, po drugie, gramy bezpieczniej, umieszczając znaczną treść na środku strony. Jednak używanie wszystkiego, co jest również wokół na stronie, przynosi korzyści.
Aby stworzyć wciągający layout i zapewnić przyjemne wrażenia, warto pokazać, że centralny ekran jest tylko częścią widocznej zawartości. To zachęca użytkowników do dalszej eksploracji i potencjalnie zmniejsza współczynnik odrzuceń.
Głębię wrażeń pełnoekranowych ogranicza jedynie to, co produkujesz. Ma to sens w przypadku skomplikowanych zagadnień i problemów istotnych społecznie, gdy ważne jest, aby umieścić daną osobę we właściwym kontekście.
Wizualizacja danych
Ponieważ technologie umożliwiające tworzenie robiących wrażenie interaktywnych doświadczeń stają się coraz bardziej dostępne, marketerzy mogą budować swoje strategie wokół danych wizualnych. Pokazanie jest lepsze niż opowiadanie, ale jeśli potrafisz powiedzieć i pokazać, to Twoja narracja jest kompletna.
WebGL i 3D to potężne połączenie, jeśli posiada się znaczące dane do wyświetlenia. Wszystko, co zbiera dane, jest źródłem. Wszystko, co musimy zrobić, to je przefiltrować, znaleźć najbardziej istotne i odpowiednio je obrobić.
Wizualizacja danych to nie tylko łatwo przyswajalne wykresy. W zależności od tego, co użytkownik docelowy jest w stanie docenić, możemy swobodnie wybierać źródła danych i przedstawiać je za pomocą grafiki. Wizualizuj to, co ważne, a nie to, co dostępne.
Nieprzerwany UX
Potrzebujesz produktu? Kliknij i odwiedź tę stronę. Chcesz zobaczyć więcej zdjęć? Kliknij tutaj i przewiń. Chcesz przeczytać jakieś recenzje? Kliknij tutaj i sprawdź dolną sekcję. Chcesz coś kupić? Kliknij ikonę koszyka, a następnie przejdź do checkoutu. Wpisz dane karty, no i oczywiście zarejestruj się wcześniej. Wypełnij 27 pól tekstowych, zaakceptuj Regulamin, uzyskaj elektroniczną fakturę, śledź swoje zamówienie, i bęc, Twoje zamówienie już tu jest.
Każdy etap przedstawionego powyżej procesu skłania Cię do rezygnacji. Czas, który musisz przeznaczyć na wypełnienie każdego pola, możesz poświęcić na coś innego. Aby przejść przez procedurę zakupów online, motywacja musi być silna niczym espresso. I może tak być, ponieważ ludzie wiedzą, jak coś sprzedać w dzisiejszych czasach.
A co, jeśli jedyne, czego strona internetowa potrzebuje od Ciebie, to Twoja chęć zakupu? Jeden przycisk do kontrolowania wszystkiego. Urządzenia mobilne już z tego korzystają, wykonując płatności za pomocą prostych gestów i identyfikacji twarzy. Sieć jeszcze musi na to poczekać.
Technologia ma dług wobec ludzkości za zaniedbanie prywatności. Jednak sposobem, aby to naprawić nie jest unikanie danych osobowych, ale faktyczne wykorzystywanie ich w lepszym celu. Użytkownik nie musi spekulować, czy może powierzyć Ci swoje dane osobowe. Jeśli prosisz o dane, musisz o nie dbać. Jest to nasz obowiązek. Naszym zadaniem jest uczynienie tego procesu przyjemnym. Wszystko, czego używamy, jest w porządku, jeśli jest etyczne i zgodne z aktualnymi wymogami bezpieczeństwa.
Internet używa plików cookie. Bez nich wszystko by upadło. Geolokalizacja będzie następna. Nieprzerwany UX zaczyna się tam, gdzie wrażliwe informacje są reklamowane jako sakrament handlu, a nie towar.
Nie chodzi tylko o kupowanie. Każda intencja użytkownika musi być traktowana poważnie. Jeśli wygrałeś bitwę o uwagę, nie możesz przegrać bitwy o satysfakcję.
Nie przeszkadzaj osobie, która chce Ci dać swoje pieniądze.
Miej trochę godności
Hype technologiczny utrzymuje wszystkich w napięciu. Gdy dążymy do natychmiastowego uwielbienia, zapominamy o tym, co tak naprawdę przywiodło nas do branży oraz o latach nauki, guzach, siniakach i zdobytej wiedzy specjalistycznej.
Ślepo wskakując do tego pociągu, zaniedbujemy nasze doświadczenia dla garstki polubień i repostów. Trendy w projektowaniu są fajne, ale własny styl jest lepszy.
Szybki test. Przewiń swoje portfolio kreatywne o rok w dół. Ile dziwnych kwiatków znalazłeś? Gwarantuję Ci, że za rok będzie tak samo. Jeśli coś Cię teraz zawstydza, najprawdopodobniej zrobiłeś to dla hype'u. Zarabianie pieniędzy jest okej, ale projektanci są zapamiętywani za to, że są inni. Nie ma przepisu na sukces, ale jego poszukiwanie przynosi korzyści.
Zakończę cytatem Marty'ego Neumeiera z The 46 Rules of Genius: The Innovator's Guide to Creativity:
Kreatywność to dyscyplina, z której korzystasz, gdy nie znasz odpowiedzi w podróży w nieznane. Niewłaściwe kroki są w rzeczywistości krokami. Każdy błąd przybliża Cię do rozwiązania.
To oficjalne tłumaczenie z języka angielskiego, a oryginał tekstu przeczytasz tutaj.
