AI-kodningsværktøjer er gode til kode, men animation er svær at beskrive i kode alene. Uden adgang til designet gætter en agent timing og angiver. MCP, Model Context Protocol, løser dette ved at give agenten direkte adgang til et værktøj via en standardgrænseflade.
En MCP-server er en lille tjeneste, der afslører handlinger, som en agent kan kalde. For animation kan det betyde at oprette en komponent, tilføje en tilstand, ændre en fjeder eller læse, hvilke input en fil har. Agenten beslutter, hvornår de skal kalde disse handlinger baseret på din prompt.
Opsætningen er normalt kort. Du tilføjer serveren til din klients MCP-konfiguration, for eksempel med Claude Code's mcp-kommando eller i Cursor's MCP-indstillinger, og godkend derefter om nødvendigt. Derefter kan du spørge i almindeligt sprog: "foretag en skifte med en fjeder og en trykket tilstand" eller "sænk succes-animationen".
ExodeUI, som vi laver, har en MCP server til dette. Agenter kan oprette og redigere animationer med tilstande, forårsfysik, input og begivenheder, og resultatet er en åben .exode-fil, du kan åbne i editoren og afspille i din app. Designværktøjer som Figma og Penpot har deres egne MCP-servere til layout og designkontekst.
Behandl agentoutput som en kladde. Tjek bevægelsen i editoren, især timing, nedsat bevægelsesadfærd og hver tilstand, før den afsendes.