Espanja.com

Yleiskatsaus

Espanja.com on tieto/uutissivusto suomalaisille, jotka ovat kiinnostuneita Espanjasta.

Sivuston ulkonäkö ja rakenne oli vanhentunut ja ne piti suunnitella täysin uudelleen.

Rooli

Toimin projektin ainoana UX-suunnittelijana.

Ajanjakso

2023 – 2024

Projektin tausta ja tavoitteet

Espanja.Comin nykyinen käyttöliittymä ja ulkonäkö olivat jääneet ajastaan jälkeen, mikä heijastui myös kävijöiden käyttäytymiseen, sillä analytiikka kertoi korkeasta välittömästä poistumisprosentista (yli 90 %) ja lyhyistä vierailuista (1 min), eli suurin osa käyttäjistä näki vain yhden sivun ennen poistumistaan. Tämän lisäksi, käyttäjiltä oli tullut palautetta, että sivustolla navigointi oli vaikeaa, mikä aiheutti erityisesti haasteita yli 45-vuotiaille kävijöille, jotka muodostavat merkittävän osan sivuston käyttäjistä (n. 80 %).

Päätavoitteet:

  • Päivittää sivuston visuaalinen ilme moderniksi ja houkuttelevaksi.
  • Parantaa käytettävyyttä mobiililaitteilla, joilla suurin osa käyttäjistä selaa sisältöä.
  • Selkeyttää navigointia ja käyttäjäpolkuja, jotta vierailijat löytävät lisäsisältöä vaivattomasti ja viettävät sivustolla pidemmän ajan.

Käyttäjätutkimus

Projektin alussa selvitin, keitä Espanja.Comin kävijät todella ovat ja millaisia haasteita he kohtaavat sivustolla. Käytin Google Analyticsia ja Espanja.Comin Facebook-ryhmää tunnistaakseni käyttäjäprofiileja ja käyttäytymismalleja.

Tärkeimmät löydökset olivat:

  • Suurin osa kävijöistä (n. 80%) oli yli 45-vuotiaita.
  • Useimmat vierailivat vain yhdellä sivulla ja poistuivat nopeasti (välitön poistumisprosentti 90 %).
  • Mobiilikäyttö oli merkittävässä roolissa, mutta mobiilikokemus oli heikko.
  • Moni koki sivuston sekavaksi ja vanhentuneeksi.

Näiden tietojen perusteella tunnistin sivuston suurimmat ongelmat:

  • Sivustolla ei ollut tarpeeksi selkeitä kävijäpolkuja, jotka olisivat kannustaneet käyttäjiä tutustumaan useampaan sisältöön.
  • Sivusto ei ollut visuaalisesti tarpeeksi houkutteleva ja navigointi oli sekavaa, erityisesti mobiililaitteilla.
  • Ulkoasu näytti vanhentuneelta, mikä voi heikentää käyttäjien luottamusta sivustoon.

Tietojen perusteella rakensin käyttäjäpersoonia, joiden avulla ohjasin suunnitteluratkaisuja:

Käyttäjäpersoonat:

Jari, 70 v: Jari on eläkkeellä oleva suomalainen diplomi-insinööri, joka on muuttanut pysyvästi Espanjaan vaimonsa kanssa. Hän on aktiivinen Facebookin suomalaisyhteisöissä ja käyttää internetiä pääasiassa tietokoneella, mutta yhä useammin myös tabletilla. Hänen digitaidot ovat kohtuulliset, mutta hän turhautuu nopeasti, jos sivusto ei toimi loogisesti tai linkit johtavat odottamattomiin paikkoihin.

Liisa, 55 vuotta: Suomalainen lähihoitaja, joka viettää lomia Espanjassa ja harkitsee muuttoa sinne. Hän on naimisissa ja hänellä on kaksi lasta. Hänen digitaidot ovat keskitasoa, joten hän tarvitsee sivuston, joka on selkeä ja johdonmukainen. Hän haluaa löytää helposti luotettavaa tietoa Espanjasta, ja häntä turhauttavat erityisesti sekavat ja monimutkaiset sivustot.

Kilpailija-analyysi

Ennen suunnitteluvaihetta tutkin Suomen johtavia kiinteistöpalveluita Etuovea ja Oikotietä sekä kansainvälistä James Editionia. Keskityin erityisesti mobiilikokemusten analysointiin, koska Espanja.comin käyttäjistä merkittävä osa selaa mobiililla.

Tärkein löydös: toimivissa palveluissa hakutulokset ja sisältö ovat pääosassa, ja filteröinti on piilotettu painikkeen taakse, jolloin näyttö ei täyty vaihtoehdoista. Huonosti toimivissa ratkaisuissa liian monta valintaa näkyy heti, mikä kuormittaa erityisesti vanhempaa käyttäjäkuntaa.

Tämä ohjasi suunnitteluratkaisujani: asunnot pääosaan ja filteröinti selkeänä kokonaisuutena painikkeen takana, mutta silti kattavana.

Ideointi ja suunnitteluvaihe

Ensimmäisessä vaiheessa luonnostelin käsin erilaisia ideoita, miltä etusivu ja uutiset voisivat näyttää. Tämä auttoi minua jäsentämään, miten sisältöä voisi ryhmitellä selkeästi ja visuaalisesti houkuttelevasti. Luonnostelin myös miltä yksittäiset uutiset, asunnot ja palvelut voisivat näyttää.

Suunnittelun aikana pohdin miten projektin päätavoitteisiin voitaisiin päästä ja ehdotin omistajille ratkaisuehdotuksia. Näiden pohjalta jatkoin suunnittelua.

Suunnitelmat pääongelmien ratkaisuun:

  • Visuaalinen ilme: Espanja.Comin ulkoasu suunnitellaan uudelleen säilyttäen kuitenkin Espanjaan yhdistettävä värimaailma (punainen ja keltainen), mutta hillitymmässä muodossa. Tavoitteena on luoda raikas ja nykyaikainen ilme, joka toimii erinomaisesti mobiilissa. Sivuston omistajien toiveesta eri sisältötyypit – uutiset, palvelut ja asunnot – erotellaan visuaalisesti toisistaan eri väreillä. Tämän toiveen pohjalta on erityisen tärkeää huolehtia siitä, että sivuston yleisilme säilyy yhtenäisenä ja tunnistettavana, eikä kokonaisuus vaikuta sekavalta. Ratkaisuna tähän käytetään korttimaista sisältörakennetta.
  • Korttimainen sisältötoteutus: Käytetään korttimaista tyyliä sisällöille, sillä se on selkeä ja mobiililaitteilla hyvin toimiva ratkaisu. Korttimaisissa sisältölohkoissa uutiset, asunnot ja palvelut erotellaan toisistaan selkeästi väreillä, ja niitä voi selailla vaivattomasti sekä pystysuunnassa että sivusuunnassa. Kortit ovat rakenteeltaan samankaltaiset, jolloin ulkonäkö on yhtenäinen. Tämä toteutus mahdollistaa myös sisällön helpon lisäämisen Espanja.Comin ylläpitäjille.
  • Navigoinnin selkeyttäminen: Koska suuri osa käyttäjistä on yli 45-vuotiaita, panostetaan erityisesti navigoinnin selkeyteen ja ymmärrettävyyteen. Painikkeissa käytetään yhdistelmää ikoneista ja teksteistä, mikä tekee toiminnoista helpommin tulkittavia. Leivänmurunavigointi lisättään sivun yläosaan tukemaan käyttäjän hahmotusta siitä, missä kohtaa sivustoa hän kulloinkin on, sekä helpottamaan siirtymistä edellisille sivuille.

Digitaaliset suunnitelmat

Kun olin tyytyväinen hahmotelmiin, siirsin ne digitaaliseen muotoon Figmassa, jolloin pystyin esittelemään suunnitelmia sivuston omistajille. Tein suunnitelmista erilaisia vaihtoehtoja, jotta sain palautetta mistä he pitivät eniten.

Ensimmäiseksi keskityin uudistamaan sivuston ulkonäköä ja erityisesti niiden sivujen ulkonäköä, joita käytetään eniten (Etusivu, uutiset). Vanhalla sivustolla, kun käyttäjä tulee sivustolle ensimmäinen visuaalinen vaikutelma ei ole paras, mikä voi vaikuttaa käyttäjien nopeaan poistumiseen sivustolta.

Uusi suunnitelma on visuaalisesti houkuttelevampi, sekä kertoo selvemmin mille sivulle käyttäjä saapuu.

Vanha etusivu

Uusi etusivu

Vanha uutiset-sivu

Uusi uutiset-sivu

Lisäksi suunnittelin erilaisia “uutiskortti” -malleja, joita voi testata käyttäjillä.

Prototyyppi ja käyttäjätestaus

Kun ensimmäinen prototyyppi sivustosta oli tehty valmiiksi Figmalla, suoritin käyttäjätestauksen Figman prototyypin ja Maze-sivuston avulla. Testauksen tavoitteena oli arvioida suunnitteluratkaisujen toimivuutta käytännössä, eli miten käyttäjät kokevat sivuston käytettävyyden ja visuaalisen ilmeen.

Testi suoritettiin virtuaalisesti itsenäisesti. Testiin osallistui 25 Espanja.comin käyttäjää. Halusin erityisesti testata suunnittelun toimivuutta yli 45-vuotiaiden käyttäjien näkökulmasta, sillä he muodostavat suuren osan sivuston kohdeyleisöstä.

Käyttäjiltä kysyttiin mielipidettä uuden sivuston ulkonäöstä ja sen käytettävyyttä testattiin antamalla käyttäjille konkreettisia tehtäviä kuten:

  • “Etsi Espanjasta vuokrattava asunto tietyltä alueelta.”
  • “Etsi sivustolta uutinen nimeltä “Paras uutinen”.
  • Miten arvioisit sivuston uutta ulkonäköä“.

Testauksen tulokset:

  • Käyttäjäpolut ja sivustolla liikkuminen: Testissä arvioitiin sitä, kuinka helposti käyttäjät pystyivät siirtymään sivuston eri osioihin ja löytämään haluamaansa sisältöä. Tehtävät liittyivät muun muassa uutisten lukemiseen, palvelujen etsimiseen ja takaisin etusivulle palaamiseen. Tulosten perusteella navigointi toimi odotetusti, ja käyttäjät kokivat rakenteen loogiseksi ja selkeäksi.
  • Visuaaliset muutokset: Käyttäjäiltä saatiin palautetta, että värien käyttöä voisi vähentää. Käyttäjäpalaute johti visuaalisiin muutoksiin, erityisesti värien vähentämiseen ja valkoisen tilan lisäämiseen, mikä toi ulkoasuun selkeyttä ja ilmavuutta

Analysoin suunnitelmia testitulosten perusteella ja päivitin prototyypin vastaamaan paremmin käyttäjien odotuksia. Käyttäjätestaus oli keskeisessä roolissa sen varmistamisessa, että suunnitteluratkaisut eivät perustu vain oletuksiin, vaan todelliseen käyttökokemukseen.

Suunnittelin uudet “kortit”, käyttäjäpalautteen perusteella, joissa vähemmän on värejä ja enemmän valkoista, joka tuo ilmavuutta ja on helpommin luettavaa.

Lopullinen ratkaisu

Sivuston ulkoasu muuttui täysin. Sivustosta tuli visuaalisempi ja sen käytettävyydestä selkeämpi sekä helpompi. Suunnitteluprosessi eteni asetettujen tavoitteiden mukaisesti ja lopputulos vastaa käyttäjätutkimuksessa tunnistettuja tarpeita.

Projektin tavoitteena oli:

  • Päivittää sivuston visuaalinen ilme moderniksi ja houkuttelevaksi.
  • Parantaa käytettävyyttä mobiililaitteilla, joilla suurin osa käyttäjistä selaa sisältöä.
  • Selkeyttää navigointia ja käyttäjäpolkuja, jotta vierailijat löytävät lisäsisältöä vaivattomasti ja viettävät sivustolla pidemmän ajan.

Sivuston ulkonäön päivitys

Sivusto on moderni ja vanhan sivuston ulkonäöllinen sekavuus on poissa.

Helpompi käytettävyys mobiililla

Leivänmurut, tutut ikonit ja selkeät painikkeet auttavat käyttäjiä navigoimaan sivustolla, mikä vähentää käyttäjän tarvetta poistua sivustolta etsimään tietoa muualta.

Navigointi ja suositukset

Sivuston välitön poistumisprosentti on erittäin korkea, jota varten esimerkiksi uutisten loppuun lisättiin suosituksia.

Sivuston päävalikko tehtiin myös uusiksi mikä parantaa navigointia.

Tulokset ja ennusteet

Vaikka Espanja.Comin uusi sivusto ei ole vielä julkaistu, odotan seuraavia parannuksia ja vaikutuksia:

  • Pidempi sivustolla vietetty aika: Sisältösuositukset, kuten uutisten yhteydessä näkyvät lisäuutiset, tarjoavat käyttäjille suoria ehdotuksia jatkaa sivuston selailua, mikä todennäköisesti lisää sivustolla vietettyä aikaa.
  • Selkeämpi navigointi: Leivänmurut, tutut ikonit ja selkeät painikkeet auttavat käyttäjiä navigoimaan sivustolla, mikä vähentää käyttäjän tarvetta poistua sivustolta etsimään tietoa muualta.
  • Parantunut visuaalinen ilme ja houkuttelevuus: Uudistettu värimaailma ja korttimainen sisältö lisäävät sivun uskottavuutta ja houkuttelevat erityisesti mobiilikäyttäjiä, jotka muodostavat suurimman osan sivuston kävijöistä.

Jatkotoimenpiteet

Projektin julkaisun jälkeen Espanja.Comin kehitystä on tarkoitus jatkaa aktiivisesti. Sivuston analytiikkaa seurataan säännöllisesti, erityisesti mittareita, kuten:

  • Sivustolla vietetty aika ja istuntokohtaiset sivukatselut: Nämä osoittavat, onko sisältöön sitoutuminen parantunut.
  • Käyttäjäpalautteen kerääminen: Käyttäjiltä tullaan keräämään palautetta, jotta voidaan arvioida uudistusten onnistumista ja kehittää sivustoa jatkossakin käyttäjien tarpeiden mukaisesti.

Päätavoitteena on varmistaa, että Espanja.Comin sivusto kehittyy jatkuvasti ja mukautuu käyttäjäkunnan tarpeisiin.

Reflektio ja opit

Espanja.Com oli ensimmäinen laajempi suunnitteluprojekti, josta olin kokonaisuudessaan yksin vastuussa. Kokemus opetti paljon siitä, mitä kaikkea käyttöliittymä- ja käyttäjäkokemussuunnittelu sisältää käytännön tasolla, etenkin silloin, kun mukana on useita eri sidosryhmiä ja budjetti on rajallinen.

Sain arvokasta kokemusta yhteistyöstä sivuston omistajien ja teknisestä toteutuksesta vastaavan koodarin kanssa. Opin, kuinka tärkeää on viestiä selkeästi, kuunnella eri näkökulmia ja varmistaa, että kaikki osapuolet ymmärtävät projektin tavoitteet samalla tavalla. Lisäksi projekti vahvisti ymmärrystäni siitä, kuinka tärkeää on löytää luovia, kevyitä ratkaisuja silloin, kun resursseja ei ole paljon käytettävissä.

Mitä tekisin seuraavalla kerralla toisin

  • Mustavalkoiset rautalankamallit ennen visuaalista suunnittelua
    Tässä projektissa siirryin värillisiin malleihin liian aikaisin, mikä vei liikaa aikaa ja energiaa. Jatkossa tekisin ensin digitaaliset, mustavalkoiset rautalankamallit, joiden avulla rakenteen ja käyttäjäpolkujen toimivuutta voi testata ja korjata aikaisessa vaiheessa – ennen visuaalisten yksityiskohtien hiomista.
  • Palaverimuistioiden hyödyntäminen
    Olisin voinut dokumentoida palavereja järjestelmällisemmin. Koska tämä oli ensimmäinen isompi uudistusprojekti myös sivuston omistajille, asioihin jouduttiin palaamaan useampaan kertaan. Selkeät muistiot olisivat auttaneet pitämään projektin paremmin aikataulussa ja tehostaneet viestintää.

Kohti jatkuvaa kehitystä

Tämän projektin päätavoitteena oli tehdä Espanja.Comista selkeämpi ja käyttäjäystävällisempi – mutta samalla luoda pohja, jota voidaan jatkossa kehittää edelleen käyttäjien tarpeiden mukaan. Projekti antoi minulle vahvan käytännön kokemuksen suunnittelun koko prosessista ja vahvisti haluani kehittää itseäni UX-suunnittelijana entistäkin tavoitteellisemmin.