Saturday 4 October 2014

JavaScript Animation Libraries - Quick Survey




[Image Reference: www.queness.com]

JavaScript is so much powerful that everything can be animated with ease amongst numerous available libraries. Being tried with a few libraries, here is a small survey. The list is never ending. There are 100's with specific properties. Here are a few which i have used!

1. Collie
  • Can create highly optimized animations and games using HTML 5
  • Collie runs on both PC and mobile using HTML 5 canvas and DOM
  • Optimized for mobile application development
  • Collie can stably process multiple objects using rendering pipelines
  • Supports useful features including sprite animation and user events
  • Stably supports iOS and Android, and renders with an optimized method for each platform
Reach: Collie


2. Processsing
  • Makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc
  • Adhers to web standards and without any plug-ins
  • We can write code using the Processing language, include it in web page, and Processing.js does the rest
  • Processing.js uses JavaScript to render 2D and 3D content on the HTML canvas element
Reach: Processing


3. TweenJS
  • The TweenJS Javascript library provides a simple butpowerful tweening interface
  • It supports tweening of both numeric object properties & CSS style properties, and allows to chain tweens and actions together to create complex sequences
  • Tweenjs requires a ticker function, which is included in EaselJS
  • If we are not using EaselJS, we must build your own ticker function that calls tick on the tweens.
Reach: TweenJS


5. Animo
  • Powerful little tool for managing CSS animations
  • It includes features like stack animations, create cross-browser blurring, set callbacks on animation completion
  • Limited Functionalities
Reach: Animo


6. SVG
  • Creates interactive, resolution-independent vector graphics that will look great on any size screen
  • And the Snap.svg JavaScript library makes working with SVG assets as easy as jQuery makes working with the DOM
  • Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking, clipping, patterns, full gradients, groups, and more
Reach: SVG


7. jsAnim
  • jsAnim is easy to include in websites and easy to animate with
  • Popular for its mushroom experiments
  • Easy to add mediocre animations to websites
Reach: jsAnim


8. Favicon
  • To add badges, images, or even video to your favicons
  • Favico.js makes it simple to add animated badges for your favicon
  • Easy creation of a favicon on the fly from an image, video, or even a live image from visitor’s webcam
Reach: Favicon


9. Motio
  • Small JavaScript library for simple but powerful sprite based animations and panning.
  • Motio has no dependencies, but there is an optional Motio jQuery plugin version available
Reach:  Motio


10. Headroom
  • A  lightweight, high-performance JS widget
  • Allows to react to the user's scroll
  • It slides out of view when scrolling down and slides back in when scrolling up
Reach: Headroom

 

No comments:

Post a Comment

Please Leave your Feedback / Suggestions