mo · js - Web上でモーションアニメーションを実現 // MOONGIFT Archived

Webの表現力は上がったと言われていますが、そのためのテクニックは必要です。SVGやCanvasを使いこなすのは相当難しく、専用のライブラリを使う方が手軽にアニメーションなどが実現できます。今回紹介するmo · jsもその一つで、モーションアニメーションが実装できるライブラリです。

mo · jsの使い方

実装例です。かなり派手なアニメーションです。

クリックイベントと合わせた場合。メニューなどに使えそうです。

イラストとの連携もできます。

横から登場。

こちらもクリックイベントです。

Twitterのスターボタン風アニメーション。

mo · jsを使えば何も大きなアニメーションだけでなく、ユーザイベントをきっかけにしたアニメーションが実現できます。UXを高めるための施策に使えそうです。ちょっとしたアニメーションはユーザの目を引いたり、大事なポイントを気付かせるのに便利でしょう。

mo · jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。