Google Labs випустила бібліотеку навичок Stitch Skills для агентів проектування інтерфейсів

Пряма інтеграція з агентами кодування

Stitch Skills повністю сумісний із популярними агентами кодування, включаючи Claude Code, Cursor, Codex та Gemini. Ви можете встановити повний набір плагінів глобально або націлити його на конкретні проекти. Наприклад, для інтеграції з Claude Code в поточній директорії проекту виконайте:

npx plugins add google-labs-code/stitch-skills --scope project --target claude-code

Для користувачів Cursor набір можна встановити на рівні робочої області (workspace):

npx plugins add google-labs-code/stitch-skills --scope workspace --target cursor

Основні навички та можливості

Бібліотека організована у три головні плагіни:

• stitch-design: Ключові процеси, такі як конвертація фронтенд-коду в макети Stitch, вилучення файлу DESIGN.md з директорії /src та генерація варіацій інтерфейсу.
• stitch-build: Генерація коду, що трансформує макети в компоненти React або готовий до продакшену код React Native.
• stitch-utilities: Допоміжні інструменти для покращення промптів та валідації дизайну.

Стандартна структура директорій

Кожна навичка використовує чітку структуру файлів для забезпечення прогнозованості поведінки LLM:

• SKILL.md: Конфігурація для керування поведінкою агента.
• scripts/: Виконувані скрипти, які відповідають за валідацію та мережеву взаємодію.
• resources/: База знань, що містить чек-листи та стайл-гайди.
• examples/: Синтаксично коректні приклади коду для порівняння.