ITエンジニア/デザイナ向けにオープンソースを毎日紹介

アニメーションは何の意味もなく動かしても面白くありません。一回転させたり、ひっくり返ったりと現実世界を投影するような動きは目を引きやすく、表現としても分かりやすいです。

そこで使ってみたいのがDynamics.jsです。物理系の動きを再現するJavaScript/CSSアニメーションライブラリになります。

Dynamics.jsの使い方

Dynamics.jsには多数のパターンで動きが作られています。

スプリングという名前のアニメーションです。

バウンド。

強い重力。

この他にもいくつものパターンでアニメーションが作られています。さらにパラメータを変更することで動きを調整できるようになっています。Dynamics.jsを使ってリアルな物体感を感じさせるアニメーションを実現してください。

Dynamics.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

Dynamics.js

michaelvillar/dynamics.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2