Digitaalisen ekosysteemin modernisointi

Levi on Lapin upeiden kohteiden joukossa poikkeuksellisen moniulotteinen alueen pitkäjänteisen kehittämisen ja kestävän kasvun ansiosta. Paikallinen palveluelinkeino on rakentunut pitkälti matkailun ympärille. Digitaaliset kanavat ja palvelut ovat tärkeässä asemassa niin viestinnän, myynnin kuin asiakaskokemuksenkin kannalta.

Visit Levin tehtävänä on tukea alueen elinkeinoelämää ja matkailua. Yhtenä keskeisenä kehityksen osa-alueena on alueen digitaalinen ekosysteemi ja sen näkyvä julkisivu levi.fi. Visit Levi aloitti talvella 2021 palvelumuotoiluprojektin silloisen sivuston ja digiasioinnin pullonkaulojen tunnistamiseksi. Tämän jälkeen vuorossa oli palvelumuotoilun vision toimeenpano, johon työhön kumppaniksi valikoitui HiQ.

Lähtökohtana ylätason visio

Palvelumuotoiluhankkeen ansiosta Visit Leville syntyi vahva visio vierailijoiden toiveista ja tarpeista sekä digitaalisten palveluiden kehitystarpeista yleisellä tasolla. Hankkeessa oli myös tunnistettu joukko teknisiä pullonkauloja ja tehty päätös modernisoida verkkosivuston ylläpitoratkaisua ja taustapalveluita mahdollisuuksien mukaan.

Projektin päämääräksi muotoutui kokonaisvaltainen tasonnosto arkkitehtuurin, integraatioiden, käyttökokemuksen ja verkko-ostamisen helppouden osalta. Tämä muodosti herkullisen lähtökohdan: lähes kaiken vanhan saisi tarvittaessa räjäyttää uuden tieltä. Toisaalta samalla pitäisi toimia annettujen raamien puitteissa ja hyödyntää vanhasta mitä hyödynnettävissä olisi. Myös aikataulutavoite oli kunnianhimoinen – Levin talvisesonki aukeaa ensimmäisten Lapin matkailukohteiden joukossa.

Pragmaattisesti kohti käytännön toteutusta

Vaikka palvelumuotoiluhanke oli tuottanut vahvan vision, oli se muodostettu murehtimatta nykyjärjestelmien rajoitteista ja realiteeteista. Visio oli siis vielä varsin kaukana toteutusvalmiista suunnitelmasta.

Aloitimme työn panostamalla syvällisesti käyttöliittymän ja teknisen ratkaisun suunnitteluun. Työssä punnittiin myös toteuttamisen realiteetteja. Vaihe edellytti kokonaisvaltaista näkemyksellisyyttä digitaalisesta palvelukehityksestä ja kylmäpäisyyttä tavoitteiden asetannassa. Suunnittelu oli myös tasapainoilua käytännön toteutettavuuteen tähtäävien rajausten ja toisaalta palvelumuotoiluhankkeessa asetettujen brändillisten ja käyttökokemuksellisten tavoitteiden välillä. Sama päti myös teknisen arkkitehtuurin suunnittelussa, jossa punnittiin huolellisesti annetun vision vaatimukset ja nykyisten taustapalveluiden vahvuudet ja heikkoudet suhteessa niihin.

Tasapainoisen ratkaisun löytäminen designin, teknologian ja monitahoisen asiakkaan tarpeisiin edellytti useita työpajoja, tiivistä yhteistyötä ja kattavaa dokumentointia. Suunnitteluvaiheen lopputulemana syntyi yksityiskohtaiset, eri päätelaitteet huomioivat designit, eri tarkasti rajattujen käyttötapausten kuvaukset, tekninen arkkitehtuurisuunnitelma prototyyppeineen sekä selkeät raamit projektille.

Moderni tekninen ratkaisu

Arkkitehtuuri ja tekninen toteutus rakennettiin asiakkaan toivetta kunnioittaen headless-mallin mukaisesti palasista, jotka olivat meille aiemmista toimituksista jo tuttuja. Teknisen ratkaisun ydin muodostui vahvasti tyypitetystä React-pohjaisesta käyttöliittymäkerroksesta, Contentful-pilvisisältöhallintapalvelusta ja Gatsby-aluskirjastosta, joka toimii liimana sisältölähteiden ja käyttöliittymäkerroksen välissä.

Kokonaisuuden muita elementtejä ovat esimerkiksi:

• AWS Lambda-funktioilla toteutettu majoitus- ja kohdetietojen datapumppaus Levin käyttämästä ulkoisesta järjestelmästä

• Edellämainitun hakuindeksin välimuistina toimiva dokumenttitietokanta

• Levin hiihtokeskuksen reaaliaikaisesti tietoja tarjoilevat Frends-integraatiot

• SaaS-pohjainen hakupalvelu, jota käytetään sivuston perussisällön indeksointiin ja sivuston sisäiseen hakutoimintoon

• Versiohallinta sovelluksen React-projektin kehityksen hallinnointiin

• Edelliseen liitetty pilvessä ajettava sisällönjulkaisuputki

• Sivuston staattisten tiedostojen jakelu käyttäjiä ja hakukoneita varten sekä erikseen sisällönhallinnan esikatselua varten

Sisältömuutosten yhteydessä käynnistyy sisällön julkaisuprosessi, jossa eri sisältölähteiden sisältövirrat sovitetaan yhtenäistetyksi tietorakenteeksi, josta sisältö noudetaan graphql-kutsuilla käyttöliittymän muuttuneiden sivujen teksteiksi, kuviksi ja dataksi, jotka vuorostaan päivitetään staattisiksi sivuiksi kyseessä olevaan ympäristöön. Selaimen ja hakukoneiden näkökulmasta sivuston sivut näyttäytyvät yksinkertaisina semanttisesti jäsenneltyinä HTML-sivuina sisältöineen ja tyyleineen, joten ne latautuvat nopeasti ja indeksoituvat sellaisinaan. Ensilatauksen jälkeen selainkäyttöliittymä ”rehydroidaan” ja sivusto saa täyden React-selainsovelluksen toiminnallisuudet.

Tekninen arkkitehtuuri oli luonteeltaan skaalautuva ja salliva ja mahdollisti sen, että niin taustalla toimivissa tukipalveluissa kuin selaintoteutuksessakin voitiin tehdä tavoitteiden kannalta tinkimättömiä valintoja. Esimerkiksi sivuston latausajat ovat erittäin nopeat. Majoitusten ja palveluiden suodatukset ja sivuston sisäinen haku pakotettiin toimimaan sekunnin murto-osien vasteajalla. Sisällön hakukonekattavuus on erinomainen ja kattaa myös ulkoisissa järjestelmissä hallinnoitavat sisällöt majoituksia myöten.

Ilahduin suuresti siitä, että saimme valveutuneen, ennakkoluulottoman ja samanhenkisen asiakkaan, joka meidän tavoin piti käyttökokemusta, laatua ja aikaansaamista suuressa arvossa. He olivat vieläpä tehneet palvelumuotoilun kotiläksyt etukäteen. Pääsimme nopeasti keskustelemaan oikeista asioista ja vyöryttämään ratkaisua kohti sivuston talvista lanseerausta. Oma lemmikkini on majoitushaku, josta tuli tuli nopea ja rapsakka. Inhoan odottelua ja hitautta, joten miksi en tykkäisi?

HiQ:n digituottaja

Mikko Sairio

Pyörää ei tarvinnut keksiä uudelleen. Itse asiassa;

• Ratkaisu on HiQ referenssiarkkitehtuurin kaltainen

• React on HiQ:n Frontend-kehityksen avainkompetenssialue

• Gatsby-teknologia ja -pilvipalvelu ovat yksi HiQ:n suosimista ratkaisuista suuren näkyvyyden ja massiivisen käyttäjäkuorman sivustoille

• Contentful on tunnistettu monissa aiemmissa projekteissamme hyväksi, räätälöitäväksi ja skaalautuvaksi pilvipohjaiseksi sisältöalustaksi, ja lisäksi HiQ-perheen jäsen Lamia on Contentfulin hopea-tason kumppani

Sivutuotteena avaisimme ovia tuleville teknisille parannuksille aiempaa modulaarisemman arkkitehtuurin myötä.

Työ kiittää tekijäänsä, tekijät asiakasta

Yhteistyö Visit Levin ja HiQ:n välillä oli intensiivistä ja poikkeuksellisen avointa. Vahva projektiohjaus ja jatkuva dialogi pitivät huolen siitä, että asiat etenivät rivakasti ja osapuolilla oli selkeä näkyvyys kulloiseenkin tilanteeseen ja valintoihin. Myös asiakas heittäytyi hankkeeseen intohimolla ja ammattimaisella otteella, ja piti huolen siitä, että Levin osapuolet tulivat kuulluiksi ja heidän tarpeensa huomioiduksi tarpeen mukaan räätälöidyillä näkymillä, komponenteilla ja integraatioilla.

Sivuston kävijämäärät nousivat huomattavasti ja palaute on ollut erittäin positiivista. Jatkuva kehitys ja saumaton yhteistyö HiQ:n kanssa on toiminut erittäin hyvin. Vaikka hanke oli haastava, suoriutui HiQ siitä ammattitaitoisesti ja meidän erityisetkin toiveet kuunnelleen ja toteuttaen.

Project Lead, Visit Levi

Tiina Kostiainen

Haastava projekti valmistui hiukan tavoiteaikataulusta myöhässä; toisaalta lopputulos vastasi matkan varrella kirkastuneita tarpeita, onnistui hyödyntämään olemassa olevaa ja luomaan uutta tasapainoisesti ja tehokkaasti. Alkutalven 2021 lanseerauksen myötä Levin digitaalisen ekosysteemin näkyvä osa osoitteessa levi.fi on palvellut matkailijoita ja alueen liike-elämään tasaisen varmasti sivuston massiivista kävijämääristä riippumatta.

Projektin myötä:

• Käyttöliittymä palvelee erinomaisesti käyttäjiä näyttökoista ja laitteista riippumatta

• Sivuston latausajat ovat erittäin nopeat

• Majoitusten ja palveluiden suodatukset ja sivuston sisäinen haku toimivat sekunnin murto-osien vasteajalla

• Hakukoneindeksoitavuus on viritetty huippuunsa arkkitehtuuritasolta lähtien aina semanttisesti oikein jäsenneltyyn sisältöön asti

• Sisällön hakukonekattavuus on erinomainen sisältäen myös ulkoisissa järjestelmissä hallinnoitavat sisällöt majoituksia myöten

• Sivuston ylläpito on selkiytynyt entisestä ja nopeuttanut Visit Levin ja muiden perussisältöä ylläpitävien tahojen taakkaa

• Alueen muut palveluntarjoajat saavat edelleen käyttää samoja tuttuja työkaluja kuin aiemminkin oman sisältönsä ylläpitoon ja esillepanoon levi.fi:n sateenvarjon alla

• Arkkitehtuuri on avannut ovia tuleville teknisille parannuksille ja palvelun laajennuksille

Lisäksi palaute kentältä on ollut positiivista, sivuilla vietetty aika sisällön parissa ja erityisesti ostopolulle vievien sessioiden määrä ovat kehittyneet suotuisasti.

Palvelu on HiQ:n jatkuvan tuen piirissä verkkopalvelun ylläpitoon sovitetulla palvelupaketilla.