Jakub Antalik

画面の実際の構造を点線で描き、完成したUIを走査線とともに表示します。生成ログを添える演出にも対応し、AIが画面を組み立てるような動きを加えるスキルです。

• AIの結果カードを表示したいとき
• 製品デモで生成過程を演出したいとき
• LPに生成ログ付きの演出を加える

画面の動きの不足やぎこちなさ、ばらつきをコードから調べ、スコアと修正候補を示します。利用者が選んだ修正を適用し、再診断やCI設定まで案内するスキルです。

• UI変更後の動きを点検したいとき
• 時間設定やホバーの動きを統一する
• 部品ごとの動きの実装例を適用する

ドロップダウンやモーダル、読み込み表示などに合うCSSアニメーションを選び、必要なHTMLの設定やJavaScriptと組み合わせてWebアプリに導入します。

• メニューやモーダルの開閉演出
• 読み込み表示の切り替え
• 文字や数字の更新を動きで示したいとき

Timeline InspectorのRefine操作をチャット内のエージェントにつなぎ、動きの調整案の表示、開閉状態ごとの整理、受け入れた設定のコード反映を行います。

• 常駐CLIを使えない環境でのRefine対応
• パネルで動きの調整案を確認したいとき
• アニメーションの開閉状態の整理

既存のUIアニメーションを調べ、時間・距離・拡大率・ぼかし・速度変化を用途別の共通値に合わせます。開閉の差や順次表示の間隔も見直し、動きを調整します。

• 既存アニメーションの見直し
• モーダルの開閉速度を整えたいとき
• リストの順次表示の遅れを直したいとき