Isoissa verkko- ja softaprojekteissa on ollut pitkään tapana piirrellä rautalankoja (wireframes) useista näkymistä. Niitä hierotaan Balsamicin tyyppisillä ohjelmilla joilla saa aikaan sellaista Comic Sans henkistä lopputulosta. Ne näyttävät visuaalisesti aivan kamalalta, eivätkä kerro käytännössä kenellekään millään tavoin että miltä lopullinen käyttöliittymää tulee näyttämään.
Tee työtä jolla on tarkoitus? Eli kenelle niitä rautalankoja oikein piirretään? Melkein 100% asiakkaista haluaisi nähdä jo jotain enemmän valmista heti alusta lähtien, eivätkä staattiset kuvat paperilla avaa yhtään käyttöliittymän interaktioita. Hoverit, mouse-overit ja click-to-open tyyppiset toiminnallisuudet, sekä niiden toimiminen päätelaiteriippumattomasti, ovat kuitenkin kaikista helpointa todentaa suoraa html/css maailmassa. On täysin hullua kuvitella että tänä vuonna tehtyjä ohjelmistoja tai palveluita käytettäisiin vielä kahden vuoden päästä 23″ ruudulta. Windows8 ja sen kautta tuleva ”tablettien rantautuminen työelämään” vaikuttaa päätelaitekantaan huomattavasti.
Miten siis tästä eteenpäin?
Tarkoitus ei ole sanoa, etteikö nykyisin rautalankoja piirteleviä henkilöitä tarvittaisi. Uskon vain, että heille olisi projekteissa huomattavasti tärkeämpiäkin tehtäviä. User Experience on kokonaisuudessaan niin suuri siivu, että käyttäjälähtöisten palveluiden suunnittelussa on tehtäviä jokaiselle.
Rautalankoja voi edelleen piirtää esim. yksittäisestä toiminnallisuudesta, mutta sen voi avata ihan yhtälailla vaikka Powerpointilla.
Responsiivinen verkkosuunnittelu (Responsive Web Design) on luonut täysin uusia vaatimuksia käyttöliittymäsuunnitelulle. Olen ollut mukana projekteissa joissa niin visuaaliset suunnittelijat kuin rautalankojen piirtäjät eivät ole selkeästi ymmärtäneet yhtään että mitä RWD tarkoittaa käytännössä. Se on suurin yksittäinen muutos koko suunnitteluprosessiin, joka käyttöliittymäsuunnitteluun on tullut sitten internetin synnyn.
Näytä vain mikä on tärkeää
Yksi suurimmista trendeistä käyttöliittymissä on parin viimeisen vuoden aikana ollut se, että kaikki turha pyritään piilottamaan. Käyttäjät ovat jo tottuneet siihen, lähinnä mobiilisovellusten myötä, että esimerkiksi navigaatio piilotetaan oletuksena klikkauksen taakse. Käyttäjälle tulisi aina pyrkiä näyttämään yhdessä näkymässä vain oleellinen tieto. Tätä ajatusta on projektiryhmässä todella haastavaa saada läpi, jos asiaa ei käydä esimerkiksi staattisen prototyypin tai hyvien esimerkkien kautta läpi niin selkeästi että jokainen ymmärtää mistä on kyse.
Palveluiden käyttäminen on kuitenkin yleensä ”tunnelissa etenemistä”. Käyttäjää kuljetetaan läpi toiminnallisuuksien ohjatusti ja harkitusti. Jos mietit vaikka puhelimessasi olevaa Facebookin natiivi-appia. Kun käyttäjä on valinnut että hän haluaa lisätä kuvan, hän siirtyy sellaiseen näkymään josta ei voi suoraa hypätä muokkaamaan omia asetuksiaan. Loogista, karsittua ja hallittua. Jostain syystä tätä samaa logiikkaa kuitenkin hyödynnetään todella harvoin työpöytäsovelluksissa. Jokaisessa näkymässä on esillä kaikki mahdolliset asiat joita klikkaamalla käyttäjä saa virheviestin tyyliin ”haluatko keskeyttää tapahtuman ja siirtyä pois” tai ”et voi juuri nyt käyttää tätä ominaisuutta”. Miksi siis edes näytämme sellaisia toiminnallisuuksia joita ei voi sillä hetkellä käyttää?
Fast prototyping
Siirry niin nopeasti kevyeen protoon kuin mahdollista. Responsiivinen gridi pohjalla auttaa testaamaan käyttöliittymän toimivuuden kaikilla laitteilla ja tiettyjen interaktioiden käytettävyys on heti alussa helpompaa testata ja todentaa.
Prototyyppi on sitten helposti koristeltavissa ”asiakkaan näköiseksi” ja esimerkiksi nappien ja navigaation käytettävyys paranee värien kautta aina. Virheviestien tai huomioboksien sijoittelukin on helpompaa kun voit pelata enemmän väreillä. Erottuva punainen laatikko erottuu huonommassakin kohdassa paremmin. Musta-valkoisessa rautalankamallissa se sijoitetaan aina tiettyyn paikkaan keskeiselle sijainnille.
Maailma muuttuu. Suunnittelu muuttuu. Älä siis pysy paikoillaan.
