Figma es una herramienta de diseño de UI/UX con generación de código, maquetas de alta fidelidad y capacidades de creación de prototipos interactivos que se utiliza para diseñar aplicaciones, pantallas e ilustraciones vectoriales. Si bien es principalmente una herramienta basada en navegador que se puede usar en cualquier sistema operativo, también hay versiones de escritorio para Mac y Windows.
Figma siempre se ejecuta en línea, incluso si descarga la aplicación, por lo que es tan excelente para equipos regulares y distribuidos que desean colaborar en diseños en tiempo real. Varios miembros del equipo pueden realizar cambios en un proyecto en vivo y sus diseños siempre estarán sincronizados y actualizados para cualquiera que acceda a ellos.
Figma tiene una funcionalidad familiar para Adobe XD, Gravit, Sketch y otras herramientas de diseño similares. A pesar de estar basada en un navegador, la interfaz se verá como las que has visto antes. Muchas de estas herramientas funcionan de la misma manera y difieren cuando se trata de características específicas, como lo que se incluye de fábrica y para qué necesita los complementos. También manejan proyectos como maquetas de alta fidelidad y creación de prototipos de manera diferente.
Todo en Figma está basado en capas y cada mesa de trabajo está representada por una capa. Aléjese de la mesa de trabajo para obtener una vista panorámica de todo el proyecto en lugar de centrarse en un solo archivo a la vez. Hay un panel de información a la derecha y herramientas y un panel de capas a la izquierda.
Puede encontrar el panel de información un poco complicado, ya que a veces se requieren clics o pasos adicionales para manipular un objeto después de crearlo; de esta manera, Figma no es tan intuitivo como podría ser. El flujo de trabajo también puede ser un poco complicado, especialmente cuando se trata de reutilizar componentes y agregarlos desde su biblioteca.
Herramientas Figma
Figma tiene las herramientas que esperaría de un software de diseño, que incluyen:
- Alineación
- Cuadrícula de restricciones
- Comandos booleanos (join, intersect, union, rest)
- Selector de color
- Modo de fusión
- Múltiples rellenos
- Efectos (sombra gota/interior, desenfoque de fondo/capa)
- Herramienta de marco con tamaño personalizado o específico del dispositivo
- Máscaras
- Elementos de forma
- Herramientas de pluma y doblado
- herramienta de texto
- Bloquear y ocultar capas
- Herramienta Mover (puntero/clic para agarrar elementos)
- fijación
- herramienta Zoom
Una cosa que debe saber acerca de la herramienta de texto es que no puede desplazarse por las opciones de fuente ni ver vistas previas de la topografía. Es mejor conocer la topografía que desea utilizar cuando comience a diseñar.
Características notables de Figma
Profundicemos un poco más en algunas de las características destacadas de Figma:
- Bibliotecas: cree bibliotecas con componentes reutilizables y dé acceso a todo el equipo. Las bibliotecas de componentes están definidas por equipos, por lo que un equipo puede tener una biblioteca y otro equipo puede tener la suya propia. Cuando se actualiza un componente en la biblioteca, se realizan cambios en todos los diseños que lo utilizan. Al actualizar un componente en la biblioteca, confirmará para publicar el cambio para que no realice ningún cambio accidentalmente. (Las características de la «Biblioteca del equipo» son solo para planes pagos).
- Mover: al mover un objeto por el lienzo, las reglas mostrarán su altura y anchura.
- Escala: como de costumbre, la herramienta de escala mantiene todo en proporción. Lo que es exclusivo de Figma es que la escala es una herramienta individual . No tienes que mantener presionada la tecla Mayús cuando la usas. También puedes escalar desde el panel de información si lo prefieres.
- Redes de vectores : construya formas complejas, llamadas redes de vectores, adjuntando varios segmentos a un nodo en un vector (en lugar de solo dos, que es el estándar).
- Doblar: con la herramienta de doblar, puede agarrar y manipular una forma por cualquier borde, no solo por un punto.
- Imagen a forma: suelte una imagen directamente en una forma que cree. A medida que transforma la forma, la imagen permanecerá proporcionada en el interior.
- Herramienta Colocar imagen: las imágenes no se incluyen simplemente en el diseño. En su lugar, sostendrá la imagen en su cursor, luego haga clic para colocarla en su lugar. Si cambia el tamaño mientras lo mantiene presionado (sin mantener presionada la tecla Mayús), recortará la imagen en lugar de cambiar su tamaño.
Beneficios de Figma
Además de sus herramientas y algunas de sus capacidades únicas, los beneficios de Figma incluyen:
- Comenta directamente en el lienzo.
- Genere código CSS y SVG, iOS y Android
- Exportar como JPG, PDF, PNG o SVG
- Importar múltiples imágenes simultáneamente
- Importar archivos de Sketch
- Vinculación de objeto a mesa de trabajo
- Los atajos son similares a otras plataformas
- El historial de versiones está disponible
Ideación y diseño colaborativo
Figma es excelente para la creación de ideas, gracias a sus capacidades confiables para compartir y sincronizar. Si bien existen otras herramientas más adecuadas para la colaboración en pizarras digitales, como Mural , Figma lo hace bien en comparación con otras herramientas de diseño. Los equipos de Figma pueden incluir a todos los involucrados en un proyecto, como diseñadores, desarrolladores, gerentes de proyectos e incluso clientes.

Fuente: Figma
La naturaleza siempre en línea de Figma lo convierte en una especie de herramienta para compartir pantalla similar a Google Docs. Vea quién está viendo el documento en tiempo real. Los cursores están etiquetados para que sepa quién está haciendo cambios. También puede hacer clic en un avatar en la barra de herramientas para ver la perspectiva de ese miembro del equipo, lo que puede mejorar la comunicación. Compartir funciona de manera similar a Dropbox, y puede establecer permisos para editar o solo ver.

Fuente: Figma
Precios de Figma
Figma es gratis si tiene un pequeño equipo de dos y solo necesita trabajar en hasta tres proyectos a la vez. Más allá de eso, querrá el plan Profesional, que cuesta $ 12 por editor por mes, o el plan Organización, que cuesta $ 45 por editor por mes.
Cada plan viene con almacenamiento de archivos ilimitado y visores gratuitos. Los dos planes pagos también tienen editores y proyectos ilimitados, así como la capacidad de hacer proyectos solo por invitación. El plan Organización tiene características que las empresas más grandes encontrarán útiles, como la creación de equipos ilimitados, controles de acceso para enlaces y registros de actividad. Obtenga más información sobre los planes aquí .
Pensamientos finales
Las características de colaboración y accesibilidad multiplataforma hacen de Figma un ganador y un fuerte competidor para otras herramientas de diseño líderes. El historial de versiones y la edición en tiempo real sin necesidad de compartir archivos son particularmente útiles. Aunque el hecho de que sea una herramienta basada en navegador puede causar problemas de seguridad para las empresas más grandes, el plan de la Organización tiene funciones que abordan algunos de esos problemas.
En general, Figma es una herramienta de diseño con todas las funciones con las herramientas que esperarías, y también tiene algunas sutilezas adicionales. Si bien puede ser utilizado por el diseñador individual, es realmente útil para los equipos de diseño. También es excelente para los equipos de diseño que crean muchas versiones del mismo proyecto, así como para los nuevos diseñadores que desean familiarizarse con estas herramientas y controles sin pagar por el software.
¿Listo para explorar más herramientas gratuitas? Consulte nuestro artículo sobre GIMP, una alternativa de Photoshop gratuita y de código abierto.
Imagen destacada a través de PureSolution / shutterstock.com