UI/UX Disain

Kliendi taust

Projekti tellija oli Taltech ning lõppkliendiks on Õiglase Ülemineku Fond (ÕÜF), mis keskendub teaduslike algatuste juhtimisele seoses Ida-Virumaa õiglase üleminekuga. Veebilehe peamine sihtrühm on teadlased, akadeemilised asutused, piirkonna ettevõtted ja organisatsioonid, kohalike omavalitsuste esindajad ning meediaprofessionaalid. Veebilehe eesmärk on olla põhjalik platvorm teadusuuringute ja Ida-Virumaa ülemineku jõupingutuste kohta teabe levitamiseks ja koostöö hõlbustamiseks.

 

Projekti eesmärgid

Projekti peamine eesmärk oli luua visuaalselt atraktiivne ja kergesti navigeeritav veebileht, mis edendaks kasutajate kaasamist, annaks selge ülevaate uurimisvaldkondadest ja kajastaks uudiseid ning värskendusi, mis on seotud Ida-Virumaa õiglase üleminekuga. Veebileht pidi kajastama Tallinna Tehnikaülikooli (TTÜ) ja Tartu Ülikooli (TÜ) koostööd ning asuma domeenil teadusidavirumaal.ee, kasutades WordPressi sisuhaldussüsteemi (CMS). Lisaks pidi veebileht pakkuma teadusvaldkonna uudiseid, meediakajastusi ja tulevasi üritusi.

Töö ulatus

Projekti töö ulatus hõlmas järgmist:

1. Veebistruktuur ja sisuplokid: Veebileht pidi olema modulaarne, üles ehitatud paindlikele sisuplokkidele, mida saab vastavalt vajadusele ümber korraldada ja redigeerida. Need plokid sisaldasid bänneri slaiderit, kutset tegevusele (CTA), uudiste ja meeskonnaliikmete sektsioone. Iga plokk oli disainitud kasutajasõbralikuks ja visuaalselt meeldivaks​.
2. Põhivaated ja funktsionaalsus: Veebilehe ülesehitus sisaldas mitmeid olulisi vaateid:
   • Avaleht: Sisaldas bänneri slaiderit, uudisteplokki, CTA-d ja fookusvaldkondi.
   • Meeskonnalehed: Kuvati juhtkomitee ja töörühmade liikmete profiilid koos kontaktandmetega.
   • Uudised ja meediakajastused: Kuvati automaatselt uusimaid artikleid ja meediakajastusi.
   • Fookusvaldkonna lehed: Esile tõsteti konkreetsed uurimisvaldkonnad ja projektid​.
3. Disaini spetsifikatsioonid:
   • Värvilahendus: Sinine ja roheline värv palett, mis vastas kliendi soovitud visuaalsele identiteedile.
   • Logo nõuded: Veebilehel kuvati selgelt TTÜ, TÜ ja Euroopa Regionaalarengufondi logod. Logod kasutati SVG failidena, et tagada kvaliteet erinevatel seadmetel​.
   • Responsiivne disain: Veebileht oli täielikult optimeeritud mobiiliseadmetele, tagades sujuva funktsionaalsuse lauaarvutites, tahvelarvutites ja nutitelefonides​.
4. Tehnilised nõuded:
   • Veebileht arendati WordPressi platvormile ja kõik disaini- ja funktsionaalsed elemendid integreeriti sisuhaldussüsteemi, et hõlbustada haldamist.
   • Kasutati pluginaid turvalisuse, SEO optimeerimise ja piltide optimeerimise tagamiseks, et parandada veebisaidi jõudlust ja kaitsta seda haavatavuste eest.
   • Projekti käigus järgiti WCAG 2.2 ligipääsetavuse standardeid ja OWASP turvastandardeid, saavutades eesmärgiks seatud vähemalt 95 punkti Google PageSpeed Insightsi jõudluse mõõtmises​.

 

Disaini ja arenduse protsess

Projekt järgis struktureeritud arendusprotsessi:

• Esialgne konsultatsioon ja visuaalne skeem: Meeskond tegi koostööd kliendiga, et mõista nõudeid, mis dokumenteeriti detailses projektikirjelduses ja visuaalses skeemis. See tagas kõigi osapoolte ühtse arusaama veebilehe paigutusest ja funktsionaalsusest​.
• Sisu haldamine ja disaini kohandused: Projekti jooksul täpsustas klient sisu, nagu töörühmade tutvustused ja meeskonnaliikmete profiilid. Disaini kohandati vastavalt kliendi tagasisidele, et tagada vastavus visuaalsetele ja funktsionaalsetele ootustele​.
• Responsiivne ja kasutajasõbralik disain: Disainimeeskond keskendus responsiivsele disainile, mis toimiks hästi erinevates seadmetes. Tähelepanu pöörati ka sellele, et kriitilised elemendid, nagu uudiste artiklid ja tegevuskutsed, oleksid kergesti klikitavad ja kasutajasõbralikud​.

 

Peamised väljakutsed ja lahendused

1. Erinevate logode ja visuaalide haldamine: Üks väljakutseid oli tagada, et logod kuvatakse kvaliteetselt erinevates seadmetes. Probleem lahendati, kasutades rasterpiltide asemel SVG faile​.
2. Kasutajakogemuse kohandamine: Klient soovis mitmeid kohandusi, et parandada kasutajakogemust, näiteks uudiste sektsiooni piltide klikitavaks muutmist ja meeskonnaliikmete kontaktandmete paremat nähtavust. Need kohandused tehti projekti lõppfaasis​.
3. Ligipääsetavuse tagamine: WCAG 2.2 standarditele vastamine nõudis suurt tähelepanu kontrastsuse, fontide suuruse ja muude kasutusmugavuse tegurite osas, eriti mobiilikasutajatele. Otsinguriba ja nuppude tekst tehti tumedamaks, et tagada kontrastsusnõuete täitmine​.

 

Projekti tulemus

TeadusIdaVirumaal.ee veebileht vastas edukalt kliendi eesmärkidele, pakkudes visuaalselt köitvat ja funktsionaalselt tugevat platvormi. Lõplik veebileht sisaldas intuitiivset navigeerimist, kvaliteetseid visuaale ja tugevat tehnilist jõudlust. Pärast lansseerimist optimeeriti veebileht otsingumootorite jaoks (SEO), mis aitas parandada lehe leitavust.

Veebilehe lansseerimine toetas Õiglase Ülemineku Fondi laiemat eesmärki pakkuda keskset platvormi teaduskoostööks, meediakajastuste levitamiseks ja sidusrühmade kaasamiseks, muutes selle oluliseks ressursiks Ida-Virumaa õiglase ülemineku protsessis.

Vaata tulemust siin: teadusidavirumaal.ee

UI disain on üks kõige olulisemaid komponente kasutajakogemuses. Selle eesmärk on luua lihtne, kasutajasõbralik ja atraktiivne kasutajaliides, mis aitab inimestel suhelda tõhusalt digitaalsete rakenduste ja süsteemidega. UI/UX disaini loomisel arvestatakse erinevaid aspekte, nagu disaini esteetika, funktsionaalsus, kasutusmugavus, interaktsiooni disain ja visuaalne identiteet. Selle artikli eesmärk on uurida, miks on UI/UX disaini roll nii oluline ja kuidas seda rakendatakse erinevates digitaalsetes platvormides.

UI disaini olulisus

Kasutajakogemus on palju enamat kui lihtsalt süsteemiga interaktsioon. Selle eesmärk on tagada, et kasutaja saaks oma eesmärke täita ilma takistusteta ja tunneks selle protsessi ajal mugavust. UI/UX disain mängib selles protsessis olulist rolli. Kui kasutaja on rahulolematu kasutajaliidesega, võib ta hakata kahtlema süsteemi usaldusväärsuses ja funktsionaalsuses. See võib omakorda kaasa tuua negatiivseid tagajärgi, näiteks halbu arvustusi, vähem kasutajaid ja madalamat tulu.

Kasutajakogemuse kvaliteet mõjutab otseselt kasutaja rahulolu, lojaalsust ja tagasiside kvaliteeti. Kui kasutaja leiab süsteemi kasutamise lihtsaks ja mugavaks, on tal suurem tõenäosus jätkata selle kasutamist ja soovitada seda ka teistele. Seetõttu on UI/UX disaini kasutamine äärmiselt oluline eduka digitaalse toote loomisel.

UI disaini rakendamine

UI/UX disaini loomine algab protsessi mõistmisest ja kasutaja vajaduste analüüsimisest. Disaini meeskond peab mõistma, kuidas kasutajad süsteemi kasutavad, millised on nende eesmärgid ja millised on nende eelistused. Seejärel saab disainimeeskond kasutada kogutud teavet, et luua lihtne ja kasutajasõbralik kasutajaliides.

Üks oluline aspekt UI/UX disainis on funktsionaalsus. Kasutajaliides peab olema hästi struktureeritud ja loogiliselt paigutatud, et kasutajad saaksid kiiresti navigeerida ja oma eesmärke saavutada. Disaini meeskond peab tagama, et iga funktsionaalus on kergesti leitav ja selgesti arusaadav.

UI/UX disain on vajalik igasuguse digitaalse toote puhul. See hõlmab mitmeid erinevaid elemente, alates funktsionaalsusest kuni kasutajaliidese esteetikani, kõik selleks, et tagada kasutajakogemuse sujuvus. Selles artiklis uurime, kuidas saate luua tõhusat kasutajakogemust, kuidas UI/UX disain aitab teil oma eesmärke saavutada ja miks see on nii oluline.

Kasutajakogemuse määratlus

Kasutajakogemus (UX) hõlmab kõike, mida kasutaja toote kasutamisel tunneb, sealhulgas nende emotsioone ja reaktsioone. Selle põhjal võime mõista, et UX on mõõdupuu selle kohta, kas toode on kasulik või mitte. Kasutajakogemuse loomine hõlmab palju erinevaid aspekte, sealhulgas toote funktsionaalsust, kasutusmugavust, kasutajaliidese disaini, interaktsiooni disaini ja visuaalset identiteeti. Kui need elemendid on hästi tasakaalus, saab tõhusa kasutajakogemuse luua.

Kasutajaliidese disain

Kasutajaliidese disain (UI) on UX disaini oluline osa. See hõlmab kõike, mida kasutaja toote kasutamisel visuaalselt näeb. Kasutajaliides peab olema lihtne, arusaadav ja hõlpsasti navigeeritav. See hõlmab ikoonide, nuppude, menüüde, lehtede ja muude kasutajaliidese elementide kujundamist. Kõik need elemendid on olulised selleks, et kasutajad saaksid oma eesmärke toote kasutamisel kiiresti ja tõhusalt saavutada.

Kasutajamugavus

Kasutajamugavus on ka oluline element UX disaini loomisel. See hõlmab kõike, mis aitab kasutajatel toodet lihtsalt ja tõhusalt kasutada. Näiteks peab toode olema hästi organiseeritud, et kasutajad saaksid lihtsalt leida ja kasutada funktsioone, mida nad vajavad. Samuti peaks toode olema tundlik ja reageerima kasutaja toimingutele kiiresti.

Interaktsiooni disain

Interaktsiooni disain on UX disaini oluline element, mis hõlmab kõiki toote interaktiivseid aspekte. See hõlmab kõike, mis aitab kasutajatel toodet kasutada, sealhulgas navigeerimist, sammu täitmist ja funktsioonide kasutamist. Interaktsioon peab olema vägagi läbi mõeldud ja palju testitud.