Lukuaika 5 min

Designia odottamattomiin paikkoihin

Case Oppex: julkisista hankinnoista seksikkäitä.

Julkisilla hankinnoilla tarkoitetaan tavaroiden ja palveluiden hankintaa julkisen toimijan puolesta, esimerkiksi valtion viraston. Kuulostaako tylsältä ja työläältä? Useimmiten se voi ollakin, mutta niin ei tarvitse olla. Kiinnostavaa on, että julkinen sektori ostaa kaikkea koripallokentistä miekkoihin – ja niistäkin järjestetään omat hankintansa.

Tulkoon valo

Monet kuluttajille suunnatut digipalvelut ovat tuottaneet käyttäjäystävällisiä digituotteita designvetoisesti, mutta osa b2b-palveluista laahaa perässä. Design thinkingin välttelyyn on keksitty monenlaisia tekosyitä:

  • Käyttäjät tarvitsevat vain tietoa työnsä tekemiseen, eivät designia.
  • Näitä palveluita käytetään vain pöytäkoneella.
  • Palvelun ei tarvitse näyttää hyvältä, sen käyttäminen on jonkun työtä.
  • Tämä ei ole seksikästä bisnestä.

Aivan samoja perusteluja on käytetty kulutuselektroniikasta, vaikkapa tietokoneista. Olisi ollut melkoisen rohkea väite 1960-luvulla, että teollinen muotoilu olisi joskus tietokoneiden tärkeä myyntivaltti.

Palvelun tarkoituksesta tai toimialasta riippumatta ihmiset käyttävät sitä. Siksi samat designperiaatteet pätevät myös b2b-palveluihin, vaikka kyse olisi julkisten hankintojen hakukoneista. Kyse on vain siitä, kuka haluaa suunnitella parhaan palvelun juuri sille toimialalle.

Lähtötilanne

Syyskuussa 2015 aloitimme oppex.comin uudistuksen monitaitoisen tiimin kanssa, jossa oli markkinoijia, kehittäjiä ja suunnittelijoita. Oppex on maailman suurin julkisten hankintailmoitusten hakukone, joka kattaa yli 1,5 miljoonaa ilmoitusta vuodessa.

Sivusto oli jo julkaistu, mutta se kaipasi uudistusta: visuaalinen ilme oli sekava, mobiilioptimointi vaati parannusta ja käyttäjät pyysivät jatkuvasti toimintoja, jotka olivat jo käyttöliittymässä – he eivät vain löytäneet niitä.

Vanha Oppex
oppex.comin vanha etusivu

Alkuperäiset tavoitteet olivat:

  • uudistaa hakukäyttöliittymä ja tehdä siitä visuaalisesti houkutteleva
  • parantaa mobiilikäytettävyyttä
  • tehdä hausta käyttäjäystävällisempi ja tarkennetuista hakusuodattimista helpommin löydettäviä
  • uudistaa koko teknologiapino, jotta uudet toiminnot (kuten pikahaku) tulisivat mahdollisiksi ja kehityssyklit nopeutuisivat
  • tuoda design odottamattomaan paikkaan – toimialalle, jossa designin taso oli paljon matalampi kuin edistyksellisissä b2c-palveluissa

Vaikutusta sisältä käsin

Minut palkattiin talon omaksi Lead Designeriksi – tämä oli innostavaa, koska se takasi ylellisyyden tehdä pitkän aikavälin designpäätöksiä, suunnitella perusteellisesti ja viestiä suoraan muiden tiimiläisten kanssa. Vaikka verkkotuotteiden tekemisen työkalut ovat parantuneet, myös vaatimukset ovat kasvaneet, ja palveluiden suunnittelu ja koodaaminen on monimutkaistunut, koska käyttäjiä pitää palvella eri alustoilla ja laitteilla. Erinomaiset verkkotuotteet vaativat aina sen ylimääräisen panostuksen designin yksityiskohtiin ja testaukseen, ja huippuluokan työn tekeminen oli käynyt todella vaikeaksi digitoimistossa tai tilapäisenä palkkasoturina. Kaukana ovat ne ajat, jolloin designtoimisto pudotti kehittäjille yhden kaikille sopivan desktop-käyttöliittymän toteutettavaksi.

Pienin askelin

Ensimmäinen askel oli muuttaa koko tiimin designidentiteetti – kyse ei ollut enää ”niistä firmoista, joilla on designia”, vaan me pystyimme samaan. Ja vielä paremmin. Tänään. Avain oli ymmärtää yhdessä, ettei designilla ole rajoja – toimialasta riippumatta. Kyse on pikemminkin päätöksestä: priorisoidaanko designia oikeasti vai ei. Lisätäkseni designtietoisuutta vedin vapaaehtoisia designtyöpajoja kaikille työntekijöille. Paras tapa oppia ja ymmärtää designia on kokeilla sitä itse… ja pitää samalla vähän hauskaa. Uskon, että työpajojen tärkein oivallus oli, että design on työtä ja paranee, kun siihen käyttää enemmän tunteja.

Toinen askel oli tehdä designista mahdollisimman läpinäkyvää – jaoin keskeneräisiä mockupeja jatkuvasti Slackissa, kysyin mielipiteitä kaikilta (en vain niiltä, jotka työskentelivät suoraan ominaisuuden parissa) ja kannustin kehittäjiä ja tuotepäälliköitä tekemään omia luonnoksiaan ja rautalankamallejaan. Designiin on paljon helpompi reagoida ja antaa palautetta, kun on mukana prosessissa alusta asti ja ymmärtää ongelmakentän paremmin. Kolmas ja haastavin askel oli designprosessin luominen. Eli mahdollisimman sujuvan työnkulun keksiminen tuotepäälliköiden, suunnittelijoiden ja kehittäjien välille, jotta laadukas tuote valmistuisi ajallaan. Aiheesta löytyy verkosta paljon neuvoja ja blogikirjoituksia, mutta niiden toteuttaminen organisaatiossa, johon on juuri tullut, on aivan eri asia. Onneksi meitä ei painanut ”näin on aina tehty” -taakka, koska tiimimme oli melko nuori ja siinä oli useita uusia työntekijöitä. Lisäksi perustajat tukivat ja kannustivat meitä käyttämään parhaita ja uusimpia työtapoja, olipa kyse työkaluista tai työnkulusta.

Tiimien yhdistäminen

Designin yhdistäminen tuotetiimiin oli suhteellisen helppoa. UX:n kannalta tilanne oli designille erittäin hyvä: tuotetiimi keräsi paljon dataa käyttäjien käyttäytymisestä ja kävi jatkuvaa keskustelua asiakkaiden kanssa. Dialogi syveni entisestään, kun teimme viikon mittaisen kenttämatkan päämarkkinallemme Isoon-Britanniaan haastattelemaan käyttäjiä heidän julkisiin hankintoihin liittyvistä tarpeistaan. Avain oli tuotetiimin, asiakkaiden ja designtiimin välinen dialogi sekä kunkin ryhmän prioriteettien ja huolien ymmärtäminen. Suurin haaste oli saada designresurssit vastaamaan bisnestiimin energiaa.

Designin ja teknologian yhdistämisen odotettiin olevan hankalampaa. Koska minulla oli kokemusta sekä frontend-kehityksestä että designista, minulla oli monta keinoa kuroa umpeen designin ja kehityksen välistä kuilua. Kun design on mockup- tai konseptitasolla, työkaluilla ei juuri ole väliä. Kun ohjelmistokehitys alkaa, kuilun kurominen umpeen on välttämätöntä.

Ensin toimitin Illustrator-tiedostoja ja yritin opettaa kehittäjät toteuttamaan niiden pohjalta designin ensimmäiset kierrokset. Tämä ei toiminut lainkaan. Vaikka designit eivät olleet kovin monimutkaisia ja interaktiot oli helppo selittää, kehitystiimi ei vain tuntenut oloaan kotoisaksi Illustratorin maailmassa. Toiseksi lisäsin työnkulkuun korkean tason HTML-prototyypit. Laatu parani hieman, ja interaktiot oli nyt selitetty selkeästi prototyypissä. Silti toiminnot siirtyivät kehitysympäristöön hitaasti, eikä niitä toteutettu oikein. Se sai minut miettimään: samalla kun käydään jatkuvaa keskustelua siitä, pitäisikö suunnittelijoiden opetella koodaamaan, voisi olla parempi idea parantaa tiimien välistä viestintää, opettaa kehittäjille designperiaatteita tai suunnittelijoille liiketoimintaa, jotta tiimi suunnittelisi heti alussa oikeat asiat, jos toteutus on joka tapauksessa tuskallinen.

Vaikka suunnittelijalla olisi yksisarvisen ominaisuuksia, se ei tarkoita, että designin ja kehityksen välinen kuilu olisi kurottu umpeen ja kaikki ongelmat ratkaistu. Se tarkoittaa vain, että suunnittelija viettää enemmän aikaa koodieditorissa eikä juttele asiakkaiden kanssa. Tämä voi johtaa tilanteeseen, jossa kehitetään vääriä asioita ja aikaa haaskataan. Monipuolinen suunnittelija voi myös luoda upouusia ongelmia, joiden olemassaolosta ei edes tiennyt.

Sen sijaan tiimien välistä viestintää pitäisi lisätä. Ja kyllä, kehittäjät voivat tehdä vähän designia, suunnittelijat vähän koodia ja tuotepäälliköt vähän designia. Mutta ensisijaisesti ihmisten pitäisi tehdä asioita, joissa he loistavat.

Kolmanneksi teimme tiiminä ainoan oikean valinnan – lisäsimme designin ja kehityksen välistä viestintää, kävimme kipupisteet läpi ja ryhdyimme töihin. Tämä tarkoitti, että loimme yhdessä elävän, modulaarisen tyylioppaan, sovimme gridistä, teimme suunnittelijoille React-hiekkalaatikon, jottei käyttöliittymää tarvinnut koodata kahteen kertaan, ja istuimme vierekkäin, kun teimme design- ja kehityspäätöksiä. Kuka tahansa, joka osasi tehdä tehtävän, teki sen käyntikortin tittelistä riippumatta. Tätä parannettiin viikko viikolta, ja tiimiin juuri liittynyt kokenut scrum master vauhditti menoa entisestään.

Design on työtä monella eri tavalla.

Iterointia, iterointia…

Kun ensimmäinen kehitysversio oli pystyssä, alkoivat iterointikierrokset, jotka tekivät sovelluksesta joka viikko paremman. Verkkosovelluksen mobiiliystävällisyys vaikuttaa paljon koko kehitys- ja designprosessiin. Vaikka mobiilikäyttöä pidetään nykyään itsestäänselvyytenä, meidän tapauksessamme 80 % liikenteestä tuli pöytäkoneilta, eikä syyttä.

Tyypillinen käyttäjä selasi ilmoituksia toimistolla työaikana. Käyttäjät kuitenkin tulevat palveluun eri laitteilta lukiessaan sähköpostihälytyksiä, SEO suosii mobiilia, ja markkinoinnin kannalta on tärkeää, että sivusto on saavutettavissa käyttötilanteesta riippumatta. Päätimme, että palvelua pitää voida esitellä, vaikka esittelijä olisi satunnainen kaveri baarissa kännykkä kädessä.

Verkkosovelluksen saaminen näyttämään mobiiliystävälliseltä ja sen tekeminen oikeasti mobiiliystävälliseksi ovat kaksi täysin eri asiaa. Ensimmäinen vaatii vain gridin käyttöönoton, jälkimmäinen perusteellista testausta eri laitteilla ja UI-komponenttien hienosäätöä. Tämä vaatii päättäväisyyttä ja johdonmukaisuutta sekä designilta että kehitykseltä. Hyvä puoli on, että mobiili auttaa karsimaan ylimääräiset ominaisuudet ja keskittymään olennaiseen.

Uusi teknologiapino (frontendissä reactJS) antoi meille mahdollisuuden tehdä ominaisuuksista parempia ja välittömiä – teknologia ei enää rajoittanut sitä, mitä pystyimme tekemään. Vaikka alussa oli paljon opittavaa, kehityssyklit ovat lyhentyneet jatkuvasti oikean teknologian, paremman tiimityön ja paremman suunnittelun ansiosta.

Visuaalisella puolella päätimme panostaa maailmanluokan kuvituksiin sen sijaan, että olisimme tyytyneet toimialan tai kilpailijoiden nykytasoon.

Julkisista hankinnoista seksikkäitä

Uudistus julkaistiin viisi kuukautta designvaiheen alkamisen jälkeen, vaikka ohjelmistokehityksen maailmassa työ tietysti jatkuu aina. Olimme sitoutuneet nostamaan rimaa alalla, jolla sitä ei ollut ennen tehty.

Uusi Oppex
oppex.comin uusi etusivu.

Tiiminä onnistuimme tuomaan designin odottamattomaan paikkaan, minkä voit todeta googlaamalla aihetta. Onnistuimme asettamalla riman tarpeeksi korkealle ja yhdistämällä bisnes-, design- ja kehitystiimit. Työ on vasta alkanut, ja jatkamme riman nostamista tällä alalla, oli kyse sitten liiketoiminnasta, käyttäjäkokemuksen parantamisesta tai visuaalisesta vetovoimasta.

Minne seuraavaksi?

Esittely · PDFLataa PDF