Monesti sanotaan että juuri oman elämän ongelmista syntyy hyviä kehitysideoita uusille tuotteille. Juuri sillä tavalla Melo- projektikin lähti liikkeelle: salilla ollessani ajatuksena oli tehdä intervallitreeni spinningpyörällä, ja koetin lennosta etsiä simppelin intervalli-ajastimen jossa voin säätää lämmittelyajan, kierroksien määrän, treeni/lepo-osion ja lopuksi jäähdyttelyn. Eli aika perussetti, ei mitään erityistä.

Mutta kuinkas ollakaan: sovelluskaupan vaihtoehtoja selatessa vastaan tuli sama ilmiö joka toistuu aika monessa äpissä: toiminnallisuus saattaa olla ok, mutta käyttöliittymä ja visuaalinen ilme ei houkuttele. Minulle on tärkeää että toiminnallisuuden ohella käyttämäni sovellus on myös miellyttävän näköinen käyttöliittymältään. Kuitenkin moni sovelluskaupan vaihtoehdoista oli joko:

• rumia
• liikaa ominaisuuksia
• ei yksinkertaisia asetuksia joita olisin tarvinnut

Siitähän se ajatus lähti: mitä jos tekisin itse sellaisen timerin, jota haluaisin käyttää? Tavoitteeksi muodostui kauniin ja simppelin sovelluksen konseptoiminen.

Tekoäly osana prosessia: interaktiivinen konseptointi

Osa kehityspäivän mielenkiintoa oli tutkia millä tavalla nykyään sovelluskehitys voisi toimia. Tykkään monesti viikonloppuisin konseptoida uusia juttuja, ja suunnitella jotain mukavaa. Halusin testata kuinka pitkälle pienen sovelluksen saa kehitettyä päivässä tai viikonlopussa kun yhdistetään oma suunnitteluosaaminen ja AI-työkalut?

Vaihe 1: Nimen ideointi

Tämä on yksi suosikkiasioistani: tuotebrändin ideoiminen ja visuaalisen ilmeen suunnittelu. Prosessi alkoi nimen ideoinnilla, ja käytin siinä ChatGPT:tä. Halusin nimen, joka tuntuu raikkaalta ja modernilta, ei niinkään harcode- treenisovellukselta. En myöskään halunnut geneeristä “Tabata Timer” -osastoa, koska niitä on sovelluskauppa täynnä. Tässä vaiheessa tekoäly oli loistava ideointikumppani:

• sain nopeasti paljon nimivaihtoehtoja antamani tiedon perusteella
• pystyin haarukoimaan brändin fiilistä ja suuntaa

Tekoäly auttaa ideoinnissa, ja osa suunnittelijan työtä on kyetä rakentamaan kokonaiskonsepti tavoitteiden pohjalta mukaanlukien kohderyhmä, tavoiteltu tunnelma ja mielikuva jne. Yksi tekoälyn nimiehdotuksista oli Melo, joka sopi kohderyhmään (Millenial + Gen Z) sekä haluttuun tunnelmaan (moderni ja raikas). Sovelluksen lopullinen nimi tulee olemaan Melo HIIT Interval Timer – eli brändinimi + käyttötarkoitusta selventävä liite.

Vaihe 2: Käyttöliittymä-luonnokset

Seuraavaksi siirryin varsinaiseen UI-suunnitteluun. Tein UI-luonnokset käyttämässäni suunnitteluohjelmassa ja lähdin rakentamaan selkeää ja intuitiivista käyttöliittymäkonseptia.

Minimalistinen UI saattaa kuulostaa suunnittelun kannalta helpolta, mutta käytännössä se on monesti päinvastoin:
jokaisella elementillä pitää olla selkeä tarkoitus

• painikkeiden ja fonttikokojen pitää tuntua “oikeilta”
• hierarkian tulee näkyä yhdellä silmäyksellä
• käyttökokemuksen tulee olla intuitiivinen ja miellyttävä ilman pähkäilyä

Suunnittelussa pidin fiiliksen pehmeänä: pastellivärit, suuret elementit, selkeä ja rauhallinen layout. Käyttäjä voi valita kahdesta väriteemasta:

• Sunrise (lämmin, pehmeä, energinen)
• Ocean (raikas, rauhallinen, selkeä)

Vaihe 3: Visuaalinen ilme sovellukselle

Halusin luoda Melo-nimen mukaisen modernin ja raikkaan ilmeen. Tein alkuluonnoksen Procreate- piirrossovelluksessa jossa yleensä teen alkuvaiheen luonnostelun. M-kirjaimen muotoilun dynaamisuus viittaa intervallitreenin sykkeen vaihteluun. Viimeistelin luonnoksen Affinityssä (käyttämässäni suunnitteluohjelmassa) ja tein logosta vektoriversion.

Vaikka kyseessä olisi näennäisesti pieni ja simppeli työkalu-äppi, visuaalisen identiteetin luominen auttaa siitä tekemään oikean tuotteen, ja lisää joustavuutta laajentaa yksittäinen sovellus osaksi kokonaista tuoteperhettä.

Kokonaisvaltainen visuaalinen ilme tekee tuotteelle paljon:

• App Store -näkymä näyttää houkuttavammalta
• helpottaa markkinointia ja myyntiä
• jos sovellukselle haetaan vaikkapa sijoittajia, sovelluksen demo tuntuu uskottavammalta
• jatkokehitys on helpompaa, kun suunta on selkeä

Vaihe 4: Toimiva sovelludemo UI-suunnitelman ja tekstiohjeiden pohjalta

Tässä kohtaa tapahtui varsinainen tekoäly- taika! Tähän mennessä minulla siis oli käyttöliittymäluonnokset kuvina sekä kirjoittamani tekstiohjeet siitä, mitä missäkin ruudussa tapahtuu

Kirjoittamissani tekstiohjeissa olin määritellyt mm:

• mitä käyttäjä näkee aloitusnäytöllä
• mitä “Go”-napista tapahtuu
• miten timer vaihtaa vaiheita (prepare → work → rest → cool-off)
• mitä tapahtuu, kun treeni päättyy

Nämä syötettiin AI-pohjaiseen järjestelmään (Ralph Loop), joka alkoi iteroimaan niiden perusteella konseptia eteenpäin. Näin saatiin aikaan melko nopeasti toiminnallinen demo, jota pystyi jo testailemaan.

Lopputulos: parin päivän aikana syntyi lähestulkoon julkaisukelpoinen pikkuäppi

Melo-projektin tavoitteita olivat:

• Testata tekoälyn mahdollisuuksia sovelluksen suunnittelussa ja kuinka pitkälle AI voi avustaa konseptoinnin ja prototyypin osalta
• Havainnollistaa digitaalisen tuotteen suunnitteluprosessia
• haastaa itseäni tekemään intervalliajastimen jota on kiva käyttää
• tehdä käyttöliittymästä mahdollisimman yksinkertainen

Seuraavat askeleet demosta julkaisuversioon:

• viimeistellä käyttöliittymän yksityiskohdat
• testata käytettävyys treenissä
• rakentaa App Store -julkaisupaketti

Tärkein pointti: AI tekee kokeilemisesta helpompaa. Se madaltaa kynnystä rakentaa, testata ja näyttää muille.

Jos joskus mietit, kannattaako pieneltä tuntuvalle idealle antaa pari päivää työaikaa käyttäen uusia menetelmiä – ehdottomasti! Tulos saattaa yllättää positiivisesti, ja vähintäänkin opettaa jotain uutta.