feitangyuan/motion-web

解決する課題

motion-web は、創造的ウェブ開発における「AIの雑さ（AI slop）」という問題に対処します。AI生成のアニメーションが一般的で、線形的で物理的なリアリズムに欠ける傾向があることを改善します。動きを装飾的な付加物ではなく、核心的な素材として扱う、高触感のモーションファーストウェブサイトを構築するためのフレームワークを提供し、インタラクションが自然でプロフェッショナルに感じられるようにします。

動作方法

このプロジェクトは、ClaudeなどのAIエージェントやフロントエンドエンジニア向けの「スキル」として機能します。スプリング・ダンパー系、異方性力、Verlet積分といった物理法則のセットと、厳格な検証システムを組み合わせています。合成的なずれや無反応のインタラクションを防ぐために、Playwrightベースのヘッドレスオラクル（verify_case.py）を使用し、変位比、変形誤差、状態収束を数学的に検証することで、コードが意図した通りに実際に動作していることを保証します。

対象ユーザー

Vanilla Three.js、Canvas 2D、WebGL、CSS を使用して、高品質で創造的なインタラクティブウェブサイトを構築したいAIエージェントやフロントエンドエンジニア向けです。重いビルドツールや外部CDNに依存しません。

特徴

• 物理駆動のモーション: 実世界の物理法則を実装。2次スプリング・ダンパー系やステップジャッターでタッチ感を再現。
• 自動検証: ヘッドレステストスイートを備え、アニメーションやインタラクションが正しく機能していることを数学的に検証。
• 依存関係ゼロ: すべてのケースは外部ネットワーク依存なしに独立して実行可能な単一ファイルのHTMLページ。
• 多様な事例: ソフトボディ時計、WebGL2インククラウド、因果的エコシステム、Verletロープカーテンなど、7つの検証済みインタラクティブ例を提供。