¿Qué es Figma? La app de UI y UX que deberías conocer

Lo mismo sucede si estás estudiando para trabajar en diseño y prototipado. Durante tus estudios superiores de desarrollo y diseño, como el Máster Online en Diseño de Apps: UX y UI de ESDESIGN, abordarás todo lo relacionado con el prototipado de interfaces de usuario. Y sobre el manejo de herramientas de prototipado específicas, como Figma. ¿Quiéres saber para qué sirve exactamente? Descúbrelo.

¿Qué es Figma?

Figma es una herramienta de software muy popular entre estudiantes y profesionales del prototipado web y de apps. Es una de las utilidades que se centran en facilitar el diseño y prototipado de interfaces, que viene inmediatamente después de las fases de concreción de la idea y de investigación.

A diferencia de lo que sucede con otras herramientas de prototipado por ordenador, Figma no requiere ninguna instalación previa. Se trata de una utilidad de prototipado web, que también permite realizar tareas de edición de gráficos vectoriales, alojada en la nube. También cuenta con una versión de descarga para su instalación en el ordenador, así que si lo deseas, o no cuentas con conexión a Internet, en todo momento puedes trabajar con Figma sin ella.

Gracias a esta prestación, quienes estén utilizando Figma pueden compartir sus trabajos y diseños con terceros y miembros del equipo de diseño. Estos también accederán a él con el ordenador, y sugerir o realizar modificaciones en el proyecto si lo desean.

Su funcionamiento es bastante intuitivo y, además, si en algún momento has utilizado herramientas como Sketch, podrás comprobar que sus funciones y paneles son muy parecidos. Por lo tanto, no te resultará complicado utilizarlos. Además de prototipar, con ella podrás editar gráficos vectoriales y maquetar piezas digitales. También las interactivas. Incluso podrás ampliar sus funciones a través de plugins. Es compatible con diversos formatos estándar, entre los que están JPG y PNG, y permite compartir creaciones y guardar diseños y prototipos en la nube.

Figma funciona a partir de páginas, lo que permite a sus usuarios alojar todos los elementos que forman parte de un diseño agrupados en un mismo fichero, clasificados en distintas páginas. Esto quiere decir que podrás reunir plantillas, paletas de colores y otros elementos en una carpeta. Quizá una de sus principales desventajas es que se trata de una herramienta de pago, pero no obstante cuenta con una versión gratuita, que como en todos estos casos tendrá menos opciones disponibles.

¿Qué funcionalidades tiene Figma para UX y UI?

La herramienta Figma tiene todo tipo de funciones para UX (Experiencia de usuario) y UI (Interfaz de usuario). Permite generar wireframes y mockups, así como prototipos, de ahí su importancia para los diseñadores y prototipadores.

La aplicación cuenta con un paquete de utilidades y funciones para crear wireframes que prácticamente cualquiera puede utilizar. Incluso con poca experiencia, y con escasos conocimientos sobre prototipado. Por ejemplo, cuenta con plantillas para simplificar los primeros pasos en el diseño de una interfaz de usuario. Por tanto, no solo permite crear elementos de mayor calidad de cara a los usuarios. También da facilidades a los que los desarrollan, lo que mejora su experiencia como usuarios.

En cuanto a los mockups, que se pueden considerar como la evolución de los wireframes, Figma permite elegir los tipos de letra que quieras utilizar en ellos, así como definir sus colores y las dimensiones de sus elementos. También de manera sencilla. Además, podrás mostrarlos a quien desees solo con enviar un enlace, independientemente del sistema operativo o dispositivo que utilice para ello. Basta con tener un navegador y acceso a Internet.

Uno de los elementos de los que dispone Figma, que los diseñadores UX/IU encontrarán más útil, es el uso de marcos de dimensiones predefinidas. Esto es, de cuadros con las de distintos dispositivos. Cuenta con las de varios modelos de iPhone, así como de genéricos para Android en tamaño pequeño o grande. También ofrece plantillas para tablets y equipos de escritorio. Para comenzar con un diseño, solo es necesario elegir uno de estos marcos, o crear uno con las dimensiones concretas que se necesitan, y utilizarlo como un contenedor para los elementos que tendrá la interfaz de la app o la web a diseñar.

Aparte de esto, ofrece un listado de estilos y elementos comunes en interfaces, como botones e iconos, que se pueden integrar en un diseño solo con colocarlos donde se necesite, con la opción de modificarlos. También cuenta con selección inteligente, para seleccionar varios elementos al mismo tiempo, y hacer cambios en todos a la vez.  En unos cuantos movimientos, la interfaz quedará lista para empezar con el UX writing.

¿Cómo es el prototipado web que ofrece Figma?

En cuanto al prototipado web, Figma permite desarrollar las distintas pantallas de las páginas de un sitio web con la misma facilidad que una aplicación. Es decir, para crear la interfaz de usuario de la web. Al contar con marcos predefinidos de distintos tamaños, se puede diseñar tanto para su visualización en navegadores de escritorio como en los de dispositivos móviles.

Los elementos que incluye también se pueden utilizar para colocar botones, iconos y otros objetos e indicadores en el punto en el que quieres que aparezcan. Todo, de manera muy similar a como se hace en el caso del diseño de prototipos de apps con Figma.

Figma vs. Sketch vs. Adobe XD: ¿Cuál es mejor?

Una de las ventajas de Figma con respecto a Sketch y Adobe XD es que no es necesario instalarla; se puede usar su versión en la nube. Así, tampoco habrá que actualizarla ni mantenerla. Esto permite compartir proyectos con terceros, que hagan cambios, y llevar un control de los mismos con facilidad. Por no hablar de la versatilidad que da poder acceder a tu trabajo en la nube desde cualquier parte con acceso a Internet. Además, no será necesario pagar por utilizarla para realizar determinadas operaciones, ya que cuenta con una versión de prueba. Las otras dos, no.

Para utilizar Sketch en el desarrollo de interfaces web tendrás que tener antes un cierto dominio del programa, algo que no sucede con Figma. Es una herramienta tan intuitiva que prácticamente podrás ponerte a crear prototipos al poco tiempo de empezar a utilizarla.

En cuanto a la animación de interacción en la web diseñada, en Sketch tienes que hacer una réplica para poder generar una interacción, mientras que con XD es más sencillo. Una vez más, Figma ofrece más facilidades y muchas posibilidades para hacerlo. En otro orden de cosas, la comunidad de usuarios de Figma es mucho mayor y más activa en el desarrollo de recursos y compartición de contenidos y trucos que las comunidades de las otras dos.

Esto es todo lo que te ofrece Figma de cara al prototipado, tanto de apps para Android o iOS como de páginas web. Así que si quieres diseñar aplicaciones y páginas, ¡exprime sus funciones sin pensarlo!