Sketch vs. Figma vs. Adobe XD

Olen töideni aikana saanut käyttää erilaisia suunnitteluohjelmistoja. Käytännöt eri yrityksissä ja paikoissa vaihtelevat, joten suunnittelijana saa ja joutuu ottamaan haltuun erilaisia suunnitteluohjelmia. Suunnitteluohjelmista intoilu joskus torpataan sanomalla, että ne ovat vain työkaluja. Hyvä suunnittelu on mahdollista lähes millä tahansa ohjelmalla eikä ohjelma niinkään ole näyttävien ja toimivien designien takana. Pieni intoilu kuitenkin sallittakoon, sillä käytämme työkaluja joka päivä: niiden käyttökokemus kulkee arjessa mukana ja vaikuttaa paljon siihen, miltä päivittäinen tekeminen tuntuu. Tässä ajatuksiani tämän hetken kärkikolmikosta.

Sketch

Aloitin webbihommien ja käyttöliittymien suunnittelun aikoinaan Sketchillä. Se oli ensimmäisiä puhtaasti UI suunnitteluun keskittyneitä ohjelmia ja pidän siitä, että se on riittävän yksinkertainen. Kaikki oleellinen löytyy, tiedostot ovat omalla koneella ja käyttökokemus on intuitiivinen. Käytän Sketchiä vieläkin, jos täytyy latoa kasaan simppeli näkymä esim. vapaa-ajalla. Muun muassa tämän sivuston ulkoasu ja perustyylit on pyöritelty kuntoon ensin Sketchissä. Kovassa käytössä Sketchin rajat kuitenkin tulevat pian vastaan ja esimerkiksi prototypointiin oli aikoinaan käytettävä Invisionin erillistä prototypointiominaisuutta, joka mahdollisti klikattavien näkymien tekemisen. Nykyään tämäkin onnistuu Sketchissä pilvipalvelun kautta, joten eteenpäin on menty. Vaikka Sketchiin on lisätty paljon uusia ominaisuuksia viime vuosina, tuntuu, että se on jäänyt hieman taka-alalle tänä päivänä.

Figma

Sketch todettiin työssäni pari vuotta sitten riittämättömäksi etenkin tiedostojen jaon ja versioinnin osalta eikä vaikeaselkoinen prototypointiominaisuus auttanut asiaa. Figma vastaa tähän täysin webbipohjaisella työkalullaan, joka on kasvattanut suosiotaan tuntuvasti. Kynnys tutun työkalun vaihtamisesta toiseksi tuntuu aina aluksi erittäin suurelta, joten hyppy vaatii totuttelua. Onneksi Figma tarjoaa kätevän ominaisuuden tuoda Sketch-tiedostot siihen, joka toimii käytössä hyvin. Pikanäppäimet ovat paikoin toiset eikä kaikki ominaisuudet löydykään tutuilta paikoiltaan, joten käyttö vaatii totuttelua. Figma kuitenkin vakuuttaa sulavuudellaan: se on nopea, näkymiä voi olla auki käytännössä rajaton määrä ja työtiedoston jakaminen muiden suunnittelijoiden kanssa toimii erityisen hyvin. Tiedosto on myös helppo jakaa lähes välittömästi muiden näytille, sillä se on jo valmiiksi verkossa. Figma todellakin lunastaa lupauksen työkalusta, jolla voi tehdä lähes kaikkea: sivukartoista rautalankamalleihin ja leiskoista prototyyppiin, josta jopa kehittäjät saavat kaivettua hyödyllisiä arvoja suoraan koodiin.

Figmastakin löytyy kuitenkin muutama puute: Sen käyttö vaatii jatkuvaa nettiyhteyttä eikä työtiedoston sisältä pysty käsittääkseni jakamaan vain tiettyjä näkymiä esim. asiakkaalle, vaan käyttäjät pääsevät katsomaan aina koko tiedostoa. Tällöin esim. työpohjat ja keskeneräiset versiot on piilotettava toisen tiedoston taakse.

Figma tuntuu tällä hetkellä olevan nosteessa ja nähtäväksi jää tuleeko se pysymään yhtä aallon harjalla kuin tähän asti.

Adobe XD

Adobe XD on itselleni uusin tuttavuus, jota olen käyttänyt isommissa projekteissa tästä keväästä alkaen. Suomessa se tuntuu olevan käytössä erityisesti mainostoimistoissa, joilla on jo entuudestaan vahva side Adoben työkalupakettiin. XD on sulava ja näppärä sekä tekee kaiken oleellisen. XD:n valttikortti on, että se toimii hyvin yhteen Adoben muiden työkalujen kanssa (Photoshop, Illustrator, Adobe Fonts) ja työtiedostot saa synkattua Adoben pilveen. Useamman projektin kokemuksen jälkeen se vaikuttaa tosin hieman keskeneräiseltä sovellukselta. Jäänkin kaipamaan XD:stä seuraavia asioita toistaiseksi:

  • Tumma teema / Dark mode: Muut Adobe työkalut saa tummalla pohjalla, joten miksei tätä?
  • Kuvaelementtien perusfiltterit: esim. Brightness, Saturation, Contrast, jotka helpottavat kuvien kanssa työskentelyä todella paljon
  • Ääretön canvas: XD-tiedoston tila loppuu yllättävän nopeasti, jos näkymiä tai alasivuja on paljon
  • Sivut / välilehdet: Kätevä tapa jakaa esim. Desktop ja Mobiili -näkymät omille sivuilleen muissa ohjelmissa
  • Vektorityökalu: Työlästä ja paikoin puuttellista XD:ssä ja tässä selkeästi halutaan ohjata käyttäjät Adobe Illustratorin puolelle

Tuntuu kuin Adobe ei tällä hetkellä panostaisi sen kehitykseen yhtä paljon kuin muihin työkaluihin, sillä nettikeskusteluja kaivelemalla nämä ominaisuudet ovat olleet käyttäjien toivelistalla jo vuosia.

Kaiken kaikkiaan eri ohjelmien erot ovat nykyään varsin pieniä. Työkalut tekevät samat asiat hieman toisistaan eri tavalla, mutta peruslogiikka on kaikissa huomattavan samankaltainen. On kiinnostavaa nähdä, mihin suuntaan suunnitteluohjelmat kehittyvät ja tullaanko näkemään näiden tietynlaisen yhteensulautumisen jatkuvan entisestään. Parhaat käytännöt tuntuvat kopioituvan muihin ohjelmiin hyvinkin nopeasti ja on mahdollista, että esimerkiksi Figma voisi kyetä nousemaan alan standardisovellukseksi, jota kaikki käyttävät ja jonka käyttö on hyvä hallita.