Evvivma la Figma.

Come un tool può sostituire cinque software professionali contemporaneamente e mettere d’accordo tutti.

Francesco Cutolo
7 min readFeb 23, 2018

Il mondo degli strumenti per fare design di interfacce negli ultimi anni (mesi?) ha visto una moltiplicazione quasi preoccupante degli attori che propongono tool per progettare interfacce.
Le soluzioni vanno dall’interessante all’evanescente; tutte però condividono l’obiettivo di aiutare il designer nel creare un flusso di lavoro che includa i passaggi antecedenti e successivi a quello della pura esecuzione, in modo da ottenere un’ecosistema di produzione che inizi dal wireframing e la gestione degli assets finendo all’handoff e la prototipazione.

Tutti i nuovi tool stanno provando a ridurre la frammentazione dell’ambiente di progettazione nella quale lavoriamo attualmente, provando a vendersi come l’ennesimo software definitivo per fare design.
Una visione fin troppo ottimistica del mondo che molti amici e colleghi si portano dietro da almeno un decennio, periodo in cui nei corridoi dell’università sentivo persone desiderare un abominio capace di gestire raster, vettori e impaginazioni contemporaneamente (mi piace immaginarlo col nome Adobe InIllushoppator).

Capita però, di tanto in tanto, che un prodotto riesca davvero a infilarsi tra le pieghe del quotidiano riuscendo a fare abbastanza bene le tante cose che facevi prima e dannatamente bene quell’unica cosa che desideravi come l’acqua. Un buon esempio è quest’articolo che motiva il successo di Nintendo Switch perché è “good enough” in una caratteristica che i videogiocatori attendevano da vent’anni: giocare bene in mobilità.

Quanto ti adoro.

Capita che uno provi Figma

Figma non dovrebbe esistere. Perché è gratis, non è necessario che sia installato o aggiornato, ha una curva di apprendimento più morbida delle animazioni di James Curran ed in grado di inglobare senza difficoltà quasi tutti i passaggi esistenti e le figure lavorative necessarie prima e dopo la semplice esecuzione di un progetto; ma soprattutto (se siete dell’ambiente lo sapete già) permette di lavorare sullo stesso file a più persone. Contemporaneamente.

La condivisione dei progetti non è una feature, è una rivoluzione copernicana; e non solo per la possibilità di dare visibilità a tutto il team, coinvolgere più attivamente chi commenta, critica o prende decisioni ma anche per una distribuzione più bilanciata e comunicativa tra designer.

Perché dobbiamo ammetterlo: il controllo versione non fa parte della nostra mentalità. Abstract, Folio, Plant o il versioning tramite Git non è nelle nostre corde, noi vogliamo vedere cosa stanno facendo le altre persone sul progetto, contribuire, risolvere, discutere in tempo reale. Subire o far subire passivamente le modifiche attraverso un push o un pull non risolve il problema della collaborazione alla radice, rende solo più veloce lo scambio di dati così come sono stati scambiati negli ultimi trent’anni.

Nonostante ci sia già tanta letteratura in lingua inglese in proposito e sembra sia posizionato in maniera solida nel lavoro quotidiano di tanti team, la percezione di Figma, almeno della community che usa la lingua in cui sto scrivendo è quella di un’entità estranea, hipster e non adatta al vero business.
E lo credevo anche io, fino al momento in cui mi son tuffato, con l’aiuto della mia fidanzata, nella speed-run di una landing page. Il risultato è stato impressionante, al netto di alcuni rallentamenti dovuti al fatto di non aver mai lanciato prima il programma.
Nessun conflitto.
Nessun rallentamento.
Qualche freeze del software dovuto alla nostra frenesia ma nessuna perdita di lavoro.

Non ero così preso dalle potenzialità di un software dai tempi di Flash Catalyst (prendetemi pure in giro) ed ho deciso che, come tutti i miei cambiamenti, lo avrei affrontato in maniera netta e senza guardare indietro. Evitare periodi di transizione mi aiuta a non avere essere attratto dal comfort dell’abitudine.
L’ho fatto nel 2012 dopo aver provato Spotify cancellando le canzoni che avevo su iTunes.
L’ho fatto l’anno scorso disabilitando per sempre il mio account Dropbox e passando al piano a pagamento di Google Drive.
Così ho fatto per Figma: da una settimana non avvio Sketch, sto preparando quasi 50 slide senza aprire Keynote, ottengo feedback dai sales manager senza caricare nulla su InVision, chi si occupa del copywriting può lavorare direttamente sui testi segnaposto, la stagista può lavorare senza la pressione di essere avvoltoiata come da tradizione.

Fonte: http://hoveringartdirectors.tumblr.com/

Lasciar andare i vecchi amori

Uno dei prodotti che ho utilizzato di più nell’ultimo anno è Freehand di InVision. Una lavagna bianca sulla quale tutti possono scrivere o disegnare qualcosa in maniera collaborativa è la base del nostro lavoro; sarebbe superfluo aggiungere quindi che fare tutto questo in digitale è un vantaggio indescrivibile per chi non ha a disposizione spazi e tempi giusti.
Con Figma ho potuto sostituire Freehand e trasferire moodboard, schizzi, commenti e microframes all’interno dello stesso file dove finiranno anche i primi accenni di UI. Avere già i wireframes in Figma esalta quello che forse la feature più vantaggiosa e riconosciuta del prodotto: i componenti.

Dall’esterno, i componenti di Figma possono essere visti come l’equivalente dei simboli di Sketch. In realtà, essi sono (usando un termine da atomic design) delle molecole molto più flessibili e indipendenti: non dipendono dalla misura del frame nel quale vengono “incastonati” e permettono di modificare lo stile degli elementi presenti nelle loro istanze.
Il risultato si traduce nell’opportunità di creare un componente durante la fase di wireframing e portarselo dietro fino alla delivery finale riuscendo, nel frattempo, ad avere una libreria di pattern snella e senza duplicare inutili stili.

I componenti, uniti alla già citata e sconvolgente possibilità di collaborare, da soli forse varrebbero il biglietto di sostituire Sketch, nonostante nell’elenco dei contro siano presenti due caratteristiche non da poco come il supporto della community dei plugin e la compatibilità con i programmi di prototipazione più diffusi.

Vuoi mettere però la fluidità di tutto ciò?

Dopo aver lasciato andare a malincuore Freehand e Sketch, è arrivato poi il momento di salutare Craft e Invision.
Non una cosa leggerissima, considerato che la consegna del progetto tramite un prototipo navigabile, nella sua semplicità, è stato uno dei mutamenti più clamorosi delle nostre abitudini, così come la possibilità di ricevere feedback e aggiornare dinamicamente le schermate.
Anche in questo caso, Figma riesce a prendere il meglio dei prodotti che vorrebbe sostituire: linkare le schermate, ottenere l’url da condividere ed gestire feedback è, seppur limitante, perfettamente immediato.

Questa dinamicità è stata in grado, ad un certo punto, di lasciar andare anche Keynote: la modalità preview è tutto ciò di cui uno ha bisogno per preparare delle slide visivamente impattanti, senza dover scendere a patti con i rudimentali (pur sempre accettabili) strumenti di design del software Apple.

Nella vita reale

Cinque software in uno, con tutti i compromessi del caso e la necessità di “venderlo” a chi poi questo software dovrà utilizzarlo con te.
Forse il miglior selling-point di Figma è l’accoglienza minimale della sua interfaccia: il suo layout è praticamente uguale a Sketch (già di suo molto amichevole e rivoluzionario nel suo presentarsi come un programma di grafica semplice) con ancor meno strumenti a vista.

Ho osservato da vicino due account avviarlo per la prima volta e costretti a darmi i feedback su un progetto direttamente su Figma: è stato quasi tutto naturale, come se lavorassimo in quel modo da mesi. Stessa cosa accaduta alla junior designer al suo primo giorno di lavoro; questa ragazza è un utente windows e non aveva mai lavorato con Sketch prima d’ora. Ho approfittato della situazione per farle fare un salto a piè pari direttamente su Figma (da Illustrator!) ed è incredibile come si sia trovata subito a suo agio nonostante non si sia addentrata nelle funzionalità più avanzate.

La domanda quindi è: perché tu che stai leggendo non hai migrato verso Figma?
Non avere paura di venderlo ai tuoi product manager, al tuo CTO o chi per loro. Se ne innamoreranno anche loro perché possono usarlo anche loro.

L‘unica sfortuna di Figma è di aver raggiunto adesso la propria maturità mentre tutti noi stiamo consolidando già un nuovo flusso di lavoro dopo anni di transizione indecisa da Photoshop, sempre pronto a tirarci per il collo ad ogni occasione valida. Oggi come oggi, il pentacolo Freehand (o qualsiasi altro strumento per il wireframing rapido) + Sketch + Craft + InVision + Principle (Flinto per me, grazie) è il workflow presente nella maggior parte dei team di design e che difficilmente vedrà ulteriori rivoluzioni in tempi brevi, nonostante la frenesia collettiva che ha monopolizzato la conversazione della community nell’ultimo periodo.

Le comprensibili implicazioni, in tal senso, sono principalmente economiche e organizzative. Il costo combinato di questi cinque software è di circa 350 € all’anno, al quale va aggiunto il tempo (che è pur sempre denaro) dell’apprendimento, del margine d’errore e della formazione delle persone che useranno questi software. Strategist, product e project manager, account, referenti del cliente: spaesare queste figure spesso può intaccare il valore del nostra proposta quasi quanto un’esecuzione non valida.

Figma, in questo senso, sembra una scommessa che sembra coprire ampiamente il rischio. Almeno fino alla prossima rivoluzione.

--

--