AI-coderingstools zijn goed in code, maar animatie is moeilijk in code alleen te beschrijven. Zonder toegang tot het ontwerp raadt een agent de timing en toestanden. MCP, het Model Context Protocol, lost dit op door de agent directe toegang te geven tot een tool via een standaardinterface.
Een MCP-server is een kleine service die acties weergeeft die een agent kan aanroepen. Voor animatie kan dat betekenen dat er een component wordt gemaakt, een status wordt toegevoegd, een veer wordt gewijzigd of wordt gelezen welke invoer een bestand heeft. De agent beslist wanneer deze acties moeten worden uitgevoerd op basis van uw prompt.
De installatie is meestal kort. U voegt de server toe aan de MCP-configuratie van uw client, bijvoorbeeld met de mcp-opdracht van Claude Code of in de MCP-instellingen van Cursor, en authenticeert vervolgens indien nodig. Daarna kun je in gewone taal vragen: "maak een schakelaar met een veer en een ingedrukte staat" of "vertraag de succesanimatie".
ExodeUI, die wij maken, heeft hiervoor een MCP server. Agenten kunnen animaties maken en bewerken met toestanden, veerfysica, invoer en gebeurtenissen, en het resultaat is een open .exode-bestand dat u in de editor kunt openen en in uw app kunt afspelen. Ontwerptools zoals Figma en Penpot hebben hun eigen MCP-servers voor lay-out en ontwerpcontext.
Behandel de agentuitvoer als een concept. Controleer de beweging in de editor, vooral de timing, het gedrag bij verminderde beweging en elke status, voordat deze wordt verzonden.