Visión General del Plugin de Diseño
El Plugin de Diseño de Percus conecta las herramientas de diseño que usa nuestro equipo con la plataforma Percus. La primera implementación es un plugin para Adobe After Effects que permite a los motion designers preparar, validar y subir templates de video personalizado directamente desde su entorno de diseño — sin exportaciones manuales, pasos técnicos complejos ni coordinación con desarrolladores para cada cambio.
Por qué existe
En el flujo de trabajo actual, mover un template desde After Effects a la plataforma requiere múltiples pasos manuales: exportar archivos, escribir documentos de mapeo de capas, probar la inyección de datos por separado y coordinar con desarrolladores en cada cambio. Esto genera fricción, ralentiza los proyectos y es una fuente frecuente de errores.
El plugin hace este proceso fluido: el diseñador marca las capas variables directamente en AE, valida la inyección de datos en tiempo real y publica en la plataforma con un clic.
Especificación principal
1. Exportación compatible con Smart-Render
- Exporta metadatos en JSON que describen la estructura del template — no un video final renderizado
- La exportación está diseñada para ser compatible con la arquitectura de renderizado del lado del cliente (Percus Player)
- Los campos variables, el timing y la lógica se capturan en un formato que el motor de bindings puede consumir
- Este enfoque garantiza que los datos PII nunca necesiten enviarse a un servidor de renderizado
2. Herramientas de personalización y datos
- Mapeo de capas a API — los diseñadores etiquetan capas directamente en After Effects para marcarlas como variables (texto, imagen, audio)
- Lógica de "Película Programable" — define secuencias condicionales (reglas if/else) que determinan qué escenas se reproducen según los valores de los datos
- Etiquetado de PII — los campos de datos sensibles se marcan para que el runtime aplique el manejo de seguridad adecuado
3. Diferenciación con IA
- Módulo de compliance de industria — verificaciones asistidas por IA para asegurar que el contenido cumpla con los requisitos regulatorios financieros
- Asistente de QA con IA — genera automáticamente casos de prueba y verifica que todas las combinaciones de variables rendericen correctamente antes de publicar
- Locución multilingüe — integración con motores de voz con IA (ej. ElevenLabs) para generar locuciones naturales en múltiples idiomas y acentos regionales directamente desde el proyecto de AE
- Autenticación de contenido — verificación con IA de que el contenido publicado no ha sido alterado
- Generador de casos de prueba con IA — crea automáticamente conjuntos de datos representativos para hacer stress-test de todas las variantes de la animación
4. Higiene y usabilidad
- Subida directa a la consola de Percus sin salir de After Effects
- Gestor interactivo de assets — navegar y gestionar recursos de la plataforma desde el panel del plugin
- Soporte para A/B testing — definir múltiples variantes de animación y etiquetarlas para pruebas de campaña
Principios de diseño UX / UI
Estética nativa de AE
La interfaz del plugin imita el look and feel de los paneles de Adobe After Effects — tema oscuro, dimensiones estándar de panel, controles familiares — para que los diseñadores se sientan cómodos y la fricción de adopción sea mínima.
Gestión visual de variables
- Etiquetado con un clic — marcar cualquier capa como campo variable con un solo clic
- Preview en vivo con datos — inyectar valores de datos de muestra para ver cómo se ve la animación con contenido real antes de publicar
- El panel de variables muestra todas las capas marcadas con su tipo de dato y valor de prueba actual
Sistema de QA "Semáforo"
Cada campo variable se marca con un indicador de estado:
| Estado | Significado |
|---|---|
| 🟢 Verde | El campo está correctamente vinculado y los datos de prueba renderizan sin problemas |
| 🟡 Amarillo | El campo está vinculado pero puede tener casos borde (ej. desbordamiento de texto) |
| 🔴 Rojo | El campo tiene un error de binding o no renderiza correctamente |
Esto da a los diseñadores retroalimentación visual inmediata sin necesidad de ejecutar el pipeline de render completo.
Librería de Componentes Inteligentes (nice-to-have)
Una librería curada de componentes de animación pre-construidos (intros, visualizaciones de datos, CTAs, outros) que los diseñadores pueden arrastrar a su proyecto y personalizar — acelerando la creación de templates para casos de uso comunes.
Flujo de publicación en un clic
- El diseñador marca todas las capas variables
- El plugin valida los bindings y ejecuta el QA con IA
- Se muestran los flags rojos/amarillos con una descripción
- El diseñador resuelve los problemas y dispara la subida
- El template aparece en la plataforma Percus listo para usar
Accesibilidad automática
- Subtítulos — pistas de subtítulos generadas automáticamente por IA a partir de datos de audio/guión
- Transcripción — se genera una transcripción de texto y se adjunta al template para soporte de lectores de pantalla
Flujo de trabajo del diseñador
Proyecto de After Effects
└── 1. Marcar capas variables (texto, imagen, audio) usando el panel del plugin
└── 2. Preview con datos en vivo — verificar que todas las variantes rendericen correctamente
└── 3. Ejecutar QA con IA — revisión semáforo de todos los bindings
└── 4. Resolver cualquier flag rojo/amarillo
└── 5. Publicar con un clic → el template aparece en la plataforma Percus
Estado actual
El plugin se encuentra actualmente en fase de especificación / diseño. El plugin de After Effects es el primer entorno objetivo. La integración con otras herramientas de diseño (Figma, Adobe Premiere) podrá considerarse en fases posteriores según la adopción del equipo y la demanda.