Mis on kaasaegne kasutajaliidese disain? 10 näpunäidet ja näidet

Võimalik, et te ei pruugi moodsa kasutajaliidese esteetikat loetleda, kuid teate kindlasti, kui maandate veebisaidile, mis seda ei kasuta. See tundub lihtsalt dateerituna.

Kaasaegne kasutajaliidese disain aitab teie veebisaidi või kaubamärgi usaldusväärsust luua, kuna selle stiil sobib enamiku inimeste jaoks praeguseks visuaalseks esteetikaks. See võib hõlmata visuaalseid suundumusi, kohandamist kasutatavuse standardite ja mustritega ning tänapäevastele kasutajatele sobivate arendusvõtete kasutamist.

Siin käsitleme elemente, mida leiate tänapäevastest kasutajaliidestest. Loodetavasti tundub enamik neist näidetest üsna tuttavad, kuid kui ei, siis on aeg kavandada väike veebivärskendus.

1. Järjepidevus

Järjepidevat kasutajaliidest on lihtne kasutada ja mõista. Inimesed ei pea nii kõvasti mõtlema, kuidas oma veebisaidiga suhelda, muutes selle kasutamise tõenäolisemaks.

Soovite, et kujunduse elemendid oleksid üksteisega kooskõlas

Parim võiks olla järjepidevuse peale mõtlemine kahel viisil.

Esiteks soovite, et liides näeks välja ja käituks ühelt seadmelt järjepidevalt. (Seetõttu on tundlik disain nii oluline.)

Teiseks soovite, et kujunduse elemendid oleksid üksteisega kooskõlas - näiteks sama värvi, suurusega ja tavalistes kohtades olevad nupud - ning järgiksid tavalisi kasutusharjumusi. Seda tüüpi kujunduse järjepidevus muudab teie liidese kaasaegseks ja kasutatavaks.

Interaction Design Foundation ütleb, et kasutajaliidese järjepidevus on oluline, kuna:

• See võib vähendada õppimisaega: järjepidevus piirab toimingute ja toimingute esindatuse viise, tagades, et kasutajad ei pea õppima iga ülesande jaoks uusi esitusi.
• See võib segaduse kõrvaldada: kasutajad kipuvad kohaldama reegleid, mida nad on kogenud väljaspool teie veebisaiti või toodet, tuues sisse oma ootused. Teades seda, peaksime projekteerimisstandarditest ja konventsioonidest kõrvalekaldudes arvestama sellega, kas põhjustame segadust ja võõrandumist.

2. Kalded ja sügavus

Kaasaegsed liidesed kasutavad värvi, et luua sügavust ja aidata inimestel mõista, kuidas kujundusega suhelda.

Gradiendid ja peened varjud on populaarsed tehnikad. Gradiendi värvi kasutamine on üsna trendikas ja pakub huvitavat visuaali tähelepanu juhtimiseks. Varjutatud varjud pole laiemale silmale nii ilmsed, kuid näivad, et suhtluse soodustamiseks tõstavad elemendid taustalt välja.

3. Sihipärane animatsioon

Animatsioon on peaaegu kõikjal veebisaidi kujundamisel, mistõttu on veelgi olulisem, et seda tehnikat ei kasutataks üle.

Kaasaegsed liidesed animeerivad elemente ainult siis, kui selleks on põhjust. Sihipärane animatsioon võib aidata kasutajal nupul klõpsata, anda navigeerimisjuhiseid, anda juhiseid või olla lihtsa vaimustava funktsioonina.

Kui soovite veenduda, et teie veebisaidi animatsioonidel on otstarve ja need pole puhtad kaunistused, mõelge animeeritud elemendi eesmärgile ja sellele, kuidas see töötab üldise kujunduse osana.

4. Kergesti loetavad fondi suurused

Tõenäoliselt olete märganud, et põhiteksti vaikesuurused on aeglaselt suurenenud. Kõikjal silmad tänavad teid.

Pisikesed, peaaegu loetamatud kirjasuurused on üks esimesi asju, mis teie kasutajaliidesele dateeritakse. Inimesed on harjunud suuremate, paremini loetavate kirjatüüpidega.

See võib olla teie veebisaidil 14–16-punktine tekst. Ehkki see võib alguses tunduda suur, on see suurus silmale meeldivam, teisendatakse loetava suurusega mobiiliekraaniks ja on muutunud üsna standardseks. (Ärge unustage kohandada ka reavahe vastavalt sobivale mõõtmele.)

5. Häälliidesed

Kas teie veebisaidil on teavet, mida kasutajatel on häälega suhtlemisel lihtne leida? Interaktiivsed hääleliidesed võivad olla üks kasutajaliidese kujundamise kõige kiiremini kasvavaid segmente.

Saate oma veebisaidi kujundada nii, et see hõlbustaks hääleliideste ja inimeste juurdepääsu teie sisule. Küsige ja vastake tavalistele küsimustele, pakkuge väärtuslikku teavet väikestes osades, kasutage kavatsuse loomiseks näiteid ja kasutage visuaalset tagasisidet liidese kuulamise ajal.

Projekti Interaction Design sõnum on järgmine:

Suurepäraste häälkasutajaliideste kujundamiseks peate leidma elegantse viisi, kuidas pakkuda kasutajatele puuduvat teavet selle kohta, mida nad saavad teha ja kuidas nad saavad seda teha ilma, et neile liiga teeks.

6. Õmblusteta koostoime

Veebisaitide interaktsioonid peavad olema sujuvad nii ühes seadmes kui ka ühest seadmest teise.

Kasutajad soovivad lehelt lehele liikudes sama kogemust. Samuti soovivad nad, et veebisait näeks välja ja toimiks samamoodi oma lauaarvutites ja telefonides.

Kõik kaasaegsed kasutajaliidesed järgivad neid juhiseid. Kui teie sait seda ei vaja, peate kohe oma veebisaidi mudeli ümber mõtlema ja kavandama.

7. Nutikad vormid / sisendid

Möödas on massiliste veebivormide päevad, mis nõuavad liiga palju teavet. Kaasaegsed liidesed kasutavad lühivorme, mis küsivad ainult seda, mis on vajalik iga kasutaja aja austamiseks ja austamiseks (ja lühikese tähelepanuvahemiku jaoks).

Kaasaegsed liidesed kasutavad nutikaid vorme ja sisendeid. See tähendab, et küsitakse ainult vajalikku teavet (vajadusel kasutage vormi väljade if-then loogikat) ja kinnitage andmed. Viimane on eriti oluline väiksemates seadmetes, kuna seda on lihtne valesti kirjutada ja vigu tekitada; andmete valideerimine teatab kasutajale, et midagi on kohe valesti ja hoiab ära hilisemad protsessid.

8. Turvaline ja usaldusväärne

See on peaaegu iseenesestmõistetav, kuid teie veebisait peab olema turvaline ja usaldusväärne.

Kasutajad otsivad ostlemisel ja sirvimisel sageli turvalist lukku, muutes SSL-i ja HTTPS-i kohustuslikuks. Kõik muu on nii 2010.

9. Kohandatav ja isikupärastatud

Rohkem liideseid pakuvad kasutajatele kohandatavamaid, isikupärastatud teenuseid.

Kasutades tööriistu, mis täpsustavad kasutaja asukohta keele ja valuuta toetamiseks, on küpsised, mis hoiavad mõne päeva jooksul ostukärusid, või sisselogimised, mis võimaldavad kasutajatel luua isiklikuma kogemuse.

Kohandamine ja isikupärastamine saavad eristumise kohaks, mis aitab inimestel valida teie veebisaidi teiste hulgast, kui neil on valida. Need väikesed detailid võivad palju muuta.

10. arenev

Teil peab olema disain, mis võib aja jooksul areneda ja muutuda.

Me tavatsesime öelda, et vajate uut veebisaidi kujundust iga kolme kuni viie aasta tagant; nüüd peate värskenduse ja asjakohasena hoidmiseks vajama veebisaidi kohandamist umbes iga 6 kuu tagant. (Tehnoloogia liigub nii kiiresti.)

Alates väikestest kujundusmuudatustest kuni kasutatavuse värskendusteni on oluline pöörata tähelepanu teistele veebisaitidele nähtavatele ja mõelda, kuidas need muudatused ja edusammud võiksid teie enda jaoks kasulikud olla.

Järeldus

Ehkki see võib alguses tunduda, pole moodsa kasutajaliidese loomine raketiteadus. See on rohkem kasutaja käitumise ja mustrite ning neid mõjutavate kujundusvalikute uurimine.

Trendimise ja moodsa liidese kujunduse vahel on täpne piir. Viimane kipub pikemalt kinni jääma ning on funktsiooni ja kasutatavuse osas pisut rohkem juurdunud, kus esimene on enamasti esteetiline.

Alustage mõtteviisist, et veebidisain muutub alati. Seejärel mõelge positiivsetele ja meeldejäävatele veebikogemustele ning kaaluge neid tehnikaid oma liideste tulevastes versioonides.