Ahora que los desarrolladores representan un tercio de su base de clientes, Figma ha lanzado una serie de nuevas capacidades que tienen como objetivo cerrar la brecha entre el diseño y el desarrollo para su aplicación de diseño de productos.

Han sido unos meses importantes para Figma. El anuncio de la adquisición planificada de Adobe de la herramienta de diseño web colaborativo dio mucho que hablar en septiembre pasado, y la compañía lanzó esta semana la conferencia anual más grande de su historia. Config 2023 es el primer evento presencial de Figma desde 2020, y aunque el evento previo a la pandemia atrajo a 1000 asistentes, la edición de este año en San Francisco cuenta con más de 8000.

Durante su discurso de apertura, Figma anunció un montón de nuevas herramientas y funciones, todas orientadas a su misión de "hacer que el diseño sea accesible para todos". El principal de ellos es un nuevo modo de desarrollador, destinado a cerrar finalmente la brecha entre diseñadores y desarrolladores.

Aunque Figma es una herramienta de diseño, más de un tercio de los usuarios activos semanales de la plataforma se identifican como desarrolladores, explicó Avantika Gomes, líder de producto de Figma.

“Siempre he encontrado esta estadística increíble porque cuando consideras que Figma es en realidad una herramienta de diseño de productos creada para diseñadores de productos y, sin embargo, vemos un gran volumen de desarrolladores que nos visitan por estar basado en la web nos ha abierto a más colaboradores, como desarrolladores”, dijo.

Dev Mode

Dev Mode permite a los diseñadores y desarrolladores trabajar en los mismos diseños en el mismo archivo, pero en diferentes modos. Está diseñado para proporcionar a los desarrolladores una interfaz separada para trabajar, lo que les facilita el acceso a información importante y elimina la necesidad de actualizaciones de versión o conversaciones de ida y vuelta con sus homólogos diseñadores.

Dev Mode también permite a los desarrolladores generar fragmentos de código CSS, iOS y Android listos para la producción y conectarse a herramientas como Jira, GitHub y Storybook para automatizar los flujos de trabajo. Los usuarios también podrán vincular los sistemas de diseño en Figma con el código y la documentación de los componentes, inspeccionar los archivos de Figma, colaborar con los diseñadores y recibir notificaciones sin salir del editor de código.

Finalmente, los desarrolladores podrán usar etiquetas para rastrear el estado del diseño y organizar los archivos de diseño según su etapa de desarrollo y comparar rápidamente los cambios.

En el pasado, Figma ha tenido problemas para tratar de mejorar la plataforma para los diseñadores sin alienar a los desarrolladores que se han convertido en una sección cada vez mayor de la base de usuarios de la plataforma, dijo Sho Kuwamoto, vicepresidente de productos de Figma. Agregó que uno de los beneficios de Dev Mode es que los desarrolladores ahora pueden obtener lo que necesitan en un espacio separado y optimizado que es único para ellos.

Introducción de variables y prototipos avanzados

Además del Modo Dev, Figma también está agregando variables y prototipos avanzados a la plataforma. Al igual que las variables que existen dentro de la codificación, valores que pueden cambiar según las condiciones o la información ingresada por un desarrollador, Figma ha introducido variables de diseño que permiten a los equipos optimizar el proceso de creación y mantenimiento de múltiples marcas, dispositivos y temas. Las variables de Figma también admiten tokens de diseño: fuentes únicas de verdad a las que los diseñadores y desarrolladores pueden hacer referencia para aplicar elementos de la interfaz de usuario de manera consistente, como el color o el tamaño.

Por ejemplo, Kuwamoto explica que, si existen versiones de modo claro y modo oscuro de una interfaz de usuario, en lugar de hacer clic manualmente en cada elemento de diseño individual para alternar entre los dos modos, con variables, estos elementos ahora se pueden agrupar en regiones que se pueden combinar.

La creación avanzada de prototipos brinda a los usuarios una forma mejorada de crear prototipos más realistas dentro de Figma, minimizando la necesidad de que los usuarios vayan y vengan entre herramientas o ventanas separadas, ya que ahora pueden diseñar y probar su prototipo en el mismo lienzo.

“La creación avanzada de prototipos permite a los usuarios crear el prototipo más realista posible, y cuanto más realista pueda hacer ese prototipo, mejores resultados obtendrá”, dijo Kuwamoto.

Figma también está lanzando actualizaciones para su herramienta de diseño automático, lo que permite a los usuarios crear diseños totalmente receptivos, mientras que su selector de fuentes mejorado filtra y localiza las fuentes más rápido con su nueva funcionalidad de menú, búsqueda e índice visual. Además, el navegador de archivos rediseñado de Figma proporciona una nueva interfaz de usuario que ayuda a los usuarios a encontrar rápidamente archivos, proyectos y notificaciones compartidos.

Dev Mode está en versión beta abierta y se puede probar gratis todo 2023. A partir de 2024, habrá una opción para comprar acceso a Dev Mode solo por USD$25 por usuario/mes en Organización y USD$35 por usuario/mes en Enterprise.

Las variables estarán disponibles en versión beta abierta a partir de hoy, aunque las características varían entre los planes Profesional y Organizacional. La creación avanzada de prototipos está disponible a partir de hoy para los usuarios del plan Profesional y superior.

Y, por supuesto, esta no sería una conferencia de diseño en 2023 sin alguna mención a la IA. Pero en lugar de solo formular hipótesis sobre los efectos potenciales de la IA en los flujos de trabajo de diseño, Figma tiene un anuncio más concreto: la adquisición de la utilidad de diseño impulsada por IA Diagram. Figma abordará más sobre su incursión en la IA en próximas semanas.

i’m so excited to share that @diagram has been acquired by @figma

where it all began 👇 https://t.co/LFrRCJU2pt
— jordan singer (@jsngr) June 21, 2023