Figma vs. Skica

Napomena autora: Kao i svaki softver, i ovaj se pregled obavlja na verzijama dostupnim na izvornom datumu objave; oba su imala ažuriranja, a ja ću pokušati ažurirati ove usporedbe proizvoda i recenzije.

Ažurirano: 29.6.19

Budući da je većina UX-ovih dizajnera u svom prethodnom poslu koristila Sketch, a nekolicina ih je čak isprobala Figmu, mislio sam da ću napraviti natječaj "head-to-head" na osnovu mojih posljednjih 18 mjeseci koristeći Figmu kao svoj primarni alat za dizajn.

U prethodnoj tvrtki promovirao sam Sketch preko Illustratora i našao sam sličan otpor „novoj stvari“. Moj cilj zaljubljenika u dizajn je pronaći najbolji alat za sve što posao treba raditi.

Predgovor bih trebao usporediti s nekoliko komentara:

  • Razlog zbog kojeg neki ljudi ne vide prednost Figme nad Sketchom je jednostavno zato što ne usko surađuju na određenim datotekama s drugim članovima tima. Ovo nije kritika - oni rade na jednoj datoteci Sketch i dijele je samo kao sinkronizaciju ili izvoz u Invision ili mapu. Budući da ne mogu zajedno raditi na datoteci (kao što ste to u Google dokumentima ili Figmi), ne funkcioniraju.
  • Morate koristiti Figmu u timskom okruženju da biste zaista vidjeli kako je fantastično raditi zajedno na projektnim datotekama. Ako smatrate da je suradnja s Google dokumentima „jeziva“ i mislite da radite bolje sami (što danas ne biste trebali raditi u UX-u), ne prihvaćate budućnost i prirodu principa dizajna sustava. Sve je stvar suradnje međudisciplinarnih timova.
  • Drugi razlog je taj što mnogi od nas ne koriste simbole ili komponente u svom radu; samo dupliciramo elemente po potrebi i stvaramo drugu stranicu bez korištenja simboličke tehnologije za ažuriranje elemenata. Čak i uz suze listova knjižnice uzoraka moje tvrtke, morate namjerno stvarati simbole da biste to iskoristili u Sketch-u. Ako ne upotrebljavate simbole ni u jednom alatu, ne upotrebljavate alat najbolje njegove mogućnosti.

Značajke Head to Head

cijena

Pobjednik - Figma

Imajte na umu da se to temelji na mogućnosti uređivanja ili komentiranja dizajnerske datoteke prilikom prve uporabe; uz Sketch morate instalirati licenciranu kopiju.

  • Figma je besplatna za bilo koji broj ljudi, sve dok ne upotrebljavate timske projekte i tada iznosi 12 USD mjesečno po uredniku.
  • Svatko može otvoriti Figma datoteku bez instaliranja aplikacije; oni također mogu pregledavati datoteke i prototipove i dodavati komentare - besplatno.

Simboli i knjižnice

Pobjednik - Figma

  • Skica koristi padajući izbornik za pristup simbolima, što otežava odabir elemenata dizajna. Podržavajte dizajnerske biblioteke u dijaloškom okviru kako biste otvorili datoteke dizajnerskog sustava za upravljanje.
  • Figma koristi namjenski dijalog tako da su lako dostupni i pomalo bolje organizirani.

29.06.19.: Postoji nekoliko alata za izradu dizajnerskog sustava koji sada rade i sa Sketch i Figmom. Pogledajte primjere sažetaka i nulte visine. Obje tvrtke nastoje da njihovi alati djeluju kao dio vašeg dizajnerskog sustava, i dalje tvrdim da Figma to čini bolje zbog prirode aplikacije u stvarnom vremenu. Bohemian Coding radi na programu Sketch for Teams, koji vam, očito, omogućava da istovremeno surađujete na datoteci. Morat ćemo pričekati i vidjeti je li to samo hack da bismo dostigli Figmu. Sketch for Teams dodaje i automatsku verziju, nešto što je Figma imala i poboljšala nekoliko godina.

  • Skica dodaje lokalne simbole na dodatnu stranicu u .sketch datoteci (ili opcionalno na istoj stranici), dok Figma ima namjenski dijalog iste komponente "komponente" (kao što Figma naziva simbole). Figma također ne stvara instancu simbola, što smatram nezgrapnim u Sketchu, posebno jer ako stvarate knjižnicu s mnoštvom simbola.
  • Sketch je tek nedavno pružio mogućnost upotrebe timskih knjižnica i ažuriranja simbola više datoteka, dok je Figma to radila blizu početka.
  • Također možete razmjenjivati ​​dijeljene komponente kroz datoteke, što znači da će ugniježđene komponente zadržati svoje stanje kao instanca tako da možete zamijeniti ugniježđenu instancu za druge.
  • Skica sada to radi, ali njihov pristup je da imaju poništavanja na dugom popisu padajućih padajućih ploča na ploči s svojstvima, dok Figma omogućava da prekoračite mjesta na mjestu, što smatram puno lakšim i intuitivnijim.

Pobjednik: Figma

  • Obje aplikacije sada podržavaju stilove u timskim bibliotekama tako da možete mijenjati stilove u svim datotekama, ali Figma je implementacija detaljnija i omogućuje vam bolju kontrolu. Na primjer, mogu odrediti stilove za određeno popunjavanje, udarivanje, efekt, stil teksta, čak i postavke izgleda i nadjačati ih bez potrebe za loženjem određenog naziva nadjačaj na ploči svojstava.

Alati za crtanje

Pobjednik: Nerešeno je

  • Ja bih tvrdio da u alatima za crtanje Sketch postoji više propusta, ali u osnovi alatni alati rade isto. Sketch ima više alata, ali oni nisu bitni i dodaju složenost cjelokupnoj aplikaciji.
  • Snap točke, raspored i smjernice na Figmi mnogo su jednostavniji za upotrebu i razumijevanje. Ono što nedostaje u značajkama dobiva u dobro nijansiranim alatima s manje pogrešaka. Isprobajte njihov alat Bezier line u usporedbi sa Sketch.
  • Mislim da bi vodiči na oba proizvoda mogli poboljšati napredak; trebali bismo ih moći grupirati, odabrati i izbrisati (umjesto da ih povlačimo s platna), pa čak i spremiti. A rade i obrnuto kada stvaraju vodilice, Figma vodiči povučeni iz x ravnala stvaraju vodoravni vodič, dok Sketch stvara vertikalni vodič kada kliknete na x ravnalo. Ovo je jedna od onih značajki koje imaju smisla bilo kako bilo da na to gledate iz nekog razloga.

Brzina i performanse

Pobjednik - Figma

  • Ruke dolje, Figma je mnogo brža pri uređivanju i pregledavanju datoteka. Datoteke skice mogu se učitati brže nakon početnog pokretanja programa Sketch, ali radije ću brzo zumiranje, pomicanje i izvršenje alata nakon učitavanja datoteke.

Sustav datoteka

Pobjednik - Figma

  • Figma je agnostik platforme jer se pokreće u pregledniku, tako da ga možete pokrenuti na bilo kojem računalu s preglednikom.
  • Datoteke Figma dostupne su svima. Evo veze do datoteke koja prikazuje jedan Figma okvir koji pokazuje potencijalno smanjenje koraka procesa kada alat koristite kao dio UX procesa.
  • Postoji i Figma desktop aplikacija za one koji preferiraju lokalnu aplikaciju nad preglednikom. Ovo je dostupno za Mac i Windows.

kolaboracija

Pobjednik - Figma

  • Kao aplikacija utemeljena na pretraživaču, Figma omogućava potpunu suradnju u realnom vremenu na projektima i datotekama. Ako odaberete nečiji avatar, vodi vas do trenutnog prikaza.
  • Vrlo je važan aspekt upotrebe žive suradnje u dizajnerskoj datoteci o kojoj sam pisao u časopisu Medium - izbjegavanje nanošenja dizajna.
  • Programeri su uvijek u toku i mogu zatražiti Figma datoteku (bez zasebnih dodataka ili alata) kako bi dobili atribute objekata za svoj rad.

Pregled

Pobjednik - Figma

  • Budući da se datoteke pregledavaju uživo, bilo koji pregled može obavljati bilo koji broj ljudi, krećući se pogledima jedni drugima klikom na njihov avatar u zaglavlju Figma, posebno snažnim tijekom rada na daljinu.
  • Skica se temelji na datotekama i stoga nema načina za dijeljenje vašeg rada ako se ne oslanjate na Sketch Cloud ili druge alate za sinkronizaciju i / ili održavanje prezentacija.
  • Na Figmi možete samo pritisnuti strelicu „Prisutnost“ na alatnoj traci da biste započeli prezentaciju uživo i kretali se između okvira.

Komentiranje

Pobjednik - Figma

  • Figma je ugradila u komentare koji su sinkronizirani sa Slack kanalom po projektu. Svi komentari ostavljeni na posebnoj ploči niti za komentare u Figma datoteci pojavljuju se na Slack kanalu za potpuni pregled i odgovor tima.
  • Sketch nema sustav komentiranja i oslanja se na izvoz ili sinkronizaciju s drugim alatima ili dodacima.

Uvoz / izvoz

Pobjednik: Figma

29.06.19: Ovo je bilo izvlačenje do ovog ažuriranja, Figma je napravila tako sjajan posao sa značajkama uvoza i izvoza Sketch-a, uzmite nagradu. Ne možete preuzeti datoteku Figma i uvesti je u Sketch.

  • Oba alata mogu uvesti / izvoziti bitmape i SVG, a oba rade sličan posao. Međutim, možete ispustiti .sketch datoteku izravno u Figmu i imati punu parnost, ne možete uvoziti Figma datoteke u Sketch, osim kao SVG koji ima tipične degradacije.
  • Jedan od glavnih razloga zbog kojeg sam se prebacio na Figmu je bio mogućnost da svoje postojeće Sketch datoteke ispustim u Figmu i nastavim raditi. Nikad se nisam osvrnula - nije trebalo. A Figma je nastavila poboljšavati značajku uvoza Sketch-a.

dijeljenje

Pobjednik - Figma

  • Možete dijeliti bilo koju Figma datoteku i postaviti dopuštenja u jednom koraku, a prikaz dijeljenja možete temeljiti na datoteci, stranici ili okviru.
  • U Sketchu možete koristiti značajku prijenosa u oblak, ali zahtijeva ručno ažuriranje svaki put kada se izvrši promjena. Ili možete koristiti alate za sinkronizaciju koji nisu u stvarnom vremenu i dalje pate od kašnjenja sinkronizacije.

Umetanje datoteke

Pobjednik - Figma

  • Skica ne podržava ugrađivanje datoteka uživo; s Figma možete upotrijebiti iFrame i učitati Figma datoteku u ažuriranom vremenu u stvarnom vremenu. Na primjer, ugradili smo naše makete u Confluence koristeći makronaredbu "HTML insert" u Confluence
  • Tvoji programeri i programeri nikada ne moraju pitati "je li ovo najnovija verzija"? Uvijek jest - čak možete staviti prikaz stranice Confluence pored prikaza Figma datoteke i gledati promjene ažuriranja Figma datoteke u Confluence u stvarnom vremenu. Jednostavno.

Ažuriranje i pomoć pomoći

Pobjednik - Figma

  • Figma je aplikacija koja se temelji na pregledniku i koja je uvijek u toku prilikom svakog pokretanja. Ne morate čekati potpuno ažuriranje aplikacija i ponovnu instalaciju.
  • Figma također koristi Intercom pomoć koja je postala uobičajena za web aplikacije; Smatram ovo nevjerojatno korisnim za brza pitanja i puštanje pristupa bilješkama. A bilješke o izdanju samo su jedan klik dalje od njihovih? izbornik u donjem desnom kutu aplikacije.
  • Skica zahtijeva ažuriranja koja u često mogu uzrokovati neuspjeh dodataka. To je bio jedan od glavnih razloga zašto sam postao toliko frustriran boemskim kodiranjem; stvorili su platformu, ali nemaju vrlo čvrst sustav održavanja za treće dobavljače. Sketch je nedavno poboljšao postupak ažuriranja i sada pokazuje maleni toster (hajde, momci, ne bih se uvrijedio da je veći, jedva primjećujem) da upozorava na ažurirane dodatke.

Dodaci

Pobjednik - skica (za sada)

29.06.19.: Figma će uskoro podržavati dodatke, a vi možete otići u Zeplin na crveni rad.

  • Figma sada ima otvoren API koji obećava mrijesti zajednicu programera Figma dodataka. Moja glavna briga je kako se to rješava - kao što je spomenuto Sketch je neprekidno razbijao dodatke kada su počeli nuditi tu značajku.
  • Sketch ima mnoštvo dodataka za sve vrste funkcionalnosti, a s nedavnim dodavanjem ažuriranja dodataka uživo manje je vjerojatnost da će se prekinuti sa svakim novim ažuriranjem aplikacija.

Podrška za dizajn sustava

Pobjednik - ždrijeb

  • Najveći problem koji većina dizajnerskih alata ima sada je taj što nemaju načina da postanu "živi" prednji dio dizajnerskog sustava. Promjene unesene u glavnu datoteku dizajna trebaju se automatski ažurirati bibliotekom uzorka dizajna, promovirajući promjene izravno u postupnu gradnju.
  • Google je pružio dodatak Material Design za Sketch koji je vrlo dobro napravljen.
  • U tijeku je trkač koji će se vidjeti tko će pobijediti u ovoj areni; Pretpostavljam da Figma ima prednost jer su platforma utemeljena na pretraživaču, a čak sam i prije nekoliko mjeseci predložila moguće rješenje.

U zaključku

Kao što moje kolege znaju, fanatično sam se nagnuo prema Figmi, onakav kakav sam imao kad je na scenu stigao Sketch i svi su koristili Adobe proizvode. Ali ako pokušate Figmu pokušati u stvarnom radnom okruženju i ostati otvoreni, mislim da ćete i sami doći do istog zaključka.

Imajte na umu da i dalje smatram da je Sketch izvrstan alat, te je bio strastven korisnik 3 godine; Samo mislim da Figmin pristup i set značajki osvaja ovu glavu.

Hvala na čitanju!