LIVE//NAKODIL.SITE//PAYLOAD :: GUIDE

Гайд · 4 мин чтения

MotionSites AI — что это такое и как работает с Claude Code

MotionSites.ai — платная библиотека hero-промптов под Cursor, Lovable и Claude Code. Не генератор: копируешь промпт, вставляешь в AI-редактор — получаешь анимированный React-код. Yearly $199, Lifetime $349, бесплатного плана нет.

Антон 1 просмотров
MotionSites AI — что это такое и как работает с Claude Code
Коротко

MotionSites (motionsites.ai) — это библиотека hero-промптов для анимированных сайтов, не генератор. Я беру промпт из каталога, вставляю в AI-редактор — Cursor, Lovable или Claude Code, — и редактор выдаёт React-код с анимацией. MotionSites в этой цепочке ничего не генерирует и кода не отдаёт.

Как работает MotionSites AI: промпт вместо конструктора

MotionSites — каталог готовых промптов под анимированные hero-секции. Открываешь карточку шаблона, копируешь промпт, вставляешь в свой AI-редактор — тот строит React-компонент. Сам MotionSites кода не пишет, функции экспорта нет. Официально сайт называет совместимость с Cursor и Lovable; про Claude Code нет ни слова.

1. Шаги от промпта до кода

  1. Открываете каталог на motionsites.ai и выбираете hero-шаблон с нужной анимацией.
  2. Копируете готовый промпт из карточки шаблона.
  3. Открываете AI-редактор — Cursor, Lovable или Claude Code.
  4. Вставляете промпт, редактор генерирует React-компоненты.
  5. Интегрируете компонент в свой проект.

2. Claude Code и MotionSites: механика работает, статус неофициальный

Промпты из каталога MotionSites — это обычный текст, и Claude Code принимает их так же, как Cursor или Lovable: открываешь редактор, вставляешь промпт, получаешь React-компонент с анимацией — без дополнительных настроек под конкретный редактор. Официальной интеграции нет, Claude на сайте не упоминается нигде. Единственная внешняя зацепка — YouTube Shorts «Create $10,000 Animated Websites with Claude Code + MotionSites.AI», содержание которого я не верифицировал. Аналогичный флоу — промпт → AI-редактор → анимированный результат — описывает разбор на Medium.

Мой опыт: бесплатные промпты из каталога я прогонял именно через Claude Code — и одна из таких секций стоит на моём сайте. Завелось чётко, без ручных правок кода. Платные шаблоны устроены так же: это те же текстовые промпты, отличается только набор секций и анимаций — если работают бесплатные, нет причин платным вести себя иначе.

Сколько стоит MotionSites и что входит?

На июль 2026 — два тарифа: Yearly $199/год и Lifetime $349. Бесплатного тарифа нет, но часть промптов открыта бесплатно — механику можно проверить до покупки (я проверял именно так). Цены нестабильны: поисковые снимки за тот же период фиксировали $99–$149/год и lifetime $239–$299, ревью на Product Hunt называли $99 lifetime. Акция «Founding Members» идёт с таймером. Актуальная цена — на motionsites.ai/pricing.

ТарифЦена (июль 2026)Что входит
Yearly$199/годБиблиотека промптов + Design Rocket −50%
Lifetime$349То же, без ежегодного продления
Go UnlimitedУточнять на сайтеДетали на motionsites.ai/unlimited

В оба тарифа входит обучающая платформа Design Rocket (designrocket.io) со скидкой 50% — от основателя Viktor (@viktoroddy). Это дизайн-курсы, не инструмент генерации.

Контекст: нишевый запуск и открытый вопрос по changelog

MotionSites полезен ровно в одной ситуации: нужен анимированный hero-блок без ручного промпт-инжиниринга, а AI-редактор — Cursor, Lovable или Claude Code — уже есть. Если задача шире одного блока, как собрать красивый дизайн сайта целиком на готовых промптах — я разбирал в отдельном гайде. По данным Similarweb (май 2026), ближайшие конкуренты — Motionity и Design Rocket. Причём Design Rocket фактически не конкурент, а партнёрский продукт того же автора — он же идёт бонусом в тарифах MotionSites.

Запуск на Product Hunt прошёл со статусом «not featured», 8 апвоутов, #12 дня. Публичного changelog нет — с открытых страниц сайта я не смог проверить, пополняется ли библиотека после запуска.

По опыту с бесплатными промптами: работоспособность — не вопрос, промпт отрабатывает в Claude Code без адаптации. $199/год — это плата за коллекцию готовых формулировок, а не за технологию: тот же результат можно получить, написав промпт самостоятельно, — каталог экономит время на формулировках и подборе анимаций.

Прозрачно: ссылки на motionsites.ai в статье — партнёрские. Если оформишь план по ним, мне придёт процент; цена для тебя не меняется.

Источники

Скиллы по теме

Весь каталог →
Skill
Ponytail
Плагин для Claude Code в духе «ленивого сеньора»: перед генерацией кода агент проходит лестницу решений — нужен ли код вообще (YAGNI) → есть в stdlib → нативная фича платформы → уже установленная зависимость → одна строка → и только потом минимально необходимое. Каждый срез помечается комментарием-маркером ponytail: с подсказкой, как развернуть решение обратно. Ленивый, но не безответственный: валидацию, обработку ошибок, безопасность и доступность не режет. Автор замерил на пяти типовых задачах (три модели Claude, медиана): −80–94% кода, в 3–6 раз быстрее, на 42–75% дешевле по API. И честно оговаривает: результат зависит от модели и промта — на коротких задачах и «многословных» reasoning-моделях правила перевешивают экономию. Бенчмарки открыты и воспроизводимы. По смыслу — сосед caveman из этого каталога.
Skill
mcp-builder
Официальный skill от Anthropic для создания MCP-серверов. Ведёт по полному циклу: исследование API сервиса, проектирование инструментов, реализация на TypeScript (MCP SDK) или Python (FastMCP), тестирование через MCP Inspector и написание evals. Внутри — выжимка best practices протокола и гайды-референсы под оба языка. Полезен, когда нужно подключить к Claude внешний сервис, для которого нет готового MCP-сервера. Главная ценность — учит делать инструменты удобными для LLM (нейминг, пагинация, понятные ошибки), а не просто обёртку над API.
MCP
Notion MCP
Официальный MCP-сервер от Notion: Claude ищет, читает и редактирует страницы и базы данных в твоём Notion прямо из чата. Подключение через OAuth — авторизуешься в браузере, без ручного управления токенами. Удобно, когда база знаний, задачи или заметки живут в Notion: Claude достаёт нужное, дописывает страницы, обновляет записи без переключения между приложениями.
Skill
Excalidraw Diagram Skill
Рисует Excalidraw-диаграммы из текста. Сам валидирует визуал через Playwright и фиксит огрехи до выдачи. Файл открывается в Obsidian или excalidraw.com и редактируется руками.
Квест
Собери свой сайт на Claude Code — за неделю
Не лекция: копируешь команды, видишь результат. 7 шагов, первые два бесплатно.
Открыть квест

Частые вопросы

Что такое motionsites ai?

MotionSites (motionsites.ai) — платная библиотека hero-промптов и анимированных шаблонов. Копируешь готовый промпт, вставляешь в AI-редактор — Cursor, Lovable или Claude Code — и редактор генерирует React-код с анимацией. MotionSites сам код не выдаёт и экспорта не имеет.

Можно ли использовать MotionSites с Claude Code?

Да, механика работает: промпт — это текст, и Claude Code обрабатывает его так же, как Cursor или Lovable. Официальной интеграции нет — на сайте MotionSites Claude Code не упоминается. Инструмент нейтрален к выбору редактора.

Есть ли бесплатный план у motionsites.ai?

Нет. На июль 2026 доступны Yearly $199/год и Lifetime $349 с акцией «Founding Members». Цены нестабильны — поисковые снимки за тот же период фиксировали другие значения.

Что входит в подписку MotionSites?

Доступ к библиотеке hero-промптов с анимацией и обучающая платформа Design Rocket (designrocket.io) со скидкой 50% от основателя Viktor (@viktoroddy). Хостинга, генерации кода или экспорта в сервисе нет.

Чем MotionSites отличается от Lovable?

Lovable — AI-редактор, официально названный на сайте MotionSites как совместимый. MotionSites — только библиотека промптов: редактор нужен отдельно, бесплатного плана нет. Разные инструменты под разные задачи.

Что выдаёт MotionSites — готовый сайт или код?

Ни то, ни другое. MotionSites выдаёт промпты. Код генерирует ваш AI-редактор после вставки промпта. Результат — React-компоненты, которые вы интегрируете в свой проект самостоятельно.