Rant przeciwko ładnym projektom aplikacji

„Strzeż się tej próżności, która zabiega o komplement lub jest nią karmiona”. – Chalmers

Surfując po witrynach inspiracji designem z moimi odlotowymi, krytycznymi oczami UX-ray :) Często odchodzę z dymem unoszącym się z moich uszu. Jak mówi tytuł, jest to przekleństwo, ale nie bierz tego zbyt poważnie. Staram się pokazać.

Tak, wiem, że niektóre z tych witryn prezentujących projekty niekoniecznie są przeznaczone dla produktów z prawdziwego świata, ale nadal mówię, że muszą odzwierciedlać przemyślane podejście do projektowania, przede wszystkim poprzez zadanie głównego pytania „Dla kogo to jest? ”, „W jaki sposób ludzie będą korzystać z mojego produktu” i „Czy faktycznie można z niego korzystać?”.

Powierzchowne projekty aplikacji, które podążają za najnowszymi trendami i rażąco ignorują podstawowe konwencje użyteczności, najlepsze praktyki UX i podstawowe zasady projektowania interakcji, najprawdopodobniej zawiodą w prawdziwym świecie! Na szczęście zazwyczaj nie wychodzą poza ogólnie śmieszną, samopowtarzalną krainę fantazji na Dribbble i Behance.

Niestety, te „projekty koncepcyjne”, pojedynczy ekran w wyimaginowanej aplikacji, służą jedynie utrwalaniu etykietowania projektantów jako artystów – jako pretendentów, którym zależy tylko na okleinie, ładnych kolorach i krojach pisma. W dzisiejszych czasach każdy projekt aplikacji musi wykraczać poza to.

Mówię o UX.

Gdyby ludzie w prawdziwym świecie próbowali faktycznie korzystać z tych aplikacji, gwarantuję, że ponad 50% miałoby z tym trudności i poddałoby się zdezorientowany.

Projektanci produktów cyfrowych warci swojej soli i chcący ulepszyć swoją grę wiedzą, że konieczne jest pozostawienie swojego ego za drzwiami i unikanie niepotrzebnych ozdobników, samolubnych publicznych parad i bezsensownego uwodzenia publiczności. #UXFail!

Porzucanie użyteczności dla pochlebstwa

Doskonałe wrażenia użytkownika są niezbędne, jeśli projektowanie produktów cyfrowych ma odnieść sukces na rynku. Oczywiście, estetyka — wzornictwo, które świetnie wygląda i jest przyjemne w dotyku, jest ważne, ale jest to tylko ostateczny szlif, który uzupełnia produkt użytkowy, który jest również przyjemny w użyciu. Samo dążenie do estetycznej perfekcji przy jednoczesnym porzuceniu użyteczności jest ostatecznie grą dla przegranych.

Jak powiedział Don Norman – często nazywany „guru działającej technologii” – „Wielcy projektanci tworzą przyjemne doświadczenia”.

Przyjemne doświadczenia to takie, które powodują najmniejsze tarcie, zapewniając płynną, płynną interakcję i przewidywalne doświadczenia (tj. rzeczy wyglądające jak za dotknięciem czarodziejskiej różdżki. Właściwe rzeczy, we właściwym momencie, we właściwy sposób).

Droga do tego celu zdecydowanie nie polega na zignorowaniu ustalonych najlepszych praktyk i konwencji projektowych i po prostu skupieniu się na elewacji. Dribbble to oczywiste: 1) nie rozumiesz swojego użytkownika i 2) kopiujesz mody.

Ignoruj ​​konwencje na własne ryzyko

Konwencje projektowe, zarówno w projektowaniu produktów cyfrowych, jak i wzornictwie przemysłowym – na przykład samochodu lub roweru – są zakorzenione w ludzkim zachowaniu, mechanice, fizyce, nauce i szeroko zakrojonych badaniach. Postępują zgodnie z najlepszymi praktykami i ludzkimi oczekiwaniami, jak wszystko działa, ponieważ jesteśmy do nich przyzwyczajeni, przestrzegając tych konwencji przez eony. Są to konwencje wypracowane metodą prób i błędów, które z biegiem czasu okazały się bardzo skuteczne; trochę jak ewolucja.

Ignorowanie lub naruszanie konwencji projektowych jest lekkomyślne i nieco aroganckie. Są one fundamentalne i służą jako podstawa, na której możemy następnie wprowadzać innowacje. Chodzi o to, czego się oczekuje. Bez nich ryzykujesz irytację ludzi. Wyobraź sobie, że każdy rower, każda klamka – lub pedały i kierownica w każdym samochodzie – działały inaczej, wszystko w imię „innowacji”.

Dwa słowa: totalny chaos.

Interfejs użytkownika jest jak żart. Jeśli musisz to wyjaśnić, to nie działa.

Uważaj na heurystyki

Dobrze zaprojektowane aplikacje, które starają się być użytecznymi produktami, są zgodne z ugruntowanymi konwencjami projektowymi, podstawowymi wytycznymi dotyczącymi użyteczności i zasadami projektowania interakcji (między innymi) i przechodzą ocenę heurystyczną śpiewająco. („Heurystyki”, ponieważ są to ogólne zasady, a nie konkretne wytyczne dotyczące użyteczności).

Aby projekty aplikacji działały dobrze w rzeczywistym świecie, należy przestrzegać 10 heurystyk użyteczności dla projektowania interfejsu użytkownika, zdefiniowanych przez Nielsen Norman Group, wiodący głos w dziedzinie doświadczenia użytkownika od 20 lat. To są:

1. Widoczność stanu systemu
2. Dopasuj system do świata rzeczywistego
3. Kontrola użytkownika i wolność
4. Spójność i standardy
5. Zapobieganie błędom
6. Rozpoznawanie zamiast przypominania
7. Elastyczność i efektywność użytkowania
8. Estetyczny i minimalistyczny design
9. Pomóż użytkownikom rozpoznawać, diagnozować i usuwać błędy
10. Dostępność pomocy (mogą to być „szybkie wycieczki” lub przewodniki)

Przeczytaj więcej o tych 10 ogólnych zasadach projektowania interakcji tutaj.

Zauroczenie w imię innowacji

Często ekrany koncepcyjne aplikacji są projektowane przez projektantów, którzy szukają wielu polubień w witrynach prezentujących portfolio, aby przebić się do sekcji codziennych gorących ujęć w Dribbble. Kilka fantazyjnych, minimalistycznych projektów interfejsu użytkownika nie jest produktem. Przypomina to zaprojektowanie drzwi samochodu, nie dając żadnego pomysłu na to, jak wygląda reszta samochodu ani jak działa w rzeczywistym świecie.

Nie zrozum mnie źle! Konieczna jest innowacja projektowa. Rozkwit każdej dyscypliny lub dziedziny twórczej jest zdrowy i krytyczny. Ale nie powinno się to odbywać kosztem dobrego UX. Zróbmy tutaj rozróżnienie i nazwijmy to eksperymentowaniem projektowym. Pod pozorem czystego, minimalistycznego designu, chcąc być innym i fajnym, wiele tak zwanych innowacyjnych projektów prezentowanych w tych witrynach poświęca podstawową użyteczność.

Użyteczność 101

Użyteczność, podstawa doskonałych doświadczeń użytkowników, jest atrybutem jakości, który ocenia łatwość korzystania z interfejsów użytkownika. Słowo użyteczność odnosi się również do praktyk poprawiających łatwość użytkowania podczas procesu projektowania.

To, czy aplikacja jest użyteczna, jest definiowane zarówno w kategoriach użyteczności, jak i użyteczności. Narzędzie zapewnia użytkownikom funkcje, których potrzebują; użyteczność oznacza, jak łatwe i przyjemne jest korzystanie z tych funkcji. Dlatego fantazyjne projekty aplikacji, które ignorują te podstawowe zasady użyteczności, z definicji są bezużyteczne.

To zrozumiałe, że projektanci szukają innowacyjnych i interesujących sposobów na zaprojektowanie nawigacji w swojej aplikacji. Ale jest cienka granica między nieoczekiwanym a bezużytecznym. Trzy rzeczy, które należy wziąć pod uwagę przy projektowaniu nawigacji, to spójność, oczekiwania użytkownika i wskazówki kontekstowe. Nie ma znaczenia, jak wymyślny jest Twój eCommerce — na przykład — projekt koncepcji aplikacji. Jeśli użytkownicy nie mogą znaleźć produktu, nie mogą go kupić.

Przydatny projekt

Jak powiedział Steve Jobs: „Nie chodzi tylko o to, jak wygląda i jak się czuje. Design to sposób, w jaki to działa”.

Mówił o użytecznym designie .

Jeśli projektant za bardzo ingeruje w mentalny model danej osoby, jak wszystko powinno działać, aplikacja zawiedzie. Jeśli istnieje ogromna rozbieżność między modelem mentalnym użytkownika a modelem koncepcyjnym, aplikacja jest ugotowana. Modele mentalne, jak sama nazwa wskazuje, są modelami pojęciowymi w umysłach ludzi, które reprezentują ich rozumienie tego, jak rzeczy działają.

Jedną z najbardziej podstawowych zasad projektowania interakcji jest to, że interfejs użytkownika musi zawierać elementy znaczące, jeśli ma być użyteczny. Jeśli użytkownicy nie mają żadnych wizualnych wskazówek w interfejsie użytkownika, które sygnalizują dostępne dla nich działania lub interakcje gestów — zwanych elementami znaczącymi — Twój projekt produktu to DOA.

O ile Ty jako projektant możesz być zauroczony swoim produktem, o tyle użytkownikom bardziej zależy na użyteczności. Nie chcą uczyć się Twojej aplikacji i nie chcą wyruszać w podróż odkrywania lub eksperymentowania, aby zobaczyć, co działa, próbując przesuwać elementy w interfejsie użytkownika. Jak Steve Krug, od ponad 20 lat konsultant ds. użyteczności, powiedział w swojej książce Don't Make Me Think : „[Użyteczność] jest nadrzędną zasadą, ostatecznym rozstrzygnięciem przy podejmowaniu decyzji, czy projekt działa, czy nie”.

Oczywiście, jak powiedział Dieter Rams, legendarny niemiecki projektant w firmie Braun w latach 70. i inspiracja do wszystkiego, co Apple, powiedział:

Estetyka produktu jest integralną częścią jego użyteczności, ponieważ produkty, z których korzystamy na co dzień, wpływają na naszą osobę i nasze samopoczucie. Ale tylko dobrze wykonane przedmioty mogą być piękne.

Innymi słowy, projekt musi działać na wszystkich poziomach.

Oto 10 przykazań dobrego projektu według Dietera Ramsa:

Pamiętajmy, że projektowanie wizualne — estetyka — to tylko jeden aspekt projektowania UX. To ostatnia warstwa, która powinna ulepszyć wszystko, co miało miejsce przed nim w procesie projektowania UX, czyli definiowanie celów biznesowych, identyfikacja głównego użytkownika (persony), badania użytkowników, szkice, ideacja, wireframing, makiety, prototypy, testy użyteczności . To ostatnia okleina, która podnosi ogólne wrażenia użytkownika w zgodzie z projektowaniem pod kątem emocji.

Zmniejsz wysiłek umysłowy

Przy złym projekcie w działaniu, to, co robią Pan i Pani Projektant, to proszenie ludzi o rozszyfrowanie i zinterpretowanie niejasnych ikon i symboliki, zwiększając w ten sposób ich ładunek poznawczy (całkowitą ilość wysiłku umysłowego wykorzystywanego w pamięci roboczej). Z drugiej strony dobry projekt user experience zmniejszy obciążenie poznawcze. Ten rodzaj samolubnego projektu — tak, pojechałem tam — blokuje drogi ludziom, zwiększając tarcia i frustrację. Czy to naprawdę jest cel?

Projektanci muszą zapewnić jasne etykiety (linki i przyciski) oraz oczywiste drogowskazy (wyraźna nawigacja), aby pomóc użytkownikom w tworzeniu mentalnej mapy aplikacji i intuicji, gdzie są rzeczy i jak z nich korzystać. Nawigacja powinna być przejrzysta, zorientowana na zadania i logiczna (np. elementy sterujące na ekranie sugerują, jak z niej korzystać), a jej lokalizacja powinna być spójna (np. na pasku menu) w całym tekście.

Wyjaśnij, gdzie użytkownicy powinni stuknąć, jeśli mogą przesuwać palcem i ustawić cele wystarczająco duże, aby można je było łatwo dotknąć. Zapobiegaj błędom. Nie każ ludziom zgadywać, co coś znaczy. Nie bądź leniwy. Unikaj menu z hamburgerami i kebabem (trzy kropki), ponieważ ukrywają one nawigację i utrudniają znalezienie treści. W szczególności unikaj hamburgerów, które nawet nie wyglądają jak menu hamburgerów! Tak, przestrzeń jest ograniczona, ale udowodniono, że połączenie zakładek (góra-dół) i menu hamburgerowego sprawdza się znacznie lepiej niż pojedynczy hamburger.

To nie jest idealny świat

Gdyby Twój produkt trafił w ręce użytkowników, czy byliby w stanie znaleźć rzeczy i faktycznie z niego korzystać? Mogą nie mieć dostępu do super-duper konfiguracji, takiej jak ta, której użyłeś do zaprojektowania tych ekranów. Pomyśl jeszcze raz o użyteczności i dostępności (niepełnosprawność wzroku, niepełnosprawność fizyczna, niepełnosprawność poznawcza). Według danych ze spisu powszechnego w Stanach Zjednoczonych co najmniej 19% ludzi jest niepełnosprawnych, a odsetek ten jest prawdopodobnie wyższy w krajach mniej rozwiniętych. Gdyby ktoś z mniej niż idealną wizją podniósł Twoją aplikację, czy byłby w stanie jej użyć?

Czy Twój projekt jest „przyjazny dla palców”, czy jest to dosłownie trudny w użyciu? Jak bardzo ludzie muszą się wysilać, aby dotrzeć do różnych części ekranu aplikacji? Czy zastanawiasz się nad przepływem zadań użytkownika, umieszczając aktywne elementy pod palcami, zamiast zmuszać ich do skakania po czterech rogach ekranu? Czy projekt jest naprawdę zgodny z dotykiem? Czy uwzględniłeś zasłonięty obszar pod ręką trzymającą telefon?

Jak wskazuje Luke Wróblewski w „Projekcie dla smartfonów z dużym ekranem”, czy zastanawiałeś się, jak Twoje projekty będą zachowywać się na większych ekranach?

Czy Twój projekt naprawdę spełnia zalecenia Apple dotyczące interfejsu użytkownika iPhone'a dotyczące minimalnego rozmiaru docelowego 44 piksele szerokości 44 piksele wysokości? Przewodnik projektowania i interakcji z interfejsem użytkownika Windows Phone firmy Microsoft sugeruje, że docelowy rozmiar ekranu dotykowego wynosi 34 piks. przy minimalnym rozmiarze elementu dotykowego wynoszącym 26 pikseli.

Nie zakochuj się w superminimalnym kontraście między tekstem a tłem lub małym, nieczytelnym tekście, ponieważ dzięki temu Twoje projekty są „modne, czyste i minimalistyczne”.

Lepszy UX

Potrzebujemy lepszego projektu

Czym więc jest dobry projekt? Ta dyskusja mogłaby wypełnić książkę, ale ogólnie rzecz biorąc, „dobry projekt” jest wtedy, gdy wszystko składa się na użytkownika tego projektu.

Oznacza to, że aby projekt był „dobry” i użyteczny dla użytkowników, musi uwzględniać wiele poziomów i czynników, na których musi się znaleźć, aby odnieść sukces.

Trendy w projektowaniu przychodzą i odchodzą. Przeciętny trend w projektowaniu utrzymuje się tylko przez rok lub dwa; dobra użyteczność, podstawa projektowania UX, pozostanie.

Produkty zaprojektowane zgodnie z siedmioma czynnikami doskonałego UX przetrwają każdy trend projektowy, gwarantowane. Projektanci, którzy zwracają uwagę — na świetną użyteczność, najlepsze praktyki UX, konwencje projektowania interakcji i czynniki wpływające na wrażenia użytkownika — wywrą większy wpływ niż ci, którzy tego nie robią. Ostatecznie zostaną nagrodzeni, a ich produkty cyfrowe będą szerzej akceptowane i odnoszą sukcesy na rynku.

Jeśli jako projektant chcesz być lepszy w UX — tworzyć przydatne aplikacje mobilne i desktopowe, a nie tylko te ładne — zainwestuj trochę czasu w naukę przynajmniej podstaw UX. Zacznij od śledzenia blogów UX i subskrybuj biuletyny i publikacje online, takie jak Toptal Design Blog, UX Magazine, UX Matters, UserTesting, uxdesign.cc, UX Design Weekly lub Interaction Design Foundation.

Przeczytaj badania użytkowników przeprowadzone z żywymi, oddychającymi uczestnikami — prawdziwymi ludźmi. Jak mówią, liczby nie kłamią; wszystko inne to hipoteza i założenie.

Śledź liderów myśli UX na Twitterze. Przeczytaj artykuły UX i białe księgi, przy czym creme de la creme to The Nielsen Norman Group i Adaptive Path.

Medium to jedno z moich ulubionych miejsc do czytania artykułów o projektowaniu UX/UI online. Projektanci z całego świata używają go do czytania o projektowaniu, doświadczeniu użytkownika, użyteczności i innych tematach związanych z tworzeniem i budowaniem świetnych produktów cyfrowych. Oto projektanci do śledzenia na Medium.

Przeczytaj kilka podstawowych, klasycznych książek, które każdy UXer, którego znam, ma na swojej półce i traktuj je jak pisma święte.

1. Przełomowa książka Dona Normana o designie Projekt rzeczy codziennych
2. Emocjonalny projekt Dona Normana: dlaczego kochamy (lub nienawidzimy) codzienne rzeczy
3. Steve Krug's Don't Make Me Think
4. Lean UX Jeffa Gothelfa: stosowanie zasad Lean w celu poprawy doświadczenia użytkownika
5. Inżynieria użyteczności Jakoba Nielsena
6. Susan Weinschenk 100 rzeczy, które każdy projektant musi wiedzieć o ludziach

Przeczytaj pouczające zasoby online na temat wytycznych użyteczności, zasad projektowania interakcji i najlepszych praktyk UX: badania, dokumenty, artykuły itp.

1. Pierwsze zasady projektowania interakcji
2. Pełny zestaw 2397 wytycznych dotyczących użyteczności (w wielu raportach) od NNGroup
3. 10 heurystyk użyteczności dla projektowania interfejsu użytkownika od NNGroup
4. Artykuły Baymard Institute: Baymard bada zachowanie w witrynach eCommerce
5. Artykuły UX Mastery: Wszystkie rzeczy UX

I na koniec dodaj te pięć podcastów UX do swojej biblioteki iTunes:

1. UX Pod: dyskusje z projektantami UX i ogólnie o użyteczności
2. Inside Intercom: Wywiady z najlepszymi projektantami w wiodących firmach
3. Podcast UX dla pasjonatów równoważenia biznesu, technologii i użytkowników
4. Podcast UIE: spostrzeżenia inżynierów interfejsu użytkownika na temat świata projektowania
5. Prawdziwa północ: odkrywanie historii projektowych podkreślających testowanie i badania projektowe

• • •

Dalsza lektura na blogu Toptal Design:

• Najlepsze praktyki projektowania interfejsu użytkownika i typowe błędy
• Puste stany – najbardziej pomijany aspekt UX
• Prostota jest kluczem – odkrywanie minimalistycznego projektowania stron internetowych
• Zasady heurystyczne dla interfejsów mobilnych
• Projektowanie pod kątem czytelności — przewodnik po typografii internetowej