Mobiiliohjeet

Mobiili ensin

Digitaalisia palveluita suunnitellessamme noudatamme ”mobiili ensin” -periaatetta, jonka keskiössä on mobiilikäytön huomioiminen jo palvelun suunnittelussa. Näin varmistamme, että palvelun käyttö on sujuvaa useimmilla laitteilla. Periaate myös rohkaisee meitä määrätietoiseen priorisointiin palvelun toimintojen ja sisällön suhteen.

Keräsimme kaikille digitaalisia palveluita kehittäville tarkoitetun muistilistan, jonka kysymyksiin vastaamalla varmistat, että palvelusi vastaa käyttäjien todellisia tarpeita myös mobiilissa.

Lataa mobiiliohjeistus (.pdf) tästä – sisältää paljon lisää ohjeita!

Piirretty hahamo

Muista nämä

  • Selvitä käyttäjätarve ja todenna näkemys – onhan palvelulle aidosti perusteltu tarve?
  • Varmista onko kokonaan uuden palvelun luominen välttämätöntä – voiko olemassa olevaa kehittämää tai rajapintoja avata?
  • Valitse sopiva mobiilitoteutustapa – responsiivinen web-sivu, PWA tai sovellus.
  • Varaudu ja suunnittele jatkuva kehittäminen ja ylläpito jo suunnitteluvaiheessa – se auttaa kokonaisinvestoinnin ja aikataulun suunnittelussa. Ensimmäinen julkaistu versio harvoin on täydellinen!

Pohdi näitä kysymyksiä

Onko tälle tosielämän tarvetta?

  • Varmista ennakkoon, että palvelulle ja sen toiminnallisuuksille on yleisö (käyttäjäryhmä), joka todella tarvitsee palvelua.
  • Keskity ymmärtämään inhimillisiä tekijöitä ja pohdi toteutusta täysin alusta- ja teknologiariippumattomasti.
  • Älä tee mitään, jos vaihtoehtona on tehdä jotain turhaa ja käyttäjien kannalta tarpeetonta.

Huomaa että vaikka hankkeen keskeyttäminen jo ennen käyttöliittymäsuunnittelun aloittamista voi tuntua varhaiselta epäonnistumiselta, se voi olla myös arvokas oppimiskokemus. Varhaisessa vaiheessa “epäonnistumisen” kustannus on pienempi ja suunnan muuttaminen helpompaa.

Tutustu käyttäjätarpeiden selvittämisen ja konseptien validoinnin neuvoihin ja menetelmiin:

Onko kokonaan uuden luominen välttämätöntä?

  • Tarpeeseen vastaaminen voi onnistua myös jotain olemassa olevaa palvelua hyödyntäen. Kaikkea ei tarvitse luoda itse eikä varsinkaan alusta asti.
  • Punnitse ainakin näitä vaihtoehtoja:
    • Onko kaupunki tehnyt jotain vastaavaa aiemmin? Voisiko sitä hyödyntää jotenkin, vaikka vain osittain?
    • Onko mahdollista avata keskeiset datalähteet, luoda niille rajapinnat ja rohkaista innokkaita kehittäjiä hyödyntämään niitä?
    • Onko olemassa alustoja tai kanavia hyödynnettävissä ilman, että tarvitsee luoda kaikkea itse? Esimerkiksi kirjastokorttipalvelun/sovelluksen rakentamisen sijaan mahdollistetaan kortin lisääminen Apple Walletiin tai Google Pay -lompakkoon.

Miten valitsen sopivan toteutustavan mobiiliin?

Kun tarve ja motivaatio uuden palvelun luomiselle ovat aidosti todennettuja, on aika miettiä teknistä toteutustapaa.

Taulukossa näet neljä tyypillistä toteutustapaa mobiilikokemusten toteuttamiselle helpoimmasta raskaimpaan toteutukseen:

Oletustoteutustapa

Mobile first responsiivinen web

Verkkopalvelu joka mukautuu eri näyttökokoisin ja huomioi tietotarpeet eri käyttökonteksteissa

Hyödyt
  • Tarjoaa halvan ja nopean mobiilitoteutuksen
  • Sopii myös desktop-käyttöön
Haitat
  • Ei hyödynnä kaikkia puhelimen ominaisuuksia
  • Käytetään mobiililaitteen selaimella

PWA (progressive web aplication)

Sovellus joka toimii suoraan kännykän selaimessa ilman latausta sovelluskaupoista.

Hyödyt
  • Tarjoaa nopean ja edullisen tavan julkaista ja päivittää palvelu
  • Näyttää mobiilisovellukselta mutta ei tarvitse ladata kaupasta
  • Toimii Android- ja Iphone-puhelimissa
  • Löytyy hakukoneilla
Haitat
  • Toimii HTML5-ympäristössä ja kaikki toiminnallisuudet eivät ole käytössä kaikilla mobiililaitteilla
  • Ei kommunikoi muiden mobiililaitteen sovellusten kanssa

Alustariippumaton sovellus (muu kuin PWA)

Sovelluskaupasta ladattava sovellus, joka toimii samalla tavalla käyttöjärjestelmästä riippumatta.

Hyödyt
  • Hyödyntää monipuolisemmin puhelimen ominaisuuksia
  • Mahdollistaa yhden toteutustavan kaikille käyttöjärjestelmistä riippumattoman toteutustavan
Haitat
  • Vaatii PWA:ta raskaamman toteutuksen
  • Edellyttää sovelluksen lataamista ja päivittämistä sovelluskaupan kautta
  • Toimii usein vain nettiyhteydellä

Natiivisovellus

Sovelluskaupasta ladattava sovellus, joka hyödyntää laiitteen kaikkien ominaisuuksia ja toteutetaan erikseen sekä Androidille että iOS:lle

Hyödyt
  • Hyödyntää kaikkia puhelimen ominaisuuksia ja tarjoaa mahdollisuuden tehoa ja suorituskykyä vaatiivat toteutukset
  • Mahdollistaa luotettavan ja tietoturvallisen palvelun
  • Toimii ilman nettiyhteyttä
Haitat
  • Vaatii raskaamman ja hitaamman toteutuksen
  • Edellyttää sovelluksen lataamista ja päivittämistä sovelluskaupan kautta

Suosi yksinkertaisuutta

Yksinkertainen on kaunista.
Yksinkertaisin toteutustapa on mobile-first-lähtökohdista suunniteltu mukautuva selainpohjainen sivusto. Mikäli palvelu todennetusti tarvitsee toiminnallisuuksia, jotka eivät web-toteutuksella ole mahdollisia, tarkastele muita vaihtoehtoja toteutustapojen taulukosta.

Piirretty hahmo sanoo Simple is pretty

Esimerkki toimivasta PWA-mobiilitoteutuksesta, joka hyödyntää mobiililaitteen ominaisuuksia kuten sijaintitietoa. Käyttöliittymäsuunnittelun ja skaalautuvuuden periaatteet pätevät toteutusvalinnasta ja teknologiasta riippumatta.

Näyttökuva reittioppaasta
Näyttökuvia Reittioppaasta

Lataa koko mobiiliohjeistus tästä


Miten palveluita kehitetään mobiiliin? Miten varmistat, että palvelusi toimii myös mobiilissa?

Koko ohjeistus sisältää huomattavasti enemmän materiaalia kuin sivuilla esitellyt esimerkit.

Kaksi piirrettyä hahmoa lyö kädet yhteen

Pikapalaute

Löysitko tiedon mitä kaipasit? Voit jättää palautetta palvelun toiminnallisuuksista tai kertoa, jos jokin asia ei mielestäsi toiminut tai mennyt aivan nappiin.