UX- ja UI-suunnittelu

UI- ja UX-suunnittelu ovat merkittävässä roolissa onnistuneelle ohjelmistoprojektille. Siinä missä koodia voi olla vaikea ymmärtää, UI ja UX tuovat sen käyttäjän tasolle.

UX-suunnittelu

User experience design tarkoittaa käyttäjäkokemuksen suunnitteluaKäytettävyys on yksi sovelluksen tärkeimmistä ominaisuuksista, jossa otetaan huomioon ihmiselle tyypilliset psykologiset toimintatavat. Sovelluksen on oltava toiminnallisuudeltaan ennustettava, jotta sen käyttö olisi mahdollisimman intuitiivista. 

Onnistunut käyttökokemus vaatiikin testaamista, johon käytetään prototyyppejä. Esimerkiksi mobiilisovelluksessa navigointia testataan sovelluksen prototyypi-versiolla, jonka jälkeen tehdään tarvittavat muutokset kertyneiden huomioiden pohjalta. Käyttökokemus vaikuttaa käyttäjien tyytyväisyyteen, millä on suora vaikutus sovelluksesi menestykseen.

UI-suunnittelu

Eli user interface design taas tarkoittaa  käyttöliittymän suunnittelua eli sitä mitä käyttäjä näkee sovelluksen näytöllä. UI-suunnittelijan tärkein tehtävä on tehdä tietyn tehtävän suorittaminen asiakkaalle mahdollisimman yksinkertaiseksi ja sujuvaksi. Tämä toteutetaan visuaalisin keinoin, jolla vaikutetaan suoraan käyttäjän intuitiiviseen vuorovaikutukseen sovelluksen kanssa.

Yksinkertaistettuna UX-suunnittelu tekee sovelluksessa navigoinnista helppoa. Olet ehkä huomannut, että eri sovellusten kirjaudu sisään -nappi löytyy samantapaisesta paikasta, ja siksi löydät sen aina nopeasti. UI-suunnittelulla napista taas on tehty selkeästi klikattavan näköinen elementti, jolloin sovelluksen käyttäjä tietää automaattisesti, että sitä painamalla tapahtuu jokin toiminto.

UX- ja UI-suunnittelu ovat vahvasti sidoksissa toisiinsa, sillä käyttöliittymän kokemus vaikuttaa olennaisesti käyttäjäkokemukseen. Yhdessä muodostuu lopputulos siitä, millaisen kokemuksen loppukäyttäjä saa sovelluksesta.

Dymen oma UX- ja UI-härvääjä Jani "Jantunen"

UX-suunnittelija

Suunnittelija työpisteellään yhtä iloisena, kuten aina.

”Olen toimiston “Jantunen”. Siis yleismies, joka härvää monenlaista. Leijonan osa työpäivästäni menee ohjelmistojen ja mobiilisovellusten ulkoasujen ja toiminnallisuuksien suunnittelussa ja brändäyksessä.” Jani kertoo.

Jani aloitti Dymellä noin 1,5 vuotta sitten. ”Dymellä oli syntynyt tarve saada oma suunnittelija ohjelmistojen ulkoasujen suunnitteluun ja minä sain tämän laakapallon suoraan lyhyen mailani varteen.”

Arki on täynnä UX-suunnittelun esimerkkejä

Janin mukaan käyttökokemus luodaan ohjelmistoissa samalla periaatteella, kuin arkisessa elämässä. ”Jos ovi ei aukea kahvaa painamalla alas, syntyy outo käyttökokemus. Tämä asettaa tekemiseen niin rajoja, sekä toisaalta mahdollisuuksia. Lempiesimerkkini oudosta, mutta toimivasta käyttäjäkokemuksesta arkisessa ympäristössä on VR:n vaunuista löytyvä oven työnnin. Kämmen, jossa on kuusi sormea on samalla nerokas ja huomion kiinnittävä toteutus, joka tuo hymyn huulille.”

”Ohjelmistokehitysprosessi on alkanut viimein avautumaan itsellenikin paremmin, vaikka koodia en osaakaan tuottaa. Sanoisin sen olevan parhaimmillaan kuin hienosti yhteenpelaavan jääkiekkojoukkueen tiimityötä. Syötöt kulkevat lavasta lapaan ja ohjelmistojen päivitysversiot lähtevät lämärien lailla. Tässä prosessissa koen itse olevani se fläppitaulu, jota kaikki tuijottavat.”

Siinä missä vapaa piirto ja liikkuva kuva antavat vapauksia, käyttöliittymä vaatii militanttia särmää ja tarkkuutta.

UI vaatii tarkkaa visuaalista silmää

Käyttöliittymäsuunnittelu alkaa yleensä asiakkaan tarpeesta tai ideasta. ”Tämä on mielenkiintoinen vaihe varsinkin, jos aihealue on itselle vieras ja yleensä se todella on” Jani kuvailee.

”UI-suunnittelu oli aluksi itselleni hyppy altaan syvään päätyyn. 3D-animaattorina koulusta ulostulleena, ei loikka ollut kivuton. Siinä missä vapaa piirto ja liikkuva kuva antavat vapauksia, käyttöliittymä vaatii militanttia särmää ja tarkkuutta. Nykyään saa helposti päänsäryn tuijottamalla kyläyhdistyksen Facebook-sivuilla julkaistua ilmoitusta, jossa fontit ovat Comic Sansia höystettynä jollakin aiheeseen etäisesti sopivalla kuvalla.”

”Pidän linjoja rikkovasta suunnittelusta ja kaikki valtavirrasta poikkeava aiheuttaa euforiaa ja välittömän ikuistuksen pääni sisäiseen valokuva-albumiin. Hyvänä esimerkkinä Reppi.fi-toteutus, joka ei valitettavasti ole peräisin omasta digisulkakynästäni.”

Hyvä UI-suunnittelu saa aikaan selkeän vuorovaikutuksen käyttöliittymän ja käyttäjän välillä.”

”Käyttöliittymäsuunnittelu on yksinkertaisuudessaan se pinta, joka kätkee sisälleen kaiken sen logiikan, joka on kätketty ohjelmiston syövereihin. Yhden napin painaminen saattaa käynnistää sarjan monimutkaisia käskyjä, komentoja tai hakuja.”

”Napin ulkonäkö sen sijaan on yhtä tärkeä. Jos käyttäjä ei havaitse nappia tai ymmärrä ruudulla näkyvää napiksi, UI-suunnittelu on epäonnistunut.”

ui ux

Reppi.fi toteutuksen UI-pohjat muokkaustilassa.

Suunnittelija on aina asiakkaan ja kehittäjän armoilla

Jani huomauttaa, että vaikka UI-suunnitelma hivelisi omaa silmää, se ei automaattisesti ole tarkoitukseensa toimiva. Omiin teoksiinsa on helppo rakastua, mutta UI-suunnittelukin vaatii toisinaan oman mukavuusalueen ulkopuolelle astumista. ”Graafinen näkemykseni ei aina kohtaa toteutuksen jouhevan tuottamisen kanssa. Porukassa on todella kovia ammattilaisia ja heiltä saa nopean korvatillikan, jos piirtojälki alkaa heittämään liikaa taiteilun puolelle.”

”Parasta tässä työssä on ehdottomasti se, kun omasta piirtojäljestä saa hyväksynnän vaativalta ja graafisesti osaavalta asiakkaalta. Mikäli taas kehittäjältä ei tule sanomista, voi sen tulkita positiiviseksi hiljaisuudeksi. Tällöin voin kokea ohikiitäviä onnistumisen tunteita. Hyvin suomalainen ja toimiva tapa minusta.”

Palvelut

Mobiili­sovellukset

Rakennamme räätälöidyt mobiilisovellukset yrityksille.

Katso lisää

Uusi koti softalle

Softan ylläpito ja kehitys

Katso lisää

CMS sisällönhallinta

Koostamme räätälöidyt sisällönhallintajärjestelmät yrityksille valmiista komponenteista.

Katso lisää