agentation

Agentation es una herramienta de retroalimentación visual diseñada para cerrar la brecha entre lo que ves en una página web en ejecución y lo que un agente de codificación de IA necesita cambiar en el código fuente. En lugar de describir un problema de interfaz en prosa, lo señalas. Cómo funciona: instalas el paquete como dependencia de desarrollo y renderizas el componente `<Agentation />` junto a tu aplicación. Aparece una barra de herramientas en la esquina inferior derecha. Actívala y luego haz clic en cualquier elemento de la página para anotarlo. La herramienta captura nombres de clases, selectores CSS y posiciones de elementos, y produce una salida markdown estructurada que puedes copiar y entregar a un agente. El ejemplo del README es que en lugar de decir "el botón azul en la barra lateral", le das al agente `.sidebar > button.primary` más tu nota, que el agente puede buscar directamente. Capacidades notables enumeradas en el README: - Haz clic para anotar cualquier elemento, con identificación automática de selectores - Selección de texto para anotar contenido específico - Multi-selección arrastrando sobre varios elementos - Selección de área, para que puedas anotar una región incluso si no contiene elementos - Pausa de animación, congelando animaciones CSS, JS y de video para capturar un estado específico - Salida markdown estructurada que incluye selectores, posiciones y contexto - Modo oscuro y claro, siguiendo la preferencia del sistema o configurado manualmente - Cero dependencias en tiempo de ejecución, usando animaciones CSS puras Requisitos y alcance: React 18 o superior y un navegador de escritorio (no se admite móvil). El proyecto es agnóstico de agentes, lo que significa que la salida copiada no está vinculada a un asistente de codificación de IA en particular. Licencia: el README indica que el proyecto tiene derechos de autor 2026 de Benji Taylor y está licenciado bajo PolyForm Shield 1.0.0, una licencia de código disponible en lugar de una licencia de código abierto convencional, por lo que debes revisar sus términos antes del uso comercial. La documentación completa está alojada en agentation.com.