El motivo MCP le da a Claude Code la capacidad de ver videos para reproducir errores de UI

Claude Code no puede ver vídeos de forma nativa, lo que hace tedioso diagnosticar errores visuales de interfaz (estados hover, animaciones, comportamiento de desplazamiento), porque hay que describir el error con palabras. motif es un nuevo servidor MCP que soluciona esto permitiéndote apuntar Claude Code a una grabación de pantalla del error.

Cómo funciona

Graba el error, apunta motif al archivo, y devuelve tres cosas: lo que está sucediendo visualmente, la causa raíz y un diff. Utiliza Gemini 2.5 Flash internamente porque ese modelo procesa el vídeo como una secuencia de fotogramas en lugar de una sola captura de pantalla, una distinción que importa para errores que implican un rebasamiento de 200 ms o un estado hover que se restablece en el momento equivocado.

Configuración

Necesitas una clave API de Gemini. Luego añade dos líneas a tu mcp.json:

{
  "mcpServers": {
    "motif": {
      "command": "npx",
      "args": ["motif-mcp"],
      "env": {
        "GEMINI_API_KEY": "tu-clave-aquí"
      }
    }
  }
}

Después de eso, la interfaz es simplemente: dile a Claude Code que vea la grabación.

Pruébalo

Ejecuta npx motif-mcp para empezar. El proyecto está en etapa inicial, por lo que los comentarios son bienvenidos.

Para quién es

Desarrolladores que usan Claude Code para trabajo front-end y quieren saltarse el paso de descripción manual de errores para problemas visuales.