Drawing and animating shapes on the Web has been a major challenge for Web developers. Today, I read about mo.js, a new JavaScript library designed to build motion for the Web. It seems like this is exactly what mo.js is trying to solve, the problem of drawing motion graphics on the Web.
Mo.js is a simple, fast, open sourced, modular, robust, and retina ready JavaScript library from drawing motion graphics for the Web. For example, if you want to draw animated graphics shape such as a circle, a rectangle, a line, curve, and others.
Quick start
- <script src="http://cdn.jsdelivr.net/mojs/latest/mo.min.js"></script>
Declarative API Demo
- var burst = new Burst({
- shape: 'circle',
- fill: [ 'deeppink', 'cyan', 'orange' ],
- x: '50%', y: '50%'
- });
Here is a live demo : Demo on Codepen
Download and Get Started
Download mo.js on Github: https://github.com/legomushroom/mojs
Here are some tutorials:
http://mojs.io/tutorials/easing/path-easing/
Note: It seems like more tutorials are being added.