Zawartość
- 1. Nie zaznaczaj pól obowiązkowych
- 2. Nie używaj spinnerów
- 3. Miej tylko jeden typ przycisku lub jeszcze lepiej tylko jeden przycisk na formularz
- 4. Pola kawałków
- 5. Pomyśl, dlaczego o coś pytasz i jakie to uczucie dla użytkownika
- 6. Daktyle są skręcone, mali chłopcy
- 7. Formy jako rzemiosło deweloperskie
- 8. Nie używaj kolumn w formularzach
- 9. Nie używaj dwóch pól, gdy wystarczy jedno
- 10. Bądź miły
Forms, nie ma nic, czego wielu projektantów nienawidzi bardziej niż formy. Niekoniecznie pobudzają kreatywność, czy tak? Może nadszedł czas, abyśmy ponownie przyjrzeli się formularzom i zrozumieli, że najprostszy formularz to rozmowa między użytkownikiem a oprogramowaniem.
Zapomnij o wskazywaniu i klikaniu, formularze reprezentują najbogatszą interakcję, z którą jako projektanci cyfrowi będziemy musieli się zmierzyć. Następnym razem, gdy pojawi się formularz, nie myśl, że jest to tylko kwestia zastosowania fajnych efektów CSS lub dodania ładnego rozszerzenia jQuery. Projektowanie formularzy jest znacznie głębsze.
Przetestowałem setki formularzy i zaprojektowałem kilka złożonych formularzy dla firm ubezpieczeniowych, interakcji z rezerwacjami wakacyjnymi i wielu innych. Prawdopodobnie używałeś jednego z moich formularzy w ciągu ostatnich kilku miesięcy.
Oto lekcje, których chciałem się nauczyć, zanim zacząłem projektować formularze.
1. Nie zaznaczaj pól obowiązkowych
Znasz małą gwiazdkę oznaczającą pole obowiązkowe? Wiele razy widziałem, że nie udaje się to w testach użytkowników. Z założenia pola obowiązkowe nie mają większego sensu, nie mają odpowiednika w trybie offline. Są świetne dla programistów, ponieważ oferują ładne czarno-białe podejście do ukończenia. Gwiazdka i pole obowiązkowe zawodzą, ponieważ jest to zachowanie wyuczone. Typowe zachowanie, które widziałem podczas testowania użytkowników, to wypełnienie formularza u góry i zakończenie, gdy coś go powstrzymuje lub naciśnie przycisk.
Rozwiązanie jest proste, zaznacz pola opcjonalne, zaznacz miejsce, w którym nasz sympatyczny użytkownik ma się zatrzymać i zastanowić się, czy musi wypełnić to pole.
2. Nie używaj spinnerów
HTML5 jest genialny, prawda? Oferuje mnóstwo nowych, ekscytujących, błyszczących narzędzi do zabawy. Musimy pomyśleć o stosowności naszych nowych zabawek. Pole liczbowe zawiera teraz małe strzałki w górę iw dół, aby umożliwić użytkownikowi przełączanie się między liczbami.
Są tu dwa problemy. Po pierwsze, domyślne wyświetlanie strzałek w przeglądarce sprawia, że są one naprawdę małe. Bardzo kłopotliwe do kliknięcia, a gruby palcami między nami będą walczyć na iPhonie. Nazywa się to prawem Fitta, im coś jest mniejsze, tym trudniej jest to kliknąć.
Ale słyszę, jak krzyczysz, możesz po prostu wpisać numer bezpośrednio w polu liczbowym. Tak, możesz, ale spójrzmy na wyświetlacz przeglądarki, strzałki w górę / w dół przypominają pole wyboru naszego zaufanego przyjaciela. Użytkownik, który otrzyma pokrętło po raz pierwszy, założy, ponieważ przypomina to pole wyboru, że nie może w nim pisać.
Radzę trzymać się z daleka, dopóki nie staną się bardziej powszechne lub programiści przeglądarek nie uporządkują domyślnego projektu.
3. Miej tylko jeden typ przycisku lub jeszcze lepiej tylko jeden przycisk na formularz
Istnieje mało znana zasada psychologii zwana prawem Hicka. Prawo Hicka mówi, że im więcej mamy opcji, tym trudniej jest dokonać wyboru. Nie wiem o rakietach, ale o zasadzie, o której warto pamiętać.
Możesz pomóc miłemu użytkownikowi, pomagając mu dokonać wyboru. Dzięki temu, że wszystkie podstawowe przyciski są w jednym kolorze i tylko jeden z nich na stronie, wybór jest łatwiejszy. Który przycisk powinienem wcisnąć? Och, to łatwe, to ten duży kolorowy.
4. Pola kawałków
W poprzednim życiu studiowałem neurobiologię, więc studiowałem psychologię pamięci - szczególnie pamięć krótkotrwałą lub roboczą. Teraz, zanim to powiesz; nie, pojemność pamięci krótkotrwałej nie wynosi 7 +/- 2, 4 +/- 1 lub u ludzi mówi się od trzech do pięciu kawałków. My, ludzie, świetnie oceniamy bodźce wzrokowe, ograniczenie polega na tym, że jesteśmy lepsi, gdy ich liczba jest mniejsza. Dzielenie formularza na mniejsze grupy ułatwia ocenę, ponieważ często to, co użytkownik musi wprowadzić do formularza, pochodzi z jego pamięci.
Upewnij się, że Twoje grupy pól mają około czterech długości.
5. Pomyśl, dlaczego o coś pytasz i jakie to uczucie dla użytkownika
Jest to prawdopodobnie najprostsza rada, jaką daję, ale często jest najmniej wykorzystywana.
Weźmy następujące rzeczy:
Pytaj o każde zadane pytanie. Czy to konieczne? Jakie to uczucie, gdy ktoś o to pyta?
Najczęściej pojawia się potrzeba biznesowa, aby zadać pytanie, a my, projektanci, możemy dyskutować o konieczności, dopóki nie jesteśmy sine na twarzy. Należy zadać pytanie. Rozumiejąc potrzebę biznesową tych danych, często możemy narazić się na szwank.
Możemy pomóc, mówiąc naszemu miłemu użytkownikowi, dlaczego musimy zadać to pytanie. Upewnij się, że korzystasz z tych danych i udostępniasz je oraz ogólnie bądź miły.
Biorąc nasz przykład ponownie:
To wciąż trudne pytanie, ale mam nadzieję, że osłodziliśmy pigułkę.
6. Daktyle są skręcone, mali chłopcy
Wprowadzanie dat może być prawdziwym wyzwaniem i istnieje kilka pułapek, których możesz uniknąć. Największym problemem są błędy.
Najłatwiej jest uruchomić kalendarz. Warto zauważyć, że tygodnie rozpoczynają się w poniedziałek w Wielkiej Brytanii i w niedzielę w Stanach Zjednoczonych. Jeśli Twój użytkownik nie jest skoncentrowany, może wybrać niedzielę, kiedy ma na myśli poniedziałek.
Warto również wspomnieć o międzynarodowych formatach dat. Stany Zjednoczone zajmują pierwsze miejsce miesiąc, aw Japonii pierwszy rok. Tak więc datę taką jak 05.04.12 można interpretować na trzy sposoby.
Dlatego najlepiej jest używać pól wyboru.
7. Formy jako rzemiosło deweloperskie
Formularze są rzemiosłem zarówno dla programistów, jak i projektantów. Zrozumienie, jakie możliwe błędy można popełnić przy wprowadzaniu danych i zaprojektowaniu kodu zaplecza, aby sobie z tym poradzić, jest wyzwaniem.
Oto prosty. Wprowadzenie wartości waluty. Możliwe błędy, które użytkownik może popełnić, są ogromne. Wymuszanie formatów danych, z którymi muszą się spotykać użytkownicy, jest frustrujące dla użytkownika i, spójrzmy prawdzie w oczy, trochę leniwe ze strony programistów.
Czy jest lepsze wyzwanie dla dewelopera niż zbudowanie kuloodpornej formy.
8. Nie używaj kolumn w formularzach
Dużym problemem związanym z używaniem kolumn w formularzach jest przepływ. Zaczynamy formularz od góry i kończymy na dole. Wprowadzając kolumny, można przerwać przepływ formularza.
Nie zakładaj, że użytkownicy przechodzą karty przez formularze i dlatego fokus jest sposobem na nawigację po formularzach w kolumnach. Rzadko kiedy widziałem to podczas testów użytkowników. Przez większość czasu widzimy wprowadź szczegóły, kliknij, aby przejść do następnego pola za pomocą myszy / gładzika / palca, a następnie wprowadź szczegóły i tak dalej.
9. Nie używaj dwóch pól, gdy wystarczy jedno
Większość ludzi nie jest maszynistami dotykowymi. Podczas testów użytkowników widzimy, jak ludzie patrzą na klawiaturę podczas pisania.
Podczas wpisywania numeru telefonu dzielenie pola formularza, powiedzmy w celu dodania numeru kierunkowego i numeru, powoduje poważne problemy. Użytkownicy nie widzą lub faktycznie pamiętają, że istnieją dwa pola, więc wprowadź pełną liczbę w pierwszym polu, gorzej, jeśli pole jest ograniczone do określonej liczby znaków.
Użyj tylko jednego pola na numer telefonu, to samo dotyczy numeru domu / ulicy - użyj tylko jednego pola tekstowego.
10. Bądź miły
Zdziwiłbyś się, ile jest dość niegrzecznych komunikatów o błędach.
Oto przykład jednego, z którym ostatnio się spotkałem.
Sam fakt, że sugerują, że chętnie wprowadziłbyś datę w przyszłości, a następnie dość żartobliwa odpowiedź, cóż, nie jest zbyt przyjemny.
Ponownie postaw się w miejscu użytkownika, jak byś się czuł, widząc ten błąd? Zirytowany? Może nawet gorzej. Bycie miłym jest łatwe.
Stworzyłem szopkę / ściągawkę do pobrania, aby pomóc Ci zaprojektować lepsze formularze. Zawiera wiele innych sprawdzonych metod projektowania lepszych formularzy.
