Hola equipo de diseño y desarrollo. ¿Cansados de descargar assets de Figma, renombrarlos como si fuerais personal de limpieza digital y moverlos entre repos cruzando los dedos para que nada reviente? Imaginad que estáis en pleno sprint, llega una actualización rápida del diseño y de pronto jugáis al tetris de recursos para Android e iOS en varios mercados. Resultado clásico: iconos desincronizados, pixeles feos y el eterno funciona en mi máquina. Todos lo hemos sufrido y es tan entretenido como depurar un navegador obsoleto.
Ahora bien, existe un movimiento ninja para cambiar el juego. Entra n8n, plataforma open source de automatización de flujos estilo Zapier muy potenciada. La idea: sincronización sin toque humano de assets de Figma hacia tus repos móviles, activada por un simple comando en chat. Sin entregas manuales. Añadimos chequeos de calidad con IA, detección de deltas para procesar solo cambios reales y creación automática de PRs en Bitbucket. Un flujo manos libres para diseñadores, design ops y squads de ingeniería. Al terminar esta guía tendrás una canalización que entrega assets por mercado y plataforma como un shuriken bien aceitado.
En Q2BSTUDIO impulsamos esta clase de automatizaciones extremo a extremo para aplicaciones a medida y software a medida, combinando inteligencia artificial, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio y power bi. Si buscas IA para empresas y agentes IA integrados en tus procesos, explora nuestra oferta en inteligencia artificial o sube de nivel tu orquestación con automatización de procesos.
Qué vamos a construir: un flujo n8n guiado por chat que entiende comandos del tipo revisar actualizaciones Figma para GOPH o quality check all markets TDS-200, interpreta la intención, exporta solo los assets relevantes por mercado, detecta cambios, aplica análisis visual con IA si se solicita y entrega automáticamente a repos Android e iOS con ramas, commits y PRs generados. Notificaciones por Slack o chat, auditoría en Postgres y posibilidad de programarlo por cron. Selectivo, eficiente y extensible, ideal para apps multi mercado.
Arquitectura resumida en una frase: el usuario envía un comando en chat, n8n interpreta acción, mercados, alcance y ticket, divide por mercado, prepara entorno, exporta desde Figma con config específica, calcula deltas, ejecuta checks opcionales de calidad con IA, y si hay cambios los publica en repos Android e iOS creando ramas, commits y PRs, notificando y registrando métricas.
Esto no es teoría hueca, sino una implementación realista y probada en producción con n8n. Empezamos por chat por su flexibilidad, pero el mismo flujo puede ejecutarse de forma programada.
Chat e intención con filtros de ejecución: el disparador es un chat o webhook conectado a Slack, Discord o tu herramienta interna. Los usuarios envían frases naturales como check goph tds-100, quality check all markets o full pipeline slsa new_only. Un nodo LLM extrae los parámetros clave: acción como check_updates, analyze_quality, find_duplicates, generate_report o full_pipeline; mercados como GOPH para Filipinas, GOSA para Sudáfrica o SLSA; alcance como new_only, modified_only o all_assets; ticket opcional tipo TDS-123; y un nombre de rama autogenerado con la forma feature barra ticket guion acción guion mercados guion versión, por ejemplo feature barra TDS-100 guion update guion goph guion v1.2. Si el LLM falla, una función con expresiones regulares toma el relevo como red de seguridad.
Nombrado de ramas de forma práctica: combina el ticket si existe, la acción, los mercados concatenados con guiones y una versión obtenida del changelog para mantener orden y trazabilidad. Ejemplo de entrada check ph tds-100 produce la rama feature barra TDS-100 guion check guion goph guion v1.0.
Entorno y exportación desde Figma: el flujo monta un ambiente ligero para exportar recursos, apuntando a carpetas como Icons, Integration Logos, Pictograms y Other. Se instala de forma idempotente lo necesario, por ejemplo librerías Python como Pillow y la CLI figma export. Cada mercado utiliza su propia configuración, por ejemplo un archivo .figmaexportrc punto mercado punto js que define fileId, token y destino de salida. Las credenciales se guardan en n8n como secretos o variables de entorno tipo FIGMA_TOKEN, nunca en claro.
Detección de deltas y preproceso: en lugar de exportar a ciegas, un paso en Python calcula cambios reales entre el export actual y la referencia anterior. El script recibe parámetros como mercado, carpetas objetivo y alcance new_only o similar, y devuelve un resumen JSON con nuevos, modificados, eliminados, lista de archivos y marca temporal. Si se activa la opción de IA, un proceso en lote analiza las imágenes con un modelo de visión tipo LLaVA u Ollama para puntuar calidad, detectar duplicados y dar sugerencias, por ejemplo bordes con aliasing o dimensiones inconsistentes.
Si hay cambios, toca enviarlos. Primero copiamos assets al directorio de origen compartido. Para Android se convierten SVG a VectorDrawable, se hace checkout del repo de recursos, se despliegan archivos, se actualiza changelog y versión, se comitea, se empuja y se abre un PR en Bitbucket. Para iOS en paralelo se generan las carpetas .imageset con conversión optimizada en múltiples trabajadores, se actualiza el repo, se versiona y se crea PR si está habilitado. Al terminar, se envía un resumen por Slack o chat del tipo misión completada, 5 assets actualizados en GOPH y se persisten métricas de auditoría en Postgres.
Requisitos previos: token de Figma y los identificadores de archivo y componentes, guardados como credenciales seguras; n8n autoalojado o en la nube; repos Git o Bitbucket para Android e iOS y un almacenamiento central opcional; herramientas de apoyo como Pillow, figma export y Ollama si se desea análisis visual con IA.
Consejo práctico: probad primero con un archivo de Figma de staging para evitar sorpresas en producción.
Montaje paso a paso en n8n. 1 disparador de chat o webhook integrado con Slack. 2 nodo de LLM para extraer acción, mercados, alcance y ticket a partir del mensaje. 3 función de respaldo con reglas simples. 4 cálculo del nombre de rama con el patrón feature barra ticket guion acción guion mercados guion versión. 5 división por mercados solicitados para optimizar tiempo. 6 instalación idempotente de dependencias.
Exportación desde Figma por mercado: se invoca figma export con la configuración específica del mercado, que define componentes o páginas a extraer, formatos y directorios de salida enfocados en SVG para mantener consistencia.
Detección de cambios: se ejecuta el script Python con los parámetros mercado, conjuntos de carpetas e indicador de alcance. El JSON resultante determina los siguientes pasos del flujo.
Análisis visual con IA opcional: si está activado, se envían las imágenes en lotes a un servicio local de IA con un prompt que requiere puntuación de calidad de 0 a 1, problemas detectados, duplicados y recomendaciones. El flujo sigue su curso aunque la IA tarde o no responda, gracias a un merge no bloqueante.
Advertencia de rendimiento: Ollama y modelos de visión aceleran mucho con GPU, pero existe alternativa en CPU para entornos locales.
Publicación de cambios: los archivos pasan a orígenes, se convierten para Android y iOS, se actualiza el registro de cambios, se generan commits y push, y se crean PRs automáticamente. Las credenciales Git se mantienen seguras en n8n. La mensajería informa del volumen de cambios por mercado y del estado de las PRs.
Salvaguardas importantes: jamás loguear tokens, usar credenciales cifradas; respetar límites de Figma, troceando exportaciones y aplicando esperas ante códigos 429; evitar duplicados mediante hash o ETags; implementar reintentos con backoff para tareas largas; si falla el parsing, por defecto ejecutar check_updates con alcance new_only; habilitar rollback cerrando PRs o revertiendo commits ante incidencias.
Ojo con permisos Git: asegurad que la cuenta de servicio de n8n tenga permisos de escritura y creación de PRs en los repos objetivo.
Mejoras recomendadas: generar PRs con miniaturas de assets embebidas en base64; ampliar escenarios de chat como full pipeline para orquestación completa o find duplicates para auditar sin publicar; aplicar estrategia de ramas con staging y posterior merge a main; optimizar con compresión sin pérdida como svgo y previsualizaciones rápidas.
Impacto real: este enfoque ahorra alrededor de 10 horas semanales en gestión de assets, reduce drásticamente los errores de traspaso y acelera entregas. Antes, la sincronización por mercado llevaba entre una y dos horas y la tasa de errores era elevada; ahora sucede en segundo plano en pocos minutos, con detección de deltas y checks de calidad, desplegando en paralelo para Android e iOS, avisando al instante por Slack y escalando sin fricción a múltiples mercados.
Si prefieres un arranque rápido, puedes importar un flujo mínimo en n8n con disparador de chat, parser de intención, exportación de un mercado, cálculo de deltas, commit y PR en Bitbucket. Sustituye los placeholders de credenciales y rutas por los tuyos y añade revisores cuando corresponda.
Preguntas frecuentes de operación: si aparece 401 en Figma, renueva el token; ante límites 429, reduce lote y añade esperas; si Git da error de permisos, revisa claves y roles; problemas de rutas se solucionan apuntando a rutas absolutas; si Ollama no responde, ejecuta el flujo sin IA; si no detectas cambios, revisa el alcance y limpia cachés temporales.
Listos para el movimiento ninja Figma a n8n con comandos de chat y chequeos de calidad con IA. En Q2BSTUDIO diseñamos y construimos estas canalizaciones a medida con foco en aplicaciones a medida, software a medida, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio, power bi, ia para empresas y agentes IA, integradas de forma segura y escalable. Hablemos y convierte tus entregas de diseño en una autopista de automatización lista para producción.