Käyttöliittymäsuunnittelu verkkopalvelun uudistuksessa omana vaiheenaan
Käyttöliittymäsuunnittelu (UI/User Interface Design) on tärkeä osa digitaalisten tuotteiden kehitystä olipa kyseessä sitten verkkopalvelu, verkkokauppa, mobiilisovellus tai ohjelmisto. Käyttöliittymän ulkonäkö ja toiminnallisuus määrittelevät pitkälti käyttäjäkokemuksen, joten huono suunnittelu voi johtaa käyttäjien turhautumiseen, palvelusta poistumiseen tai vaikkapa puhelinasiakaspalvelun kuormittumiseen.
Verkkopalvelun käyttökokemuksen suunnittelussa niin sanotut käyttöliittymän rautalankamallit ovat yksi tärkeimmistä vaiheista prosessissa. Niiden tekeminen huolellisesti säästää aikaa, rahaa ja vaivaa. Tässä blogikirjoituksessa redandblue käsittelee, miksi käyttöliittymäsuunnittelun rautalankamallit (wireframes) on hyvä tehdä erillään verkkopalvelun visuaalisen suunnittelun vaiheesta.
Käyttöliittymäsuunnittelu ja verkkopalvelun rautalankamallit
Rautalankamalli (wireframe) on käyttöliittymän visuaalinen esitys, joka keskittyy verkkopalvelun sivujen rakenteeseen ja tärkeimpien elementtien sijoitteluun. Rautalankamalli on yksinkertainen, usein mustavalkoinen luonnos, joka ei sisällä yksityiskohtaisia grafiikoita, brändin värejä tai tyylejä. Rautalangat voivat olla hyvin pelkistettyjä PowerPointilla luotuja laatikkomalleja, käsin piirrettyjä luonnoksia tai tarkempia digitaalisia prototyyppejä, jotka on luotu esimerkiksi Figma-työkalulla.
Käyttöliittymät voidaan jakaa vielä konseptitason rautalangoiksi ja tarkemmiksi UI-käyttöliittymiksi, jotka eroavat toisistaan tarkkuuden osalta. Konseptikäyttöliittymät ottavat usein kantaa siihen, miten verkkopalvelu palvelee sivuston konseptia ylätasolla – miten käyttäjäryhmät ja tavoitteet huomioidaan esimerkiksi sisällöissä eri sivuilla.
Konseptirautalanka voi vaihtoehtoisesti kuvata karkeasti jotain palvelun konseptin kannalta tärkeää ydintoimintoa kuten hakutoiminnallisuutta. Konseptitasolla ei oteta vielä tarkasti kantaa elementtien kokoihin suhteessa toisiinsa tai niiden järjestykseen yksittäisillä sivulla. Suunnitteluprosessin aikana konseptitason käyttöliittymä tarkentuu rautalankaprototyypiksi, joka sisältää jo klikkailtavia käyttäjäpolkuja palvelun sisällä.
Käyttöliittymäsuunnittelu vs visuaalinen suunnittelu - tutustu tarkemmin
Käyttöliittymäsuunnittelussa suunnittelijat voivat keskittyä olennaiseen: käyttöliittymän rakenteeseen, elementtien järjestykseen ja kokoon suhteissa toisiinsa sekä navigointiin. Kun visuaaliset elementit eli värit, typografia ja kuvat jätetään pois, huomio keskittyy siihen, miten eri elementit sijoittuvat, ja miten käyttäjä liikkuu sovelluksen tai sivuston eri osissa. Näin varmistetaan, että käyttöliittymä on looginen, toteutuskelpoinen ja intuitiivinen, ennen kuin visuaalisia yksityiskohtia aletaan lisäämään.
Lue redandbluen Reetan artikkelista tarkemmin, miksi käyttöliittymäsuunnittelu kannattaa eriyttää omaksi vaiheekseen ja tehdä vasta käyttöliittymäproton päälle visuaalinen suunnittelu.
Mikäli tarvitset sparrausta verkkopalvelun suunnitteluun, ota yhteyttä redandbluen kokeneeseen suunnittelutiimiin (hi@redandblue.fi).
Red & Blue - Asiantuntijat ja yhteyshenkilöt
Red & Blue - Muita referenssejä
Tilaaja suosittelee!
Red & Blue - Muita bloggauksia
ite wikin yrityshaku »
Kaikki it-alan työpaikat »
ite wikin referenssihaku »
Kaikki it-alan tapahtumat »
ite wikin julkaisuhaku »
