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.

サイトの既存のカラー パレットを維持しながら、既存の Web サイトの UI デザインを包括的にアップグレードして磨き上げ、レイアウト、タイポグラフィ、間隔、深さ、視覚的な階層、コンポーネントの洗練を改善します。また、要素がビューポートに入ったときにトリガーされるフレーマー モーション (またはプレーン HTML の場合は CSS) を使用して、スムーズな千鳥状のぼかし + スライドアップのリビール アニメーションを追加します。ユーザーが既存の Web サイトまたは React/HTML ページを改善、最新化、洗練、またはアニメーション化したい場合は常に、このスキルを使用します。ユーザーが「見た目を良くする」、「アニメーション化する」、「デザインを改善する」、「UI をアップグレードする」、「よりモダンにする」、または「スクロール アニメーションを追加する」とだけ言及した場合でもトリガーされます。このスキルはアニメーションだけでなく、それらすべてを処理します。 ソース: zaaakher/agent-skills。