Figma es una herramienta que permite a diseñadores de producto, diseñadores UX y de UI, generar interfaces, prototipos y especificaciones técnicas en la ideación y creación de productos digitales.
En esta entrada, se recopila un listado de los mejores plugins de Figma para diseñadores para diferentes momentos del proceso de diseño. El objetivo principal es el de automatizar tareas manuales para agilizar partes del proceso.
Plugins para Figma recomendados para diseñadores
El número de plugins que se pueden descargar de forma gratuita ha crecido considerablemente. A continuación un listado de plugins para Figma muy recomendables y que ahorran bastante trabajo.
Todos los plugins se pueden gestionar desde el menú superior en el apartado plugins de Figma. Aunque en esta entrada se incluye enlace directo.
- LCH
- Stark
- Font Scale
- Lorem Ipsum
- Autoflow
- Image Palette
- ABLE
- Iconify
- Contrast
- Design System Organizer
- Master
- Hide Layer from Instances
- Similayer
- Batch Styler
- Token Studio for Fimga (Figma Tokens)
- Unsplash
- Chart
- EightShapes Specs
Interesante, también, conocer los mejores sistemas de diseño y Kits UI gratis para Figma. Si por el contrario, Figma no es la herramienta que buscas, conoce herramientas gratis para hacer Wireframes y prototipos.
Listado de Plugins para Figma
A continuación el listado de plugins para Figma con enlace directo. Se trata de un recopilatorio que intenta englobar los Plugins que más pueden agilizar el trabajo diario de un diseñador de producto, diseñador UX o diseñador UI.
1. LCH
Con este Plugin para Figma podremos seleccionar el color usando el espacio LCH con facilidad. Ayuda a simplificar la creación uniforme de los sistemas de colores.
2. Stark
Ayuda a crear y probar la accesibilidad de los diseños de una manera bastante rápida. Con herramientas como Contrast Checker, Focus Order, Alt-Text Annotations, Vision Simulator y más, todo en un sólo lugar, podemos encontrar problemas de accesibilidad en un diseño antes de que entre en producción, o analizar y corregir rápidamente lo que ya está en proceso.
3. Font Scale
Font Scale es una herramienta rápida para generar una jerarquía tipográfica armoniosa y consistente. Esto es especialmente útil cuando se desea mantener iguales las proporciones entre el texto del cuerpo y los encabezados.
4. Lorem Ipsum
Este Plugin para Figma rellenará todas las capas seleccionadas con texto de relleno. No es más que un texto ficticio, que rellena con la cantidad de caracteres necesarios para ajustarse al marco que ya existe.
5. Autoflow
Autoflow es un Plugin para Figma realmente útil si necesitas crear flujos automáticamente. Dispone de detección automática de obstáculos, anotaciones de texto en la ruta, actualización del movimiento, etc. Muy útil para realizar User Flow o flujos de usuario.
6. Image Palette
Extrae una paleta de colores de 5 colores diferentes de las imágenes seleccionadas. Este Plugin utiliza un algoritmo de corte mediano, que se aproxima aproximadamente a los diferentes colores más destacados de la imagen
El algoritmo es rápido, pero a veces puede generar resultados inusuales, como imágenes de bajo color, imágenes de gráficos vectoriales, etc. Es posible que los colores extraídos no coincidan exactamente con los códigos hexadecimales de la imagen.
7. ABLE
Un Plugin para Figma que ayuda a comprobar el contraste para cumplir con los requisitos de accesibilidad. También tiene en cuenta el daltonismo. Muy útil y recomendable.
8. Iconify
Un Plugin que Importa iconos de Material Design, FontAwesome, Jam Icons, EmojiOne, Twitter Emoji y muchos otros iconos (más de 100 conjuntos de iconos que contienen más de 100,000 iconos) al documento Figma como formas vectoriales.
9. Contrast
Permite ejecutar rápidamente un informe sobre el contraste y evaluar la accesibilidad del diseño. Es rápido y sencillo, seleccionamos las capas y ejecutamos el plugin o comando de ejecución rápida para ver el informe.
10. Design System Organizer
Interesante Plugin que perminte mover o intercambiar componentes, instancias y estilos entre librerías y diferentes archivos.
11. Master
Crea, adjunta, clona y mueve componentes de forma rápida y sencilla con un par de clics sin perder la variaciones y propiedades. Permite crear componentes y sus variantes a partir de Frames.
12. Hide Layer from Instances
Todos nos hemos encontrado con casos en los que necesitamos agregar algo a un componente pero no queremos que eso aparezca en los cientos y miles de instancias existentes. Finalmente terminamos creando un nuevo componente para que el trabajo existente no se vea afectado. Este Plugin para Figma resuelve este problema con un solo clic.
13. Similayer
Este Plugin permite seleccionar capas similares teniendo en cuenta una amplia gama de propiedades. Después de seleccionar una capa y ejecutar este Plugin, podremos seleccionar las propiedades específicas para realizar una selección múltiple.
14. Batch Styler
Si necesitas cambiar los valores de varios estilos ya sea texto o color o texto y color a la vez, este es el Plugin de Figma que necesitas. No importa si hay 2 o 30 estilos de texto, es posible cambiar de Inter a Roboto pero manteniendo todos los pesos de fuente y otros estilos.
Cambiar los colores que se basan en el mismo valor de tono también es fácil: Batch Styler actualizará todos los estilos en consecuencia.
15. Token Studio for Fimga (Figma Tokens)
Este Plugin ayuda a ahorrar tiempo a los equipos proporcionando mayor control y administración en los sistemas de diseño. La finalidad principal de la herramienta es la de aplicar, administrar y sincronizar los Tokens de diseño de Figma a una fuente de la verdad externa.
16. Unsplash
Ofrece fotografías de diferentes categorías, como animales, arquitectura, naturaleza, retratos, tecnología, etc. Es uno de los complementos o plugins más instalados en Figma. Ofrece más de 1 millón de imágenes gratuitas en su base de datos. Imágenes de alta calidad para los diseños y gratis.
17. Chart
Chart es un complemento para Figma que utiliza datos reales o aleatorios para crear los gráficos más populares. Chart admite copiar y pegar desde editores como Excel, Numbers, Google Sheets, conexión en vivo con Google Sheets y JSON remoto (API REST), archivos locales CS.
18. EightShapes Specs
Este Plugin para Figma ayuda a automatizar la producción de especificaciones de diseño de componentes, instancias y marcos seleccionados.
Las especificaciones incluyen: anatomía con capas marcadas y dependencias anotadas, propiedades de instancia y otros atributos invariables. Diseño y espaciado de capas con diseño automático, descripción de atributos y anotación de ilustraciones con marcadores y líneas, etc. entre otras muchas especificaciones.
