6 moodustavad UX-mustrid - ja millal neid vältida

Autor: Peter Berry
Loomise Kuupäev: 12 Juuli 2021
Värskenduse Kuupäev: 13 Mai 2024
Anonim
6 moodustavad UX-mustrid - ja millal neid vältida - Loominguline
6 moodustavad UX-mustrid - ja millal neid vältida - Loominguline

Sisu

Igavad, igavad vormid. Armastage neid või vihkan neid (ja olgem ausad, te vihkate neid), need on peaaegu iga veebiehituse vältimatu osa ja olenemata sellest, kas ehitate täisväärtuslikke veebipoode (näiteks meie inspireerivaid näiteid poodide veebisaitidest) või otse ettevõtte saitidel (võib-olla kasutades suurepärast veebisaidi koostajat), peate varem või hiljem mõne vormi tegema.

Vaevalt võime disainereid süüdistada selles, et nad üritavad välja mõelda uuenduslikke viise, kuidas neid huvitavamaks muuta, kuid kui paljud neist vormitrendidest on kasutatavuse seisukohast tegelikult üleval? Vaatame mõnda levinud vormi UX-mustrit, alustades modaalide sees olevatest vormidest.

Kas otsite rohkem veebidisaini nõuandeid? Vaadake meie tipp-veebimajutusteenuseid.

  • 10 reeglit kasutajasõbralike veebivormide valmistamiseks

01. Vormimodaalid

Vormide paigutamine modaalide sisse ja nende dünaamiline ilmumine tundub muidu liiga keerulise olukorra ilmse lahendusena. Lõppude lõpuks ei võta vormid märkimisväärset ruumi, miks nad vajavad oma spetsiaalset URL-i? Tegelikult on mitu põhjust.


Juurdepääsetavus. Kõige olulisem põhjus on see, et kui muudame modaalid juurdepääsetavaks (ja ilmselt peaksime seda tegema), siis tuleks need hõlpsasti tagasi lükata, vajutades ESC-klahvi või klõpsates modaali tühikul. Nüüd, kui modaalid on hõlpsasti kõrvale jäetud, oleks ebamugavus (rääkimata vastupääsetavast), kui pooleldi vormi täitmist modali (ja esitamata vormiandmete) kogemata maha jätta.

Klienditugi. Lisaks juurdepääsetavusele tähendab vormide kombineerimine modaalidega ja vormi sisuliselt mitte majutamine spetsiaalsel URL-il seda, et klienditeeninduse esindajad ei saa suhtluse ajal nende vormidega linkida, mis teeb nii klientide kui ka klienditeenindajate jaoks asjad väga keeruliseks.

Paroolihaldurid (kas brauserisiseselt või eraldiseisvate rakendustena) mäletavad mõnikord sisselogimisandmeid ekraanipõhiselt, nii et kui kasutaja saab sisse logida kõikjalt, kus ta on rakenduses või veebisaidil, võib tema sisselogimise hankimine olla keeruline üksikasjad, kui need üksikasjad salvestati, kui kasutaja oli teisel URL-il.


Lahendus: ärge renderdage vorme modaalides. Vormide renderdamine modaalides sisaldab rohkem probleeme, kui see lahendab, ja kuigi mõned vormid on nii põhilised, et see muudab ekraani praktiliselt tühjaks, pole tõenäoliselt vorme täitvatel kasutajatel sellest mingit huvi. Ka teie olete kasutaja, nii et teate juba, et vormi kohene vastus on: "Ma loodan, et see ei võta kaua aega", mitte ", see vorm ei tundu piisavalt huvitav". Pange esmatähtsaks see, et kasutajad saaksid liikuda sellele, mida nad tegelikult otsisid.

02. Mitteemantiline juurdehindlus

Elemendid pole kõik võrdsed. Semantiline märgistus tagab, et iga kord on erinevad koodimärgised; Näiteks, kuigi tavaline sisendväli võib välja näha sama mis e-posti väli, teavad rakenduse ja brauseri müüjad erinevust ning nende käitumine on nõuetekohaselt kohandatud sõltuvalt eeldatavast sisendist.


Mobiilseadmete fokuseeritud e-posti väljadel kuvatakse klaviatuuri versioon, kus sümbol @ on kohe saadaval, samas kui tavalised sisendväljad ei käitu nii. Lihtsalt kontseptsiooni tugevdamiseks asendavad parooliväljad kasutajate sisendi turvalisuse huvides nähtavalt tärnidega ja URL-i väljad kuvavad mugavuse huvides klaviatuuril .com.

Kuid kuna need erinevused on nii peened, unustatakse sageli semantika, eriti disainerite poolt, kes ei ole neist erinevustest teadlikud, kuna nad pole koodipoolega seotud.

Lahendus: rakendada semantilist märgistust. Semantilise märgistuse kasutamiseta ei saa kasutajad neid ajasäästlikke kasutatavuse eeliseid lõigata, mistõttu soovitan disaineritel alati arendajatele teada anda, kuidas teatud kasutajaliidese elemendid peaksid käituma kas üleandmise ajal või muul viisil.

Arendajad ja disainerid peaksid hoiduma ka sisendväljade peitmisest (s.t. sisendi tüüp = "varjatud"> või samaväärne) - mõiste, mida kasutatakse teabe järkjärguliseks avalikustamiseks või kogumiseks, mis on kättesaadav ilma, et kasutaja seda konkreetselt pakuks (näiteks asukoht, juurdepääs serveripoolele). Varjatud sisendväljadel pole automaatse täitmise jõustumise ajal sisuliselt ühtegi tüüpi, mille tulemusel jäetakse see täielikult vahele.

03. Jagatud vormid

Jagatud vormid on pikad vormid, mis on jaotatud osadeks; näiteks üks jaotis tarneaadressi jaoks ja teine ​​jaotis arveldusinfo jaoks. See mõiste on tegelikult täiesti mõistlik ja seda on kasutatud (edukalt) tõesti pikka aega.

Loomulikult on vormi jagamise peamine eelis kognitiivse ülekoormuse vähenemine; kuid vormi jagamise väärkasutamisel võib tegelikult olla kahjulik mõju. Näiteks sisselogimisvormidega rakendamisel ei ole tarbetu sundida kasutajaid liikuma läbi kahe etapi, kui igal sammul on ainult üks väli (e-posti aadress ja parool), rääkimata asjaolust, et see rikub automaatse täitmise eeliseid.

Automaatne täitmine töötab kooskõlas teiste sisendväljadega. Näiteks kui kasutajad sisestavad sisselogimiseks oma e-posti aadressi, täidetakse parooliväli mugavalt selle e-posti aadressi jaoks salvestatud õige kombinatsiooniga, kuid jagades seotud väljad erinevateks toiminguteks, ei saa brauser automaatselt täita seda, mida seal pole. Automaatne täitmine võib päeva päästa, kuid tulemus sõltub tõesti sellest, kas brauser teeb õiged eeldused (st kui kasutajal on sama veebisaidi või rakenduse jaoks mitu sisselogimist, võib brauser valida vale kombinatsiooni).

Lahendus: Muuda vormid igavaks!

Vormid on igavad ja jäävad alati. Selle asemel, et püüda neid huvitavaks muuta, on kõige kasutajakesksem kujundusotsus, mida vormide osas teha saame, muuta need kiiremaks ja hõlpsamini kasutatavaks. Vormi jagamise osas on tehnika parim rakendamine kasutada seda ainult mitteseotud väljade jagamisel.

04. Maagilised lingid

Sisselogimisvormide teema juurde jäädes on võlulinkid uus trend, kus pärast e-posti aadressi sisestamist saadetakse kasutajale link, mis logib need automaatselt sisse. Kui olete Slacki kunagi kasutanud, olete juba tuttav kontseptsiooniga, mis säästab mobiilseadmes parooli sisestamist.

Mõni võib öelda, et see mõte on natuke väsitav, kuna kasutaja peab sisselogimiseks rakenduse vahetama, ehkki UX-voog on tõepoolest veidi parem kui ajutiste sisselogimisandmete saamine, mida kasutaja peab sisselogimiseks nimetatud rakendusse kopeerima Lisaks automaatse täitmise ja / või automaatse täitmise rikkumisele võivad harjumatud kokkulepped kasutajatele segadust tekitada.

Lahendus: Tehke võlulingid valikuliseks või teisejärguliseks. Maagilistel linkidel pole palju viga ja need võivad kindlasti olla kasulikud mobiilikasutajatele, kes pigem ei kirjuta; konventsioon teeb siiski liiga palju oletusi selle kohta, kuidas kasutaja oma e-posti seadistab. Parimate tulemuste tagamiseks muutke võlulingid vabatahtlikuks.

05. Kaheastmeline autentimine

Kahefaktoriline autentimine (või 2FA) on midagi kahe otsaga mõõka. Ühelt poolt suurendab see turvalisust, paludes kasutajatel SMS-i, e-posti või mõne 2FA autentimisrakenduse kaudu sisselogimiskatsed heaks kiita; teisest küljest sunnib kasutajaid kinnitama sisselogimiskatseid SMS-i, e-posti või mõne 2FA autentimisrakenduse kaudu - urgh!

Nagu inimpsühholoogia dikteerib, oleme rohkem seotud probleemidega, mis meil praegu on, seega on raske hoolitseda turvalisuse eelistest enne, kui meie kontole on tegelikult sisse häkitud. Enamik kasutajaid ei soovi 2FA-d enne, kui neil seda vaja on.

Lahendus: Ärge rakendage 2FA-d või vähemalt pakuge selle jõustamiseks mugavaid viise, näiteks WiFi või e-posti teel.

Kui 2FA pole vajalik, muutke see vähemalt valikuliseks (st kasutaja peab selle rakenduse või veebisaidi seadete kaudu sisse lülitama).

Oletame, et kasutaja on välismaal. Neil puudub juurdepääs oma igapäevastele mobiilandmetele; neil võib siiski olla juurdepääs WiFi-le, seega oleks e-post või 2FA autentimisrakendus, näiteks Google Authenticator, palju mugavam kui SMS-põhine autentimine. Ja kui kasutaja saab selle ajutiselt välja lülitada, siis veelgi parem!

06. Dünaamilised kohatäited

Sisendisiltidel on tõeliselt ebaõiglane maine, sest need võivad vormid näida kohmakad ja meile õpetatakse uskuma, et vähem on rohkem. Kuid see pole üks neist kordadest. Viimase paari aasta tavaline kasutajaliidese kujundamise suundumus on sisestusväljale klõpsamisel kohatäite teksti üleminek sildile. Kuid kohatäited ja sisendsildid täidavad tegelikult kahte väga erinevat funktsiooni ja üks ei saa teist asendada, ükskõik kui lahe animatsioon ka ei tunduks.

Kohahoidjaid kasutatakse selleks, et näidata kasutajale, mida peetakse vastuvõetavaks väärtuseks, samas kui silt on lihtsalt lühike kirjeldus selle kohta, milleks sisendväli on mõeldud. Siin on näide kombinatsioonist:

Silt: "Nimi" Kohatäide: "John Doe"

Kui teie lühiajaline mälu pole fantastiline, on teil tõenäoliselt ühel hetkel olnud hetk, kus olete unustanud selle, mida pidite poolel vormivälja täitmisel sisestama. See on väga levinud stsenaarium.

Lahendus: Hoidke vähemalt silt alati nähtav. Hoides silti nähtavana, saate tagada, et vormivälju oleks hõlpsasti korrektselt täita, isegi erinevate juurdepääsuvajadustega kasutajatele või suurenenud kognitiivse koormusega inimestele mürarikkas, häirivas või stressirohkes keskkonnas.

Kas teil on hunnik uusi ideid? Hoidke neid pilvemälus.

See artikkel ilmus algselt väljaande 318 väljaandes võrk, maailma enimmüüdud ajakiri veebidisaineritele ja -arendajatele. Osta väljaanne 318 siit või telli siin.

Uued Postitused
Kuulsuste peakoka veebisait on maitsvalt reageeriv
Lugema

Kuulsuste peakoka veebisait on maitsvalt reageeriv

Püha koka Raymond Blanci nägemu Le Manoir aux Quat’ ai on on luk u hotell, mi pakub uurbritannia uurimaid kulinaar eid elamu i.Uima tava fotograafia ja rikkaliku i uga reageerimi võimel...
Cinema 4D saab evolutsioonilise täienduse
Lugema

Cinema 4D saab evolutsioonilise täienduse

Tradit ioonili e vaheajana alu tame eda ülevaadet a jadega, mida pole Cinema 4D R15-le li atud. Meil pole ikka veel interaktiiv et renderdajat ega õlm ek tuuri ü teemi (kuigi välja...
Dev kutsub „Max CSS-i” uustulnukaid aitama
Lugema

Dev kutsub „Max CSS-i” uustulnukaid aitama

Di aineri ja arendaja Dan Edeni loodud Max C -i veebi ait julgu tab arendajaid pakkuma linke C -dokumentide tihendamata ver ioonile. ait märgib, et kuigi veebi aitide loomi e ja kujundami e õ...