Design Motion Principles — скилл
design-motion-principles
Скилл про плавность и анимацию интерфейсов: собирает интерактивные компоненты с осмысленным движением и проверяет существующие. По работам Эмиля Ковальски
- 1 301 ★ репозитория
- Последний коммит
- MIT
Минимальный доступ
Почему такой уровень
- Скилл пересказывает приемы известных авторов
- Результат анимации проверяйте сами
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add skills/design-motion-principlesОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемМинимальный доступИнструмент ничего не запускает и не ходит в сеть.
- Скилл пересказывает приемы известных авторов
- Результат анимации проверяйте сами
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Design Motion Principles работает в двух режимах: собирает интерактивные компоненты с осмысленной анимацией и проверяет уже существующие. По README набор собран из опубликованных работ Эмиля Ковальски, Якуба Крехела и Джея Томпкинса, источники указаны, материалы не копируются. Установка: `npx skills add kylezantos/design-motion-principles`, можно и `git clone https://github.com/kylezantos/design-motion-principles.git`. Версия 2.1.0 от 21.05.2026, лицензия MIT.
Для кого. Для фронтенд-разработчиков и дизайнеров, которые хотят, чтобы анимации в интерфейсе были плавными и уместными, а не случайными.
Подходит, если
- Нужна плавная анимация компонента с обоснованным временем и кривыми
- Нужна проверка существующих анимаций по принципам движения
- Нужен набор приемов от известных авторов в одном скилле
Не подходит, если
- Нужны оригинальные материалы авторов: скилл пересказывает приемы
- Нужны готовые видеоролики: это про анимацию интерфейса
Пример запроса к агенту
Проверь анимацию выпадающего меню по принципам движения и предложи более плавные время и кривуюОграничения
Скилл пересказывает приемы известных авторов со ссылками на источники, права на оригинальные материалы остаются у них. Он текстовый и подсказывает приемы, а результат анимации проверяйте глазами и на слабых устройствах. Доступ минимальный.
Как отключить. Удалите скилл из каталога агента или плагин через менеджер плагинов.
Частые вопросы
Что делает скилл?
Собирает компоненты с осмысленной анимацией и проверяет существующие анимации по принципам движения.
Откуда принципы?
Из опубликованных работ Эмиля Ковальски, Якуба Крехела и Джея Томпкинса, с указанием источников.
Как установить?
npx skills add kylezantos/design-motion-principles.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
СкиллыСкилл принципов motion-дизайна для агентов: тайминг, easing, хореография и приемы анимации Disney в применении к интерфейсу
Скиллы Эмиля Ковальски для дизайнеров и инженеров
Skills For Designers and Engineers
Скиллы по анимации и деталям интерфейса от Эмиля Ковальски: кривые, длительности, ревью анимаций, выбор UI-библиотек
Скиллы для дизайн-инженеров: быстрая чистка интерфейса, доступность, метаданные и производительность анимаций
Скилл превращает референсы интерфейсов в структурированный профиль дизайна в JSON и генерирует по нему новый интерфейс под ваш контент
Детали, от которых интерфейс приятнее
make-interfaces-feel-better
Скилл о мелких деталях интерфейса: анимации, типографика, иконки, тени, скругления, оптическое выравнивание и области нажатия
Скилл с готовыми CSS-переходами для веб-интерфейсов: модалки, выпадашки, тосты, лоадеры и десятки других анимаций по правилам подбора
Сравнение с похожими
Записи с тем же главным запросом: чем они отличаются.
| Запись | Официальный | Звезды репозитория | Главное отличие |
|---|---|---|---|
| Design Motion Principles (эта запись) | нет | 1 301 | |
| Motiscope | нет | 122 | код анимации из записи экрана, только свои образцы |
| Motion.dev Animations Skill | нет | 173 | веб-анимации Motion.dev: пружины и скролл |
Коротко о README
README описывает скилл принципов анимации интерфейсов с режимами сборки и проверки, установку через npx skills. Лицензия MIT.