Per què utilitzem Figma?

18 | 07 | 2021

#Design

4min

Com a agència Martech, ens agrada estar sempre a la última de les noves tecnologies. Per què? Perquè les eines que fem servir avui milloren la nostra productivitat i agilitzen el nostre workflow. La recerca de noves aplicacions o programes ens permet créixer en la nostra forma de treballar i, per això, fa uns mesos vam decidir incorporar una nova eina: el treball col·laboratiu de Figma.

Què és Figma?

Figma és una eina de disseny d'interfície col·laborativa que s'ha fet molt popular recentment, fins al punt que molts dissenyadors l'anomenen "el futur". No és millor o pitjor que Adobe XD o Sketch, perquè cadascuna té les seves virtuts i defectes, però Figma, amb tan sols uns pocs anys des de la seva aparició, ha aconseguit canviar la forma en la qual els equips treballen.

Col·labora amb el teu equip en temps real

El principal avantatge de Figma és que permet el treball de manera col·laborativa, és a dir, permet que diverses persones puguin col·laborar dins del mateix projecte simultàniament i en temps real, afegint comentaris o dissenyant. Els canvis es van guardant contínuament a l'arxiu de manera que els usuaris sempre veuen les últimes modificacions sense necessitat d'estar sempre sincronitzats o d'enviar documents. En definitiva, ajuda a que diversos usuaris puguin treballar, per exemple, en el disseny d'una app, de forma remota i simultània, comunicant-se entre ells i avançant en el resultat.

Treballa online o offline

Al principi, Figma funcionava només dins del teu navegador, en ser una aplicació web (SaaS o Software as a Service) que es pot utilitzar en sistemes operatius macOS, Windows i Linux. No obstant això, fa un parell d'anys van introduir les versions d'escriptori per a Mac i Windows, donant la possibilitat a l'usuari d'usar-la fora de línia.

Crea els teus components

Components... el terme preferit dels dissenyadors UI! Encara que desenvoluparem una mica més aquest tema en un altre article, explicat d'una manera senzilla, diríem que, quan hi ha un element que s'ha d'utilitzar en diverses pantalles, Figma ofereix l'oportunitat de convertir-lo en un "component" per a què qualsevol canvi que s’hi apliqui, quedi automàticament actualitzat a totes les pantalles. A més, permet modificar un dels elements específics d'una instància, sense alterar-ne d’altres però, alhora, sense trencar la relació entre totes les rèpliques. Això últim fa que sempre es pugui tornar a recuperar la còpia original.

Figma permet crear biblioteques de components reutilitzables als quals tot l'equip hi té accés. Els components li donen als dissenyadors un avantatge en qualsevol sistema de disseny existent i, quan un component s'actualitza a la biblioteca central, els canvis es realitzen en tots els dissenys. Finalment, Figma permet realitzar variants d'un component, la qual cosa és molt útil per generar els diferents estats de l'element. Per exemple, si tinc un component "botó", puc generar la seva variant "hover" i la seva variant "desactivat", que després podré seleccionar des del panell d'eines a la secció "variants".

Autolayout

Figma posseeix una eina màgica que es diu "Autolayout". Un AutoLayout és un Frame amb una característica especial, un marc dinàmic que s'adapta o s'ajusta segons els continguts que tingui al seu interior o al seu voltant. Els podem fer servir per crear botons, menús, caixes, cel·les, llistes o targetes amb qualsevol tipus d'informació. Tots aquests contenidors "estaran vius" perquè podran canviar de mida quan haurem d’afegir, treure o ordenar els elements que hi hagi a dins o que estiguin al voltant. Mai no vas pensar que seria tan fàcil generar els responsive d'un producte, oi? Amb Figma, ho és!

Plugins

Si en alguna cosa guanyava Sketch pel que fa a Figma era en la possibilitat d'instal·lar connectors en el programa. No obstant això, fa una mica més d'un any, Figma s'ha posat les piles i ha afegit el seu ecosistema de connectors. Els connectors o plugins són un gran aliat ja que faciliten la feina, ajuden a la integració amb d’altres serveis i, entre d’altres moltes coses, automatitzen algunes tasques. A més, qualsevol pot crear un plugin, així que, si no trobes el que funciona per a tu, pots crear-lo tu mateix.

Figmamirror

Passades algunes setmanes, va arribar l'esperada app per mobile: "Figma mirror". Tot i ser un simple mirror, era necessària per a complementar l'experiència, ja que resulta molt útil per visualitzar les interfícies que dissenyem per a telèfon, d'una manera més nativa i amb l'opció de navegar sobre els prototips. Aquesta app funciona perfectament per a la seva fi.

Figma Jam

Recentment, Figma va introduir aquesta eina que permet fer retrospectives d'equip, fluxos d'usuari, sessions d'ideació conjuntes, moodboards, prioritzacions, etc. Tal com el defineixen ells mateixos, FigJam és "una pissarra en línia per a què els equips puguin idear i fer brainstorming junts".

És fàcil d'aprendre

Figma té un canal de youtube on puja tots els tutorials sobre com utilitzar l'eina. Si tens curiositat i vols aprendre a usar-la, només has de posar play i practicar. En unes poques hores, ja seràs tot un expert!

Conclusió

Figma és una aplicació basada en navegador per a dissenyar interfícies que compta amb excel·lents eines de disseny, creació de prototips i generació de codi. Actualment, és (possiblement) l'eina líder en la indústria per dissenyar interfícies. A Digital Hamster, Figma és l'eina que triem per realitzar tots els nostres projectes. A què esperes per provar-la?

Autor/a:

María de la Paz Graziani

Publicat:

18 | 07 | 2021

Eines mencionades:

Adobe XD, Sketch, Figma, Figma Jam, Figmamirror

Col·laborador/a:

-

Actualitzat:

-

Fonts utilitzades:

Experiència professional

Mètodes d’Investigació UX Research
#Design

Mètodes d’Investigació UX Research

19 | 07 | 20213min
Parlem d’Atomic Design…
#Design

Parlem d’Atomic Design…

15 | 07 | 20213min