Как AI-агенту объяснить дизайн-систему: Figma MCP, RAG и ChromaDB против выдуманных компонентов

Практическая проблема: AI-агент видит макет, пишет код, но не знает, какие компоненты существуют в проекте. Результат — верстка из несуществующих элементов. Решение — дать агенту знание о реальной дизайн-системе через MCP (Model Context Protocol).

В статье разбирается подход: Figma MCP для получения описания макета, свой DS MCP с ChromaDB для поиска компонентов, RAG с эмбеддингами и препроцессор для преобразования компонентов в понятный для LLM формат. Плюс сравнение по tool calls, токенам и качеству — с граблями вроде шума в контексте и устаревающего SKILL.md.

Под капотом: React, Jetpack Compose, SwiftUI, ChromaDB, embeddings и честное сравнение подходов. Читайте, пробуйте и делитесь своим опытом.