Podpowiedź to jeszcze nie wybór: pole, które ma wskazać konkretną pozycję

W polu „Oddział” widać napis „Pracownia Rzeka”. Formularz wygląda na wypełniony, więc użytkownik przechodzi dalej. Dopiero podsumowanie pokazuje magazyn na obrzeżach miasta zamiast punktu obsługi w centrum. Podpowiedź miała oszczędzić pisania. Przy okazji samodzielnie wybrała miejsce, do którego pojedzie człowiek z tubą rysunków.

W tym hipotetycznym formularzu podobne nazwy kryją różne pozycje w danych. Wpisane słowa, pozycja podświetlona na liście i ostatecznie zatwierdzony oddział nie muszą być tym samym. Projekt powinien pokazać te różnice, zamiast pozostawiać je jako niewidoczne ustawienie komponentu.

Pole z podpowiedziami pomaga wybrać jeden rekord, czyli konkretną pozycję z ustalonej listy danych. Może dotyczyć lokalizacji, produktu, organizacji albo osoby kontaktowej. Jego wynik ma wskazywać konkretny obiekt. Ładnie uzupełniony napis jest dopiero częścią tego zadania.

Najpierw zdecyduj, czy użytkownik wyszukuje, czy wybiera

Zwykłe pole wyszukiwania przyjmuje pytanie. Wpis „Rzeka” może prowadzić do wyników zawierających to słowo. Pole wyboru oddziału ma zakończyć się wskazaniem jednej pozycji, z której później skorzysta formularz. Jeżeli lista pełni tę drugą funkcję, nazwij ją w instrukcji: „Wpisz nazwę i wybierz oddział z listy”.

Ustal, czy wolno podać wartość spoza słownika. To decyzja o procesie, nie detal wyglądu. Jeśli zlecenie musi trafić do istniejącego oddziału, swobodnie wpisana nowa nazwa nie wystarczy. Jeśli klient może zgłosić inną organizację, potrzebna jest jawna droga „Nie ma jej na liście”, z osobnym rozpoznaniem takiego wyniku.

Nie mieszaj obu reguł w zależności od tego, czy narzędzie akurat znalazło dopasowanie. W przeciwnym razie literówka może zamienić wybór istniejącej firmy w utworzenie nowej. Użytkownik powinien świadomie rozpoznać, czy wskazał pozycję katalogu, czy przekazuje własny tekst do dalszego sprawdzenia.

Przy braku pasującej pozycji daj następny krok odpowiadający procesowi. Może to być wyszukiwanie po miejscowości albo kontakt z osobą, która ustali właściwy punkt. Nie oferuj dodania nowego oddziału, jeśli klient nie ma takiego uprawnienia. Własna wartość powinna mieć odrębny opis i stan; nie może wyglądać jak zatwierdzony element słownika tylko dlatego, że oba wyniki mieszczą się w jednym polu.

Poradnik W3C APG opisuje combobox, czyli pole połączone z rozwijaną listą, i rozróżnia podpowiedzi z ręcznym wyborem oraz automatyczne wskazanie sugestii. To różne sposoby akceptacji opisane w przewodniku tego pola. Sama obecność rozwijanej listy nie określa jeszcze, co stanie się po opuszczeniu pola.

Dla naszej pracowni przygotuj trzy stany do pokazania na prototypie:

• Wpisano „Rzeka”, ale nie wskazano oddziału. To zapytanie, z którego dopiero powstaną sugestie.
• Na liście podświetlono „Pracownia Rzeka — magazyn”. Użytkownik przegląda możliwość, lecz reguła projektu musi rozstrzygać, czy to już wybór.
• Zatwierdzono „Pracownia Rzeka — centrum, ul. Lipowa”. Formularz ma rozpoznawalny wynik z konkretną lokalizacją.

Wygląd stanów powinien odpowiadać ich znaczeniu. Nie pokazuj zielonego potwierdzenia tylko dlatego, że w polu są jakieś litery. Jeśli trzeba wybrać rekord, komunikat o błędzie powinien to wyjaśnić i zachować wpisane zapytanie, aby klient nie zaczynał od pustego pola.

Zakres wyszukiwania uzgodnij z właścicielem słownika. Czy można szukać po pełnej nazwie, miejscowości, kodzie lub dawnej nazwie? Nie trzeba wykładać tych reguł użytkownikowi w dokumentacji technicznej. Krótka podpowiedź „Nazwa lub miejscowość” ma natomiast wynikać z tego, co lista faktycznie obsługuje.

Jeżeli zadaniem jest znalezienie treści, a nie wskazanie rekordu, lepsze rozwiązanie może wynikać z projektu wyszukiwarki wewnętrznej strony B2B. Wyniki wyszukiwania mają prowadzić do materiałów. Tutaj wybór musi jeszcze stać się jednoznaczną wartością w formularzu.

Sugestia ma pozwolić rozpoznać różnicę

Dwie pozycje o tej samej widocznej nazwie wymagają dodatkowego kontekstu. Przy oddziale może to być miejscowość, adres i funkcja punktu. Przy modelu produktu — kod i cecha wariantu. Nie pokazuj całego rekordu tylko dlatego, że jest dostępny. Wybierz dane, które pozwalają odróżnić możliwości w tym zadaniu.

W naszej liście magazyn i punkt obsługi powinny różnić się już przed kliknięciem. Skrócenie obu do „Pracownia Rzeka…” usuwa właśnie informację potrzebną do wyboru. W projekcie długich nazw i tekstów w interfejsie trzeba zachować sens wyróżniającej końcówki, nawet jeśli nazwa zajmie dwa wiersze.

Kolejność informacji sprawdź na rzeczywistym materiale. Jeśli wszystkie oddziały zaczynają się nazwą firmy, pierwsze znaki mogą być mało użyteczne. Miejscowość albo rodzaj punktu mogą lepiej prowadzić wzrok. Pełna tożsamość nadal powinna być dostępna przed zatwierdzeniem, a nie dopiero na kolejnym ekranie.

W formularzu dla partnerów zagranicznych lista może mieszać różne kierunki pisma, nazwy oraz kody zapisane cyframi. Nie zakładaj, że wystarczy wyrównać wszystko do jednej strony. Dwa kierunki tekstu przy nazwach, kodach i adresach wymagają zachowania czytelnej relacji między fragmentami. Przy odbiorze odwzoruj w kontrolowanej próbce długość nazw i rodzaj zapisu występujący w słowniku. Sama polska nazwa demonstracyjna nie sprawdzi mieszanego tekstu.

Wpisz także nazwę z popularnym skrótem lub znakiem diakrytycznym. Jeżeli wyszukiwanie nie rozpoznaje takiego zapisu, interfejs może podpowiedzieć inną drogę, na przykład miejscowość. Komunikat „Spróbuj wpisać miejscowość” podaje wtedy konkretny sposób dalszego szukania. Brak wyniku może ujawniać ograniczenie sposobu dopasowania.

Nie stosuj rozróżnienia wyłącznie kolorem. Osoba przeglądająca listę powinna dostać nazwę i kontekst także przy obsłudze klawiaturą lub czytnikiem ekranu. Odbierz pełny komunikat sugestii, nie tylko to, jak ładnie wygląda wyróżniony fragment słowa.

Na telefonie sprawdź widok z otwartą klawiaturą. Użytkownik powinien móc zobaczyć różnicę między sugestiami i wskazać dalszą pozycję, jeśli lista przewija się we własnym obszarze. Gdy nazwa ma dwa wiersze, wysokość elementu nie może ucinać adresu. W próbie przewiń również do końca dostępnego zestawu, a potem wróć do pola. Ustal, czy zamknięcie klawiatury zamyka listę i co dzieje się z rozpoczętym wyborem.

Przy bardzo podobnych rekordach unikaj automatycznego łączenia pozycji na potrzeby „porządniejszej” listy. To odrębna decyzja o danych. Kontrola fałszywych dopasowań przy łączeniu rekordów przez AI pokazuje, dlaczego podobieństwo nazwy nie ustala tożsamości. W interfejsie można uprościć prezentację, lecz nie wolno zgubić różnicy między magazynem a punktem obsługi.

Co zatwierdzasz, gdy opuszczasz pole

Użytkownik może wpisać fragment, przejść strzałkami po liście i kliknąć kolejne pole. Co zostaje wybrane? W komponencie accessible-autocomplete zespołu GOV.UK ustawienie confirmOnBlur może zatwierdzać wskazaną opcję po kliknięciu poza kontrolką. Taką możliwość opisuje dokumentacja komponentu. Domyślne ustawienie biblioteki nie zastępuje decyzji o zachowaniu Twojego formularza.

Dla oddziałów o podobnych nazwach sprawdź wariant, w którym wybór wymaga jawnego potwierdzenia. Przejście wzrokiem lub klawiaturą po kilku sugestiach służy wtedy ich obejrzeniu. Dopiero kliknięcie pozycji lub ustalona akcja klawiatury przypisuje oddział. Osoba wypełniająca powinna rozpoznawać, co się wydarzyło, bez odczytywania nazwy technicznego ustawienia.

Sprawdź Enter, Tab i Escape w całym formularzu. Jeśli Enter zatwierdza sugestię, nie powinien w tym samym ruchu niespodziewanie wysyłać całego zgłoszenia. Jeśli Escape zamyka listę, ustal, czy zachowuje wcześniejszy wybór. Zachowanie powinno odpowiadać przyjętemu wzorcowi, a nie zależeć od przypadkowego połączenia dwóch obsług zdarzenia.

Po zatwierdzeniu pokaż informację wystarczającą do rozpoznania wyboru. Sam skrót „Rzeka” nie daje pewności, czy formularz przechowuje centrum, czy magazyn. Można zachować nazwę z adresem w polu albo obok niego. Nie trzeba pokazywać technicznego identyfikatora klientowi, jeśli nie pomaga mu w rozpoznaniu miejsca.

Zapis powinien jednak zachować związek z konkretnym rekordem. Nazwa może się później zmienić. Przechowywanie wyłącznie tekstu nie wystarczy do ustalenia, który oddział wybrano, gdy dwa mają podobne nazwy. Szczegóły rozwiązania uzgodnij z właścicielem danych i osobą wdrażającą; odbiór ma potwierdzić właściwy obiekt oraz jego czytelne przedstawienie.

Następnie dopisz znak w zatwierdzonej nazwie. To kluczowa próba: czy zmiana tekstu unieważnia wybór, czy formularz nadal wysyła identyfikator dawnego oddziału? Widoczny tekst i ukryty wynik nie powinny opowiadać dwóch różnych historii. Pokaż konieczność ponownego wskazania pozycji albo udostępnij wyraźną czynność zmiany.

Oddział może zależeć od wcześniej wybranego rodzaju usługi. Po zmianie z konsultacji na odbiór materiałów sprawdź, czy wskazany punkt nadal pasuje. Jeżeli nie, nazwij przyczynę i poproś o nowy wybór, zachowując pozostałe dane. Nie pozostawiaj starego identyfikatora przy nowej usłudze wyłącznie dlatego, że nazwa oddziału nadal poprawnie wygląda w polu. Właściciel słownika potwierdza regułę, projekt pokazuje jej skutek.

Podobne rozdzielenie dotyczy wyboru daty na stronie. Wpisanie rozpoznawalnego zapisu nie zawsze oznacza potwierdzony dostępny termin. Przy oddziale też trzeba oddzielić wpisany tekst od wartości zaakceptowanej według reguł zadania.

Lista może spóźnić się albo nie przyjść

Zaprojektuj ładowanie wyników. Jeżeli po wpisaniu kilku liter lista pobiera dane, odróżnij ten stan od braku dopasowań. Komunikat „Nie znaleziono” pokazany przed zakończeniem odpowiedzi skłania do zmiany poprawnego zapytania. Przy błędzie pobrania wskaż problem i możliwość ponowienia, zachowując wpisane słowa.

W próbie wpisz szybko dwa różne zapytania i przygotuj odpowiedzi w odwrotnej kolejności. Później dostarczona lista do wcześniejszego tekstu nie powinna zastępować wyników aktualnego pytania. Użytkownik może nie zauważyć, że sugestie przestały odpowiadać temu, co widzi w polu. Wybranie z takiej listy daje technicznie poprawny rekord dla błędnego kontekstu.

Osobno sprawdź dopływ dodatkowych wyników podczas przeglądania listy. Jeśli użytkownik podświetlił trzeci oddział, nowe pozycje nie powinny bez wyjaśnienia przesunąć wskazania na inny obiekt. Zachowanie aktywnej sugestii musi odnosić się do rekordu, nie wyłącznie numeru wiersza. W przeciwnym razie Enter może zatwierdzić sąsiada, mimo że człowiek zdążył już przeczytać nazwę wcześniejszej pozycji. Tę próbę wykonaj także przy zmianie kolejności sugestii.

Sprawdź także wybór pozycji, która w międzyczasie została wycofana lub przestała obsługiwać dany rodzaj zgłoszenia. Interfejs powinien nazwać problem z konkretnym wyborem i pozwolić go zmienić. Nie zastępuj oddziału pierwszą dostępną pozycją bez wiedzy użytkownika. Dostępność danych słownika nie oznacza zamienności miejsc.

Przy powrocie do zapisanej wersji formularza pokaż, co udało się odtworzyć. Jeżeli identyfikator nadal istnieje, aktualna nazwa może różnić się od zapamiętanej. Gdy pozycja zniknęła, wyjaśnij potrzebę ponownego wyboru. Pozostałe pola formularza nie muszą przez to zostać wyzerowane.

Odbierz pole na zestawie niewygodnych nazw: bardzo długiej, identycznej z inną, zawierającej kod oraz nienależącej do słownika. Poproś uczestnika o wskazanie konkretnego punktu i wyjaśnienie, co zostało wybrane. Obserwuj również moment opuszczenia pola. Sprawdź, czy bez świadomego zatwierdzenia nie została wybrana pierwsza sugestia.

Taką pracę można połączyć z projektowaniem interfejsu w Aeneia Design. Wynikiem ma być zgodność trzech rzeczy: zamiaru użytkownika, informacji widocznej w polu i obiektu przekazanego dalej. Wtedy tuba z rysunkami pojedzie do wybranego punktu, nawet jeśli magazyn ma niemal taką samą nazwę.