Per alcuni anni dalla sua uscita, Sketch ha rappresentato il non plus ultra come strumento per lo sviluppo di interfacce digitali, creando dei nuovi standard qualitativi nell’esperienza stessa della progettazione che ancora oggi sono considerati il meglio disponibile nel campo dello sviluppo di interfacce utente. Nonostante rappresenti ancora un software tra i più avanzati per lo user interface design, non è più però l’unico punto di riferimento per i digital designer. In particolare, il suo maggior concorrente, Figma, si sta imponendo come programma preferito dai designer. Sebbene sia di fatto un “figlio illegittimo” di Sketch, da cui riprende il layout e copia molte delle features fondamentali, è riuscito a ritagliarsi uno spazio notevole grazie ad alcune caratteristiche portanti che lo rendono più pratico da utilizzare rispetto a Sketch. Vediamone di seguito alcune, e come i due programmi differiscono tra di loro.
Figma, una derivazione di Sketch?
La somiglianza tra l’interfaccia Figma e Sketch è immediatamente evidente, e non è casuale: il modello creato da Sketch rappresenta ancora lo stato dell’arte da molti punti di vista, quindi i suoi concorrenti non hanno avuto bisogno di creare un sistema totalmente nuovo, ma solo aggiungere la propria sensibilità laddove necessario e migliorare gli aspetti che ritenevano privi di profondità o funzionalità. Anche se Figma è un’app basata su browser e non richiede alcuna installazione, la sua interfaccia ricorda evidentemente quella di Sketch, tanto che è facile importare i file da quest’ultimo in Figma e lavorare con una curva d’apprendimento minima, infatti se si conosce uno dei due sistemi, utilizzare l’altro è quasi automatico.
In sostanza, l’app Figma è una versione di Sketch basata su browser che ne ottimizza molti aspetti. Sono incredibilmente simili: sia Figma che Sketch hanno la canvas al centro, il pannello Proprietà a destra (chiamato Inspector su Sketch), il blocco con i livelli a sinistra, gli strumenti in alto e persino le stesse shortcuts da tastiera. Una delle poche differenze risiede nella terminologia: su Figma, le tavole da disegno sono chiamate frames, e i simboli di Sketch sono chiamati componenti.
Il confronto: solidità contro flessibilità.
Per cominciare, analizziamo le due caratteristiche vincenti di Figma, che per molti designer rappresentano il motivo principale per migrare da Sketch. Mentre quest’ultimo è un’app nata per Mac, Figma è una web app, di conseguenza non dipende dal sistema operativo per essere usato. Considerando i costi medi di un Mac, e come questi siano sì diffusi, ma non rappresentino la maggioranza dei device in uso, questo rappresenta un malus incredibile per la diffusione di Sketch. Al contrario Figma è non solo trasversale a qualsiasi sistema operativo, ma in più permette il lavoro in collaborazione sullo stesso file (secondo lo stesso principio di Google Docs per esempio) che è molto più funzionale rispetto alla stessa funzione di Sketch, laddove quest’ultimo ha problemi anche scaricando i plug-in adatti, in quanto non compatibile con gli altri sistemi operativi se non attraverso un percorso abbastanza laborioso. Da questo punto di vista, Figma vince a mani basse il confronto, ed è il motivo per cui ha guadagnato tanta popolarità dal momento della sua uscita. Un malus che purtroppo deriva da essere un’app web based, è però la necessità per Figma di lavorare sempre online, cosa che può risultare a volte complicata in condizioni di rete non ottimali.
Differente è il discorso per quanto riguarda la disponibilità di plugins. In questo caso, la maggior anzianità di Sketch rappresenta il punto vincente, sebbene anche Figma stia correndo ai ripari. Sketch può infatti vantare migliaia di plugin e funzionalità create da third parties (primo tra tutti Zeplin) che coprono praticamente qualsiasi aspetto del design che si possa immaginare, il che rende il programma in grado agevolare il lavoro del designer, offrendo soluzioni adatte alle sue necessità. Come abbiamo detto, Figma si sta adattando per ovviare al gap, ispirandosi sempre alle linee guida di Sketch, ma nonostante l’ottimo lavoro e la creazione continua di nuovi plugin e funzionalità, sta ancora scontando il fatto d’essere arrivato più tardi sul mercato rispetto all’illustre predecessore.
Il prezzo delle due app è un altro punto da analizzare. Figma certamente vince se si parla dell’entry level, in quanto offre una versione limitata gratuita, utilissima per chi volesse cominciare ad acquistare dimestichezza con il programma. Sketch offre un piano annuale da 99$ che include il diritto di utilizzare tutti i plugin e gli update senza limiti, oltre a poter salvare nel cloud i propri progetti. Al termine della licenza, sarà ancora possibile utilizzare il programma, ma gli update più recenti verranno erogati solo quando si pagherà di nuovo la rata. Per Figma, invece, si paga a seconda del numero di designers che lo utilizzano, con prezzi che variano dai 12 ai 45$ al mese. Soprattutto per gruppi di lavoro molto numerosi, questo rappresenta un costo molto oneroso a cui non tutte le aziende potrebbero o vorrebbero fare fronte.
Altro punto a favore di Figma, si possono creare stili indipendenti a seconda del Testo, Colore, Tratto ed Effetti. Questi stili possono essere applicati a qualsiasi livello, come si preferisce. Può essere applicato uno stile di testo e uno stile di colore, solo un’ombra o tutto insieme.
In Sketch non è possibile. Si hanno solo due tipi di stile utilizzabile: Testo e Stili di livello. Ogni proprietà diventa parte di quello stile. In Figma, tutti i cambiamenti possono essere operati con pochi e semplici comandi, mentre in Sketch è necessario un processo meno immediato e diviso su varie funzioni (ad esempio per cambiare colore è necessario combinare stili, simboli nidificati e altro ancora). L’approccio di Figma è molto più intuitivo e veloce.
Le funzionalità di prototipazione integrate in entrambi i kit di strumenti di progettazione consentono di vedere come gli utenti interagiranno con il prodotto software. In poche ore è possibile rendere cliccabile e interattivo il design statico in un unico spazio di lavoro. Figma ha implementato la prototipazione prima del suo concorrente, ottenendo un indubbio vantaggio su Sketch, sebbene anche quest’ultimo sia corso ai ripari colmando in parte il gap tra i due programmi, migliorando la piattaforma con una funzione di prototipazione integrata nel 2018. In passato, i designers potevano utilizzare il plug-in di InVision per creare prototipi su Sketch.
Un ultimo notevole vantaggio di Figma rispetto a Sketch è che consente ai designer di aggiungere transizioni e animazioni avanzate al design. I prototipi realizzati attraverso Figma permettono di ottenere una visione più chiara e vivida di come funzionerà il loro prodotto.
L'opinione del nostro team.
Anche il nostro team di UI/UX ha voluto dare la sua opinione riguardo al confronto tra i due programmi. Si nota ancora una certa propensione verso Figma, ritenuto più versatile rispetto alla controparte. Sketch viene apprezzato soprattutto perché la gestione dei simboli di Sketch ci risulta ancora la più comoda e immediata in quanto il software crea automaticamente una pagina adibita agli “asset madre” favorendo la produzione di un file ordinato e un aggiornamento veloce delle componenti. Come contro, viene fatto notare che Sketch non permette la navigazione tra file differenti tramite tab bensì in finestre differenti e questo è sicuramente un minus.
Un discorso più articolato viene fatto per quanto riguarda Figma. Tra i plus che i nostri designers apprezzano, troviamo, Il passaggio tra progetti differenti favorito dalla navigazione a tab, il Selezionare un gruppo di oggetti che permette di visualizzarne la palette colori, la Gestione dell’allineamento degli elementi in gruppo anche senza artboard, la Funzione “send to back” e “bring to front” degli elementi, il Figjam (più funzioni, un unico software), l’Anteprima prototipo al volo, la Prototipazione più potente e completa, il Sistema Variant più potente per la gestione del design system.
Non piacciono invece alcuni aspetti. Sarebbe comodo implementare la stessa gestione delle componenti di sketch, per non doverle disporre attivamente su un’altra pagina, utilizzare componenti di una libreria per velocizzare il processo di design di un progetto, processo che non faciliterà necessariamente anche la produzione del prototipo, in quanto i componenti della libreria non possono essere collegati a quelli del file di lavoro. Infine, il sistema d’Import di file Sketch non è ottimizzato.
In generale, vediamo come Figma abbia i numeri per imporsi, anche se Sketch non si lascerà scalzare facilmente dalla sua posizione di dominio. Converrà tenere d’occhio anche altri programmi come adobe XD che stanno apportando migliorie continue, e potrebbero rappresentare alternative di un certo livello ai due programmi descritti nell’articolo. Per quanto visto, comunque, la gara al momento è principalmente tra la flessibilità di Figma e la solidità d Sketch.
E voi, cosa ne pensate? Avete una preferenza per uno dei due programmi?
Immagini da Creative Commons e da NordWood Themes su Unsplash