Паттерны и лучшие практики анимаций для React/Next.js.
Open source — скоро
Использует
React / Next.jsсервисEmil Kowalski «Animations on the Web»источник
Что делает
Паттерны анимаций по курсу Эмиля Ковальского «Animations on the Web»: transitions, hover, page transitions, модалки — и понимание, где движение уместно, а где вредит.
Как пользоваться
- 1Активируется на шаге анимации в дизайн-флоу.
- 2Предлагает, где анимация уместна и где её НЕ должно быть.
- 3Даёт easing, длительности, конкретные паттерны.
- 4Имплементирует после согласования.
Когда срабатывает
внутри page-design-pipelineвнутри design-revise«добавь анимаций»«где тут движение»
Пример
На Checkpoint 3 — список уместных анимаций + код с правильным easing.
Обновления
Добавлен в каталог RedSkills.
Понравился скилл? Новые разборы и обновления — в канале.