物体の動きをどのように定義できるでしょうか？一つの方法は運動方程式で表現することです。 F = ma は有名な公式です。力は物体に加速運動を引き起こすということですね。

バネ運動では、力は平衡点からの距離に比例します。つまり F = -kx です。変位の方向と反対方向に力が生じ、バネ定数が大きいほど引く力が強くなります。

実際の物理世界では、バネ運動において空気抵抗も考慮する必要があります。一般的に空気抵抗は速度が大きいほど反対方向に作用します。

空気抵抗は空気中の無数の粒子との衝突によって発生します。想像してみてください。私たちが粒子に強くぶつかるほど、粒子はより速く飛んでいきます。逆に言えば、粒子が速く飛んでいく分、私たちは運動量を粒子から奪われます。だから空気抵抗は私たちの速度が速いほど大きくなるのです。

そのため最終的な力は F = -kx-bv となります。これをニュートンの運動方程式と結びつけると F = ma = -kx-bv となり、a、v、x はすべて x に関連する変数です。（v は単位時間に対する x の変化量、a は単位時間に対する v の変化量）

私たちはこれを微分方程式として表現できます。そしてすべての微分方程式は数値解析で解くことができます。短い時間の間、物体が等速運動すると考えてみましょう。

短い時間間隔で変化する x、v、a を累積して計算すれば、時間ごとに物体がどのように動くかを記述できます。

現実世界のすべての物体は連続した速度と連続した加速度の間で動きます。物体が動いている最中に突然方向が変わることを考えてみてください。物体を右に引く力が今度は左に方向を変えても、物体はすぐに左に動きません。右に向かっていた速度は徐々に減少してゼロになった後、左に動きます。

ここで CSS アニメーションとスプリングアニメーションの違いが生じます。CSS は急激に方向を変えます。スプリングは連続的に速度が変化しながら方向を転換します。後者の方がより現実的です。ssgoi がスプリングアニメーションを志向する理由です。