Blogi ja uutiset

Takaisin
9.11.2021

Vaihtamalla paranee – uusi suunnittelutyökalu ketteröittää päivittäistä työtämme

Hyvät ja toimivat työkalut auttavat onnistumaan ja ovat olennainen osa mielekästä työntekoa. UX/UI –tiimiämme, joka meillä sisäisesti tunnetaan nimellä uikkutiimi, on viime aikoina työllistänyt suunnittelutyökalun vaihto. Olemme sivunneet aihetta aiemmissa Sisu 2.3 ja Sisu 2.5 -versioiden blogeissa, mutta nyt UX-suunnittelijamme Anna kertoo tarkemmin, millaista työtä työkalun vaihtaminen on vaatinut ja mitä uudistuksia se tuo tullessaan.

Tavoitteena ketterämpi suunnitelmien työstö ja jakaminen

Funidatalla UX- ja UI-suunnittelijoiden työnkuva sisältää muun muassa käyttöliittymäsuunnitelmien ja -prototyyppien luontia. Aiemmin käytimme tähän digitaalista suunnittelualustaa Sketchiä, joka mahdollistaa suunnittelijoiden kuvaamien suunnitelmien ja prototyyppien rakentamisen ja esittämisen saman asian parissa työskenteleville kehittäjille, asiantuntijoille, testaajille ja asiakkaille. Halusimme kuitenkin panostaa entistä enemmän suunnitelmien ketterään työstöön ja jakamiseen, joten päätimme vaihtaa työkaluksemme Figman. Figma on pilvipohjainen muokkaus- ja prototyyppityökalu, joka tukee usean henkilön samanaikaista työskentelyä, suunnitelmien kommentointia sekä prototyyppien ja suunnitelmien jakamista yhä joustavammin. Lisäksi Figmassa on helpompi kasata, muokata ja hallinnoida komponentteja, joista Sisun suunnitelmat on rakennettu. Joten eiku muuttamaan!

Komponenttien läpikäyntiä ja suunnitteluprosessien hiomista

Itse vaihto työkalusta toiseen sujui yllättävän kevyesti. Edistimme vaihdosta joustavasti käyttämällä välillä kahta suunnittelualustaa rinnakkain: aloitimme jo uusia suunnitelmia Figmassa ja jatkoimme vanhojen päivitystä Sketchissä. Saimmekin ajoitettua työkalun vaihdoksen melko hyvin niin, että keskeneräisiä Sketchistä Figmaan siirrettäviä suunnitelmia oli ihan muutama.

Siirtyessämme työkalusta toiseen meille oli luontevaa käydä läpi Sisun suunnittelussa käytetty komponenttikirjasto. Ajan saatossa kirjasto oli laajentunut, ja halusimme yhtenäistää Sisun komponentteja ja tyylejä. Eniten aikaa ja resursseja on mennyt komponenttien siivoamiseen, päivitykseen ja niiden saavutettavuuden varmistamiseen. Karsimme komponentteja, tarkastimme kontrasteja ja värisävyjä saavutettavuuden näkökulmasta sekä loimme yhtenäisempää linjaa Sisun suunnittelun tueksi. Työ jatkuu edelleen, sillä käymme viikoittain läpi Figmaan ja Sisun komponentteihin ja tyyleihin liittyviä kysymyksiä ja päivitämme kirjastoa päivittäisen työn ohessa.

Työkalun vaihtaminen auttoi meitä tarkastelemaan olemassa olevia suunnitteluprosesseja. UX- ja UI-suunnittelijoiden porukka on kasvanut ja tulee kasvamaan jatkossakin, joten suunnittelutiimissä on tavoitteena rakentaa järjestelmällistä ja skaalautuvaa toimintaa. Prosessien hiominen ja työtapojen yhtenäistäminen tukevat uusien työkavereiden liittymistä matkaan mukaan. Suunnitelmien luominen on ketterämpää ja selkeämpää niin uudelle kuin vanhallekin uikulle, kun tieto on koottu järjestelmällisesti yhteen paikkaan, komponentit on tarkastettu saavutettavuuden näkökulmasta ja Sisun yleisimmistä näkymistä on luotu suunnittelupohjia.

Suunnittelutyökalu Figma

Figman vaihdon ohella on päästy hiomaan suunnitteluprosesseja ja työstämään aiheita entistä tiiviimmässä yhteistyössä eri tiimien välillä.

Toimiva työkalu tukee joustavaa yhteistyötä

Tehdessämme Figmasta uutta suunnittelumme kotia olemme huomanneet, että suunnitelmien ja prototyyppien jakaminen sen avulla on ollut joustavaa ja mahdollistanut entistä tiiviimmän yhteistyön eri sidosryhmien kanssa. Olemme myös havainneet, että suunnitelmien näppärä kommentointimahdollisuus on auttanut meitä siirtymään kohti iteratiivisempaa kehitystä joustavilla aikatauluilla. Kommentoida voi silloin kun itselle parhaiten sopii, keskustelua voidaan käydä tietyssä kohtaa suunnitelmaa kohdistettujen kommenttien avulla ja keskustelusta jää ”muistijälki” suunnitelmaan.

Lisäksi kehittäjät voivat löytää käytettyjä fonttikokoja, välistyksiä ja värikoodeja Figmassa olevista suunnitelmista entistä näppärämmin. Näin pystymme tiivistämään yhteistyötämme projektin sisällä yhä tehokkaammin. Yhteistyötä tukee myös rakenteilla oleva design system, jossa kehittäjien tulevaisuudessa käyttämä Storybook-työkalu yhdistetään suunnittelijoiden käyttämään Figmaan. Design systemin kautta pystymme ylläpitämään Sisun samoja rakennuspalikoita niin suunnittelun kuin kehityksenkin puolella.

Fiilikset uudesta työkalusta ja sen tuomista uudistuksista ovat olleet positiiviset. Jäämme innolla havainnoimaan ja ideoimaan, mitä muita mahdollisuuksia työkalun vaihdos ja toimintatapojen päivittäminen vielä tuovat tullessaan!