Mo.js - Web用の完全なモーショングラフィックライブラリ
ウェブ上でのアニメーションは、 JavaScriptはより強力になってきている ブラウザのサポートは年々増加しています.
私たちが慣れ親しんでいるアニメーションのほとんどは、インターフェイスに焦点を当てています。ドロップダウンメニュー、タブ付きボタン、スライドショーが一般的な例です。.
しかし、Mo.jsは違います。これは カスタムモーショングラフィック用に作成されたJavaScriptライブラリ デザイナーがシンプルなUI / UXのトリックを超えるすばらしいアニメーション機能を作成するのを助けるため.
Mo.jsのホームページにアクセスすると、 完全な文書 初心者向けの素晴らしいチュートリアルと一緒に.
これに注意 ライブラリはとても扱いにくい. 自分でMo.jsを使う前に、基本的なフロントエンドのコーディングに慣れておく必要があります。ただし、実際のデモを調べていくつかのソースコードを掘り下げるだけで、拾うことができるものはたくさんあります。.
デモを見てみたい場合は、メインのGitHubリポジトリをご覧ください。.
CodePenからのリンクの全リストには、すべてライブMo.jsデモが含まれています。これらは含まれています フルスクリーンページのアニメーションローダー、クリックしてアニメーション化するマイクロインタラクション, そしてたくさんの形の操作.
たとえば、このペンはユーザー入力から非常にクレイジーなマイクロインタラクションを作成します(それを見るにはペンの内側の任意の場所をクリックするだけです)。.
これらのペンのいくつかは頭上に感じるかもしれませんがこれらは単なるJSアニメーションではありません。彼らは本当に芸術作品のようなものです.
これらのデモは証明する どれだけ遠くまで来た ウェブ上のアニメーションで。フロントエンドのコードだけを使用して誰でもこれらの効果を作成できるという事実は、単に信じられないほどです。.
Mo.jsからもっと多くのことを知りたいのなら、GitHubのデモを見てください。このチュートリアルでMo.jsライブラリを使用する方法を段階的に説明することもお勧めです。.
どちらにせよ、これは 私のお気に入りのアニメーションライブラリの1つ 現在まで。それはあなたが他のどこにも見つけることができないほど多くのコントロールを提供します。そしてそれは、モバイルアプリケーションからWebデザインへのマイクロインタラクションをもたらすのを助けます。.