TE-Toimisto (epävirallinen)

Roolini:
UX/UI suunnittelu

#01 - Projektin alku

(Huom! Tämä on epävirallinen uudistuskonsepti eikä TE-toimisto ole ollut osallisena. Tämän projektin tarkoituksena on demonstroida näkemyksiäni miten sivustoa pystyisi uudistamaan sekä taitojani ja ajatuksiani UX/UI suunnittelijana. Konseptin tarkoituksena ei ole myöskään vähätellä ihmisiä ja työryhmiä, jotka ovat työstäneet nykyisen TE-toimiston verkkosivun.)

TE-toimisto on valtion organisaatio jonka palvelut ovat välttämättömiä lähes jokaiselle suomen kansalaiselle. Välttämättömän valtion palvelun on minun näkökulmastani oltava käyttäjälle mahdollisimman helppo ja vaivaton käyttää, ja sen on pysyttävä ajassa mukana. En koe, että nykyiset TE-toimiston sivut täyttävät nämä kriteerit, jonka takia halusin lähteä luonnostelemaan ja päivittämään TE-toimiston sivujen rakennetta ja ulkoasua.

#02 - Tavoitteet

TE-toimisto palvelee kahta kohderyhmää; työnhakijoita sekä työnantajia ja yrittäjiä. Työnhakijoita organisaatio palvelee hoitamalla työttömien työnhakijoiden sosiaalisia etuja, auttamalla työpaikan saamisessa ja järjestämällä neuvontaa koulutuksesta. Työnhakija käyttää sivuston verkkoasiointia, jossa hän pystyy hoitamaan omia työnhaku tietojaan ja pysymään ajan tasalla työnhakunsa tilanteesta.  Työnantajia ja yrittäjiä organisaatio palvelee antamalla mahdollisuuden lisätä työpaikkoja TE-toimiston sivuille sekä auttamalla aloittelevia yrittäjiä mm. starttirahan muodossa. TE-toimisto toimii myös tietopankkina molemmille kohderyhmille.

Tutkittuani sivustoa ja sieltä löytyvää tietoa, huomasin, että tietoa löytyy yllin kyllin, mutta sivuston ulkoasu ja rakenne ovat melko vanhentuneet. Sivuston sisällöltä puuttuu selkeä hierarkia, jonka takia käyttäjän huomio pomppii sinne sun tänne. Sivuston muotokieli on jokseenkin hajanainen ja sieltä löytyy paljon erivärisiä ja muotoisia linkkejä, ja kaikki sisältö on ahdettu hyvin lähelle toisiaan. Kaikki nämä seikat tekevät sivustosta hankalan navigoida ja kankean käyttää.

Tutkimustyön päätteeksi tavoitteeni olivat selvät. Sivuston rakennetta oli selkeytettävä huomattavasti luomalla sivuille selkeän hierarkian ja erottelemalla osiot omiin lokeroihinsa. Tärkeimpiä ominaisuuksia tulisi korostaa ja vähemmän tärkeät osiot jätettävä pienemmälle huomiolle. Sivuston ulkoasu kaipasi myös päivittämistä nykyaikaan ja muotokieli yhdenmukaistamista. TE-toimiston asiakkaina on ihmisiä laidasta laitaan, joten on tärkeää että sivustoa pystyy käyttämään mahdollisimman moni ihminen, esteettömästi.

(Huomautan, että koska kyseessä on vain epävirallinen projekti, jota ei ole tarkoitus käytännössä toteuttaa, minulla ei ollut mahdollisuutta kerätä tai analysoida käyttäjädataa eikä testata sivustoa. Tämä uudistus on suunniteltu täysin minun näkökulmastani TE-toimiston palvelujen käyttäjänä ja asiakkaana, työttömänä työnhakijana ja ymmärrän, että vain minun näkökulmani ei edusta laajempaa käyttäjäkuntaa. Tämä vuoksi en esimerkiksi päässyt tutkimaan työnantajan ja yrittäjän verkkoasiointipalvelua. Aidossa projektissa ehdottomasti sisällyttäisin käyttäjätutkimuksen ja testauksen.)

#03 - Suunnittelu

Sivuston ulkoasu on saanut modernin muodonmuutoksen jonka päävärinä on valkoinen, ja sen tukiväreinä toimivat TE-toimiston klassinen vihreä ja musta.

Etusivun rakenne on laitettu täysin uusiksi ja sille on luotu voimakas hierarkia.  TE-toimiston yksi päätarkoituksista on auttaa työnhakijoita työpaikan saamisessa. Tämän vuoksi etusivulla tulee heti vastaan hakukenttä, josta pääsee etsimään työpaikkoja. Tämän vieressä on toinen tärkeä call-to-action osio, nimittäin verkkoasiointiin kirjautuminen. Tästä niin työnhakija kuin työnantaja ja yrittäjä pääsee kirjautumaan TE-toimiston verkkoasiointiin, joka on yksi TE-toimiston tärkeimmistä verkkopalveluista.

Call-to-actioneiden alta löytyvät tärkeimmät ja hyödyllisimmät nostot työnhakijoille sekä työnantajille ja yrityksille. Nämä löytyvät myös vanhoilta sivuilta, mutta siellä en itse heti edes tajunnut, että listatut tekstit ovat klikattavia linkkejä. Nämä linkit on muutettu laatikko- ja nappimuotoon, ja ne on jaettu omiin osioihinsa asiakasryhmän mukaan. Laatikkonostojen alta löytyy “suosittua nyt” osio, johon TE-toimisto voi listata suosituimmat sivut ja muita yleishyödyllisiä linkkejä mm. COVID-19 liittyen.

Etusivulta löytyy myös “ajankohtaista” uutisosio sekä “tapahtumakalenteri”.

Sivuston headeria on pienennetty huomattavasti ja se on päivitetty vastaamaan nykypäivän kapeaa header desiagnia. Mobiiliversiossa valkoisesta palkista löytyvät ominaisuudet on siirretty ja kiinnitetty ikkunan alalaitaan. Näin tärkeät ominaisuudet ovat käyttäjän ulottuvissa kaiken aikaa. Navigaatio löytyy klassisen hampurilaisvalikon alta, sillä nämä ovat prioriteeteiltään toissijaisia.

 

Uudistettu kirjautumisportaali ja asiointipalvelun esittely.

Oma asiointipalveluprofiili on hyötynyt uudistuksesta eniten. Verkkoasioinnin tehtävänä on antaa työhakijalle työkalut työnhakutietojensa päivittämiseen, pitää asiakas ajan tasalla oman työnhaun voimassaolosta, avoimista asioista ja tehtävistä sekä niiden aikarajoista. Kaikki nämä tiedot kyllä löytyvät vanhasta sivustosta, mutta ne jäävät hierarkian puutteen vuoksi hyvin helposti huomaamatta. Tähän olen tehnyt korjauksia ja varmistanut, että käyttäjältä ei jää mitään tärkeää huomaamatta. Verkkoasioinnissa työnhakija pääsee myös käsiksi omiin työnhakutietoihinsa sekä yhteystietoihin.

Profiiliin tultaessa käyttäjälle tehdään heti selväksi hänen työnhakunsa voimassaolon tilanne. Jos siinä on jotain vikana tai työnhaku on päättymässä, käyttäjä huomaa sen saman tien ja pystyy ryhtymään toimiin tilanteen korjaamiseksi. Tällä sivulla asiakas pystyy tarkastelemaan omat avoimet asiat ja tehtävät, ja hänellä on myös tapahtumakalenteri. Tapahtumakalenteriin on merkitty kaikki avointen asioiden ja tehtävien deadlinet. Päivämäärää klikattaessa käyttäjälle ilmestyy lista kaikista suorittamattomista tehtävistä.

Palstalta löytyy myös hyödyllisiä linkkejä työnhakijalle, TE-toimiston ehdottamia työpaikkoja sekä tapahtumakalenteri.

Uudistetut sivupohjat asiointiin ja omiin työnhakutietoihin.

 

Omien yhteystietojen hallintasivu.

Yhteydenottosivu

Oman asioinnin ulkopuolella TE-toimistolta löytyy kattava tietopankki heidän asiakkailleen, jonka muotokieli ja rakenne kaipasivat selkeyttämistä ja yhdenmukaistamista.

Tarjotinpohja toimii ns. porttina muille alasivuille ja sitä käytetään mm. erottelemaan osioita toisistaan. Tämä sivu listaa automaattisesti sen alasivut laatikkoina.

Oletuspohja on pohja lähes kaikkea sisältöä varten. Tänne sopii niin lyhyet kuin pitkätkin tekstit. Sivupohjan valikkoa on helppo navigoida, sisältöä helppo lukea ja pohjalta löytyy myös aiheeseen sopivia linkkisuosituksia.

Hakutoiminto on minkä tahansa tietopankin yksi tärkeimmistä ominaisuuksista ja sen on toimittava hyvin, tarjoten selkeitä hakutuloksia käyttäjälle. Olen ratkaissut tämän niin, että hakukone kategorisoi sivut, artikkelit, dokumentit yms. erikseen. Tämä helpottaa hakuprosessia huomattavasti ja näin käyttäjä pystyy etsimään hakutuloksiaan tietystä kategoriasta, jos hän etsii esimerkiksi tiettyä PDF dokumenttiä.

 

Työhakusivu on kokenut melko suuren muodonmuutoksen. Olen suunniutellut työpöytäversion uuden rakenteen niin, että työpaikkojen selaaminen olisi käyttäjälle napakkaa ja helppoa, karsien kaikki turhat klikkaukset pois. Vanhalla sivulla yksi sivu oli varattu vain työpaikkojen listaukseen, ja työpaikkaa klikkaamalla käyttäjä viedään toiselle sivulle joka on varattu työpaikka ilmoitukseen. Koin tämän askeleen olevan turha ja työnhakua hidastava tekijä. Käyttäjän on joka kerta klikattava pois työpaikkalistauksesta nähdäkseen työpaikkailmoituksen, ja kun hän haluaa sinne palata on hänen klikattava pois työpaikkailmoituksesta. Tämä on näkökulmastani käyttäjäkokemusta heikentävä tekijä. Olen eliminoinut tämän ongelman sijoittamalla työpaikkalistan ja työpaikkailmoituksen samalle sivulle. Käyttäjän ei tarvitse kuin klikata kiinostavaa työpaikkaa ja työpaikkailmoitus ilmestyy heti viereen tarkasteltavaksi.

Työnhakusivun mobiiliversiossa tilanpuutteen vuoksi samanlaista vierekkäin asettelua ei ole voitu toteuttaa. Olen ratkaissut tämän niin, että työpaikka napauttaessa työpaikkalistaus liukuu piiloon ja työpaikkailmoitus liukuu toiselta puolelta esiin. Tämä tekee käyttäjäkokemuksesta mukavamman ja antaa käyttäjälle vaikutelman siitä, että työpaikkalista ja -ilmoitus ovat edelleen samalla sivulla, mutta toinen on vain piilossa näytön ulkopuolella.

#04 - Lopputulos

Lopputuloksena uskon, että olen onnistunut päivittämään TE-toimiston verkkosivut onnistuneesti nykypäivään ja korjaamaan havaitsemani ongelmat käyttäjäkokemuksessa ja ulkoasussa. Uusi TE-toimiston sivusto on moderni ja helppokäyttöinen palvelu joka toimii laitteella kuin laitteella ja palvelee käyttäjäkuntaansa.