ui-enhance-animate

This skill performs a full design upgrade of an existing website or component. It is NOT just about adding animations — it is a holistic visual refinement pass that touches typography, spacing, layout, depth, micro-interactions, and motion. The existing color palette is preserved; everything else can and should be improved.

Before writing a single line of code, do a thorough read of the existing code. Extract and note:

Apply ALL of the following improvements that are relevant to the site. Be thorough — don't skip sections because they "look okay". Every part of the site should be elevated.

Комплексно обновляет и совершенствует дизайн пользовательского интерфейса существующего веб-сайта — улучшая макет, типографику, интервалы, глубину, визуальную иерархию и уточнение компонентов — сохраняя при этом существующую цветовую палитру сайта. Также добавляется плавная, шахматная анимация размытия и скольжения вверх с использованием Framer Motion (или CSS, если простой HTML), запускаемая при попадании элементов в область просмотра. Используйте этот навык всякий раз, когда пользователь хочет улучшить, модернизировать, отшлифовать или анимировать существующий веб-сайт или страницу React/HTML. Срабатывает, даже когда пользователь упоминает только «улучшить внешний вид», «анимировать», «улучшить дизайн», «обновить пользовательский интерфейс», «сделать его более современным» или «добавить анимацию прокрутки» — этот навык обрабатывает все это, а не только анимацию. Источник: zaaakher/agent-skills.