Repolode
Предложить
LottieFiles

LottieFiles/motion-design-skill

Навык для AI-агентов, который обучает принципам моушн-дизайна для анимации интерфейсов: таймингу, плавности и хореографии.

Открыть на GitHub
Звёзды
2,329
Форки
149
Открытые issues
1
Последний коммит
5 месяцев назад

Что это?

Motion Design Skill — набор инструкций для AI-агентов, который помогает им мыслить как моушн-дизайнер ещё до написания кода анимации. Он охватывает выбор тайминга, плавности, хореографии и эмоционального замысла движения, а не только генерацию кода для конкретной библиотеки.

Навык адаптирует 12 принципов анимации Disney для пользовательских интерфейсов и включает чек-лист из 8 шагов, архетипы характера движения, а также справочные таблицы длительности и плавности. Кроме того, в нём есть готовые рецепты для анимаций появления и исчезновения, отклика на состояния вроде загрузки, успеха и ошибки, фоновых циклических движений и последовательной анимации нескольких элементов.

Навык совместим с CSS, Framer Motion, GSAP, Lottie и системами на основе пружинной физики. Для установки используется команда npx skills add; поддерживается более 40 AI-агентов для программирования, включая Claude Code, Cursor, Codex и GitHub Copilot.

Ключевые возможности

  • 01Охватывает тайминг, плавность, хореографию и эмоциональный замысел до начала реализации
  • 02Адаптирует 12 принципов анимации Disney для интерфейсов
  • 03Содержит рецепты для анимаций появления и исчезновения, отклика на состояния, фоновых движений и последовательной анимации нескольких элементов
  • 04Предоставляет справочные таблицы длительности и плавности, а также чек-лист качества
  • 05Не привязан к конкретной библиотеке: подходит для CSS, Framer Motion, GSAP, Lottie и систем на основе пружинной физики

Сценарии использования

  • Добавление анимаций появления для карточек или списков в веб-приложении
  • Проектирование переходов загрузки, успеха и ошибки для кнопки отправки формы
  • Постановка порядка появления виджетов на дашборде
  • Проверка существующего кода анимации на соответствие принципам моушн-дизайна

Быстрый старт

  1. 1

    Установите навык для своих агентов

    npx skills add LottieFiles/motion-design-skill

Что важно знать

  • Поддерживает более 40 агентов через skills.sh, но в README описана только команда установки, без дальнейших инструкций по настройке.

Темы

#agent-skills#animation#motion-design#ui#micro-interactions#easing#lottie

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

Что такое motion-design-skill?
Навык для AI-агентов, который обучает принципам моушн-дизайна для анимации интерфейсов: таймингу, плавности и хореографии. Motion Design Skill — набор инструкций для AI-агентов, который помогает им мыслить как моушн-дизайнер ещё до написания кода анимации. Он охватывает выбор тайминга, плавности, хореографии и эмоционального замысла движения, а не только генерацию кода для конкретной библиотеки.
motion-design-skill можно использовать бесплатно? Какая у него лицензия?
motion-design-skill распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
motion-design-skill всё ещё поддерживается?
Обновлялся за последние 6 месяцев. Последний коммит в motion-design-skill — 18 мая 2026 г..
Для чего можно использовать motion-design-skill?
Добавление анимаций появления для карточек или списков в веб-приложении Проектирование переходов загрузки, успеха и ошибки для кнопки отправки формы Постановка порядка появления виджетов на дашборде Проверка существующего кода анимации на соответствие принципам моушн-дизайна
Как установить motion-design-skill?
Установите навык для своих агентов: npx skills add LottieFiles/motion-design-skill
Где скачать motion-design-skill?
Исходный код и инструкции по установке — на GitHub: https://github.com/LottieFiles/motion-design-skill

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты