Mis vahe on liitkastil, mitmikvalikul, loendikastil ja rippmenüül? Kuigi kõik need kasutajaliidese komponendid võivad tunduda sarnased, on neil erinev eesmärk. Valik taandub sageli saadaolevate valikute arvule ja nende nähtavusele. Vaatame, kuidas need erinevad, millist eesmärki nad teenivad ja kuidas valida õige – vältides arusaamatusi ja valesid ootusi.
Kõik loendi mustrid pole ühesugused Kõigil ülaltoodud kasutajaliidese komponentidel on täpselt üks ühine joon: need toetavad kasutajate suhtlust loenditega. Kuid nad teevad seda veidi erinevalt. Vaatame igaüks ükshaaval:
Rippmenüü → loend on peidetud, kuni see käivitatakse. Kombokast → sisestage filtreerimiseks + valige 1 valik. Mitmikvalimine → sisestage filtreerimiseks + valige palju valikuid. Loendikast → kõik loendi valikud on vaikimisi nähtavad (+ kerimine). Topeltloendikast → liigutage üksusi kahe loendikasti vahel.
Teisisõnu ühendab Combobox tekstisisestusvälja ripploendiga, nii et kasutajad saavad filtreerimiseks teksti sisestada ja valida ühe valiku. Multiselectiga saavad kasutajad valida palju valikuid (sageli kuvatakse pillide või kiipidena). Loendikastides kuvatakse kõik vaikimisi nähtavad loendi valikud, sageli kerimisega. See on kasulik, kui kasutajad peavad kohe kõiki saadaolevaid valikuid nägema. Topeltloendikast (nimetatakse ka edastusloendiks) on loendikasti variatsioon, mis võimaldab kasutajatel liigutada üksusi kahe loendikasti vahel (vasak ↔ parem), tavaliselt hulgivalikuks. Ära kunagi peida sageli kasutatavaid valikuid Nagu eespool mainitud, sõltub õige kasutajaliidese komponendi valik kahest tegurist: mitu loendi valikut on saadaval ja kas kõik need valikud peavad vaikimisi nähtavad olema. Kõik loendid võivad sisaldada ka puustruktuure, pesastamist ja rühmavalikut.
Iga kasutajaliidese komponendi puhul olen aastaid järginud ühte põhimõtet: ärge kunagi peitke sageli kasutatavaid valikuid. Kui kasutajad tuginevad teatud valikule sageli, on selle varjamine nende eest väga väike. Võiksime selle kas eelvalituks teha või (kui on ainult 2–3 sageli kasutatavat valikut) kuvada need kiipide või nuppudena ja seejärel kuvada ülejäänud loendi interaktsiooni kohta. Üldiselt on hea mõte kuvada alati populaarseid valikuid – isegi kui see võib kasutajaliidest segada. Kuidas valida millist? Mitte iga loend ei vaja keerulist valikumeetodit. Vähem kui 5 üksusega loendite puhul töötavad tavaliselt kõige paremini lihtsad raadionupud või märkeruudud. Kui aga kasutajatel on vaja valida suurest valikute loendist (nt 200+ üksust), on kombineeritud kast + mitmikvalik abiks kiirema filtreerimise (nt riigi valik) tõttu.
Loendikastid on abiks siis, kui inimestel on vaja korraga juurde pääseda paljudele valikutele, eriti kui neil on vaja valida ka sellest loendist palju valikuid. Need võivad olla abiks sageli kasutatavate filtrite puhul.
Dual listbox jäetakse sageli tähelepanuta ja ignoreeritakse. Kuid see võib olla abiks keeruliste ülesannete puhul, nt hulgivalik või rollide, ülesannete ja kohustuste määramine. See on ainus kasutajaliidese komponent, mis võimaldab kasutajatel enne sidumist oma täielikku valikuloendit kõrvuti allikaloendiga üle vaadata (nimetatakse ka „edastusloendiks”). Tegelikult on topeltloendikast sageli kiirem, täpsem ja juurdepääsetavam kui pukseerimine. Kasutatavuse kaalutlused Üks oluline märkus, mida meeles pidada, on see, et juurdepääsetavuse tagamiseks peavad kõik loenditüübid toetama klaviatuuriga navigeerimist (nt ↑/↓ nooleklahvid). Mõned inimesed toetuvad pärast tippimist alustades valikute valimisel peaaegu alati klaviatuurile.
Peale selle:
7+ valikuga loendite puhul kaaluge funktsioonide „Vali kõik” ja „Kustuta kõik” lisamist, et lihtsustada kasutajate suhtlust. Pikkade liitkastiga loendite puhul avage kasutajatele kõik valikud klõpsamisel/puudutamisel, sest muidu ei pruugita neid kunagi näha, Kõige tähtsam on see, et segaduse vältimiseks ärge kuvage mitteinteraktiivseid elemente nuppudena ja ärge kuvage interaktiivseid elemente staatiliste siltidena.
Kokkuvõte: kõik pole rippmenüü Nimed loevad. Vertikaalset valikute loendit kirjeldatakse tavaliselt kui "rippmenüüd", kuid sageli on see liiga üldine, et olla tähendusrikas. "Rippmenüü" vihjab, et loend on vaikimisi peidetud. "Mitmevalik" tähendab loendis mitut valikut (märkeruutu). Kombokast tähendab tekstisisestust. Ja "Loendikast" on lihtsalt valitavate üksuste loend, mis on alati nähtav. Eesmärk ei ole olla ülaltoodud määratlustega kooskõlas. Pigem aga kavatsuste ühtlustamiseks – rääkige nende kasutajaliidese komponentide üle otsustamisel, kujundamisel, ehitamisel ja seejärel kasutamisel sama keelt. See peaks töötamakõik – disainerid, insenerid ja lõppkasutajad – seni, kuni staatilised sildid ei näe välja nagu interaktiivsed nupud ja raadionupud ei toimi märkeruutudena. Tutvuge AI-liideste disainimustritega Meet Design Patterns for AI Interfaces, Vitaly uus videokursus, mis sisaldab praktilisi näiteid tegelikust elust pärit toodetest – koos reaalajas UX koolitusega, mis toimub peagi. Hüppa tasuta eelvaatele. Tutvuge AI-liideste disainimustritega, Vitaly videokursusega liidese disaini ja kasutajakogemuse kohta.
Video + UX-koolitus Ainult videovideo + UX-koolitus 450,00 $ 799,00
Hankige video + UX-koolitus 30 videotundi (10 tundi) + reaalajas UX-koolitus. 100-päevane raha tagasi garantii. Ainult video 275,00 395,00 dollarit
Hankige videokursus30 videotundi (10h). Värskendatakse igal aastal. Saadaval ka UX-i komplektina koos 3 videokursusega.
Kasulikud ressursid
Automaatne täitmine: UX juhised, autor Vitaly Friedman Combobox, eBay 👍 Combobox, firmalt Elastic Kombokast, Elisa Combobox, autor MongoDB 👍 Kombokast, Visa 👍 Combobox, autor Watson (Docplanner) Combobox, Wikimedia Kombokast, Zendesk Multiselect (MongoDB Combobox Design Docs), autor MongoDB 👍 Multiselect Lookup, Wikimedia Mitme valikuga liitkast, autor Vaadin Mitmikvalik, Visa poolt Ülekanne (loendikasti näide), autor Ant Design Loendikast, autor Hopper Nimekiri, Vaadin Listbox, Visa Kahe loendi valija, autor Red Hat (PatternFly) Dual Listbox, Salesforce (Lightning Design System) Mantine'i ülekandeloend Dual Listbox, autor Dashlite Märgid vs. pillid vs. kiibid vs. sildid, autor Vitaly Friedman Anna Kaley loendikastid vs. rippmenüü loendid (NN/g)
