Gida txiki hau konfiguratu dut, zuen diseinu-prozesuan balioko dizula espero dudana, web garatzailea izan zein hasi berria izan. Kontzeptu horietako askok diseinu egokiari buruzko xehetasunak lortzen lagunduko dizuete.

 

Edozein interfazetan kontuan hartu beharreko helburu garrantzitsuenetako bat argitasuna da. Interfaze eraginkorreko diseinu batean, erabiltzaileak modu natural eta intuitiboan ulertzen eta ezagutzen ditu hura osatzen duten elementu guztiak. Erabiltzaile ertain bat eroso egongo da interfazean erakusten denaren gainean elkarreraginean arrakastaz gertatuko dena iragar dezakeenean. Beraz, esan dezakegu interfaze argi batek konfiantza sortzen duela eta ondorengo erabilera dakarrela.

Argitasuna eta eraginkortasuna lortzeko, proiektu berri batean kontuan hartu beharreko zazpi oinarrizko eraikuntza-kontzeptuetan oinarritu gaitezke.

Hutsune zuria

 

Diseinu on orok ikusmen-oreka izan behar du, eta hori gertatzeko elementu garrantzitsuenetako bat edozein konposiziotan aurki ditzakegun espazio hutsak ere deitzen diren espazio zuriak dira. Betegarri, marjina eta lerroaren altuera gisa 3 CSS propietate erabiliz, testu baten itxura nabarmen hobetu daiteke.

Kolorea

 

Kolore egokiak aukeratzeko ahalegin handia egin behar da. Ikuspegi sistematiko bati jarraitu behar diozu, interfazea diseinatzeko proiektuaren beharrak beteko dituen kolore-multzo bat definitzeko. Kolore-paleta on bat sor dezakezu hiru kategoriatan banatuz: neutroak (normalean grisak), kolore primarioak eta azentu-koloreak.

 

Interfaze batean ia dena grisa izaten da (edo kolore neutrokoa) eta uste baino gris gehiago behar dituzula jakiteak harritu egingo zaitu. Gomendagarriena 8 eta 10 tonu arteko barietatea izatea da, eta ilunetik argienera etengabe igotzea.

 

Kolore primarioek zehaztuko dute leku baten itxura orokorra, normalean bi kolore. Ekintza nagusietarako, nabigazio-elementuak nabarmentzeko eta abarretarako erabiltzen dira. 5 eta 10 tonu artean beharko dituzu.

 

Azentu-koloreak erabiltzailearen arreta erakartzeko erabiltzen dira, adibidez, ezaugarri berri bat nabarmentzeko, egoera semantiko desberdinak nabarmentzeko (gorria, horia, berdea), ohartarazpen-mezu bat nabarmentzeko eta abar. Hemen ere kolore bakoitzeko kolore-paleta hainbat tonurekin konfiguratu beharko duzu, nahiz eta nahiko neurrian erabili beharko diren.

Captura%20de%20pantalla%202020-05-22%20a%20las%208.49.31.png

Kontrastea

WCAG 2.0. kontraste-jarraibideei buruzko arau espezifikoen eta gomendioen multzo bat dago, web-edukia sortzeko. Jarraibide horiek jarraituz, eduki eskuragarriago bat sor daiteke ikusmen-desgaitasuna duten pertsona gehiagorentzat.

 

Kontrastatzeak esan nahi du elementu desberdinak konparatu behar direla, diferentziak handia izan behar duelako berezitasunarekin. Kontrastearen funtzio nagusia nagusia eta sekundarioa bereiztea da, lehiatu ez daitezen, eta, beraz, erabiltzailearen begirada orientatzea. Kontrastatzean, ikusizko mezuari argitasuna emateaz gain, erakargarriagoa ere egiten dugu. Kontrastea aplikatzeko hainbat modu daude, eta taldean edo bereizita erabil ditzakegu. Adibidez, honako hauen arteko kontrastea: tamainak, irudiak, eskalak, koloreak, tonu argi ilunak, saturazioa, testurak, tipografiak, etab.

Captura%20de%20pantalla%202020-05-22%20a%20las%2012.46.10.png

Eskala

Eskalatzat hartzen dugu dimentsio errealen eta errealitatea irudikatzen duen marrazkiaren arteko proportzio-erlazioa, edo diseinu bateko bi elementuren arteko zuzeneko erlazioa. Eskala behar bezala erabiltzeak eragin ona du erabiltzaileak konposizio bat ikusten eta hari zentzua aurkitzen dion moduan. Batzuetan eskala erabiltzen da ikusmen-hierarkia bat sortzeko.

Lerrokatzea

 

Lerrokadura elementu bakoitza beste elementu batzuen aldean behar bezala kokatzen dela ziurtatzeko prozesua da. Elementuak zeharkatzen dituen eta bisualki konektatzen dituen ardatz ikusezin bat imajina dezakegu, ertzetatik edo erdiguneetatik. Ez da beharrezkoa konposizio guztiak lerrokatze-eredu berari jarraitzea, baina garrantzitsua da elementu guztien lerrokadura kontuan hartzea, konposizio orekatua eta ordenatua sortzeko, batez ere ikusizko argitasuna eman dezan.

Captura%20de%20pantalla%202020-05-22%20a%20las%2012.26.14.png

Tipografia

 

Tipografiak garrantzi handia du diseinuan, letra-motak berak hainbat ideia komunikatu baititzake, baita nortasun-zigilu bat transmititu ere.

Lan egiteko orduan, hainbat gogoeta hartu behar dira kontuan; izan ere, atal bakoitzean erabiliko ditugun tamainak, letren arteko tartea eta lerroartea modu koherentean erabaki behar ditugu, iturri nagusi egokia aukeratzeaz gain. Ziurtatu irakurgarritasuna ona, argia eta garbia dela. Komeni da familia tipografiko oso bat izatea bere estiloak erabiltzeko eta, horrela, ikusmen-hierarkia bat ezartzeko. Ez gehiegi erabili letra larriak, eta ziurtatu kontrasteak sortzen dituzula.

Captura%20de%20pantalla%202020-05-22%20a%20las%2012.56.30.png

Ikusmen-hierarkia

 

Erabiltzaile-interfaze batean elementuen garrantzia ezarri behar dugu bistaratze-ordena argi batean, elementu batzuk beste batzuk baino garrantzitsuagoak baitira. Ikusmen-hierarkia sendoa lortuko duzu erabiltzaileek elementu berak ordena berean ikusten dituztenean aldi bakoitzean, nahiz eta elementu horietaz ez jabetu. Erabiltzaileak nahasmena eta nahastea sumatzea saihestu behar duzu. Ondo eraikitako interfaze batean, erabiltzaileak begiradari atseden emateko espazioak eta elkarri eragiteko arreta jartzeko espazioak aurkitu behar ditu.

 

Gogoratu gutxiago, gehiago da. Esaldi horrek azken eta hurrengo urteetako diseinu-joerak defini ditzake. UI (Erabiltzailearen Interfazea) diseinu on batek ikusezina izan behar du; oro har, erabiltzailearentzat oharkabean pasatu behar du. Zenbat eta argiagoa, errazagoa eta sendoagoa izan, orduan eta erabiltzaile esperientzia hobea izango du. Diseinua zuzena bada, erabiltzaileak bere helburuetan jarri ahal izango du arreta, eta ez interfazean; horrela, pozik dagoen erabiltzaile bat lortuko dugu.

 

Ikusten duzunez, jarraibide asko hartu behar dira kontuan UI diseinu-proiektu bat egiteko orduan, eta horietan sakondu daiteke. Jarraitu gehiago irakurtzen gure blogean.😉