Anime.jsvsMotion

同じお題を2つのアニメーションライブラリで実装して並べる比較実験室。左右同時再生で動きの質感を、コードパネルでAPI思想の差を見比べられます。

お題一覧

お題 1

グリッド起点の遅延伝播。grid指定のstagger対応差が見どころ。

お題 2

ストローク描画。svg.createDrawableとpathLengthの思想差。

お題 3

物理ばね。パラメータの対応関係とオーバーシュートの質感差。

お題 4

シーケンス構築。createTimelineと配列シーケンスの書き味差。

お題 5

onScrollとscroll()/inView()。スクラブと閾値トリガーの2モード。

お題 6

文字単位アニメ。同一DOM・同一順序での公平比較。

同じ動きを何行で、どんな概念（timeline/シーケンス、ease/トランジション）で書くか。

左右同時再生で、イージングやばね物理の「気持ちよさ」の差を目視で比べる。

グリッドstagger・SVG線画・スクロール連動など、お題ごとに得意不得意が入れ替わる。

全お題を触ったら、比較まとめ（結論）で使い分け指針を確認できます。