Interfaces que no parecen hechas por IA.
El agente construye, revisa y pule interfaces con una guía de diseño propia. Una persona elige la dirección y aprueba el resultado.
El problema
«Se nota que esto lo ha hecho una IA.» «Queda bonito en la captura, pero el formulario no se puede usar con teclado.» «El texto gris sobre gris no hay quien lo lea.»
Le pasa a cualquier equipo que construye pantallas con IA sin un criterio de diseño por escrito: el resultado sale rápido y se parece a todos los demás.
Cómo se hace hoy
Las pantallas salen con los atajos de siempre: degradados de adorno, esquinas redondeadas en cada elemento, poco contraste y formularios que nadie ha probado con teclado. Corregirlo a mano, pantalla a pantalla, se deja para después.
Cómo lo resolvemos
- Pides el trabajo con una frase, por ejemplo «revisa el diseño de esta página y súbele el nivel».
- El agente trabaja con una guía de diseño propia: maquetación, tipografía, color, animación, accesibilidad y formularios.
- Con esa guía construye la interfaz, o revisa y pule una que ya existe, sin los patrones que delatan un trabajo hecho por IA.
- Si hay un diseño hecho en la herramienta de diseño, lo lee y lo pasa a código.
- Si no lo hay, propone direcciones de diseño y las lleva a la herramienta de diseño para que se puedan comparar.
Resultado
Es como trabajamos nosotros cada día: las interfaces que construimos pasan por esa guía, también esta web.
Qué hace falta
Tu código y tu herramienta de diseño
Acceso al repositorio de la interfaz y, si los tienes, a los ficheros de diseño. El agente los lee y propone; no publica.
Tu marca y tus componentes
Colores, tipografías y componentes que ya usas. Sin ellos, el agente no tiene con qué ser coherente.
Tus reglas, por escrito
Qué es aceptable en tu empresa: requisitos de accesibilidad, de contraste y de uso con teclado. Si no están escritas, las escribimos contigo.
Una persona con criterio de diseño
Quien elige la dirección y aprueba el resultado. El agente propone y pule; la decisión es suya.
Cómo está hecho
La base es una guía de diseño propia, escrita, que el agente lee antes de tocar una interfaz. Cubre maquetación, tipografía, color, animación, accesibilidad y formularios, y recoge los patrones que delatan un trabajo hecho por IA para no repetirlos.
El agente trabaja con Figma en los dos sentidos: lee un diseño y lo pasa a código, o propone direcciones de diseño y las lleva a Figma.
La guía sirve para construir, para revisar y para pulir. La dirección de diseño no la elige el agente: la elige una persona, que también aprueba el resultado.
Preguntas frecuentes
¿Qué significa que una interfaz «parece hecha por IA»?
Que repite los atajos de siempre: degradados de adorno, esquinas redondeadas en cada elemento, poco contraste y formularios que nadie ha probado con teclado.
¿Trabaja con nuestros diseños?
Sí. El agente lee un diseño hecho en la herramienta de diseño y lo pasa a código. También puede proponer direcciones y llevarlas a esa herramienta.
¿Quién decide el diseño final?
Una persona elige la dirección de diseño y aprueba el resultado.
Automatizaciones relacionadas
Revisión de código
Cuatro agentes revisan cada cambio antes de producción. Una persona decide si entra.
Web para agentes
Un agente de IA puede rellenar el formulario de contacto de la web. El envío lo hace siempre una persona.
Forma parte de Desarrollo con agentes de IA
El siguiente paso
Cuéntanos cómo trabaja hoy tu empresa y te decimos por dónde empezar.