8 Simply Amazing HTML5 Canvas and Javascript Animations

8 Simply Amazing HTML5 Canvas and Javascript Animations


8 Simply Amazing HTML5 Canvas and Javascript Animations

Introduction

HTML5 canvas has changed the way javascript used to be. We're now able to achieve complex animation however we do need a powerful browser to interpret it. The following is 8 new HTML5 + Javascript animation effect you probably have not seen before! Play with each of them, you'll be blown away by the creativity and robustness of HTML5 canvas!

I like Tunnelers and Bomomo the most! You've to try Bomomo, it's fun!

Advertisement
  • Tunnelers

    Processing to sketch out the animation and form, then rewrote it from scratch in Javascript / Canvas HTML5. Simply awesome and amazing!
  • The Mesmerizer

    A simple experiment with a 16x16 grid of squares. Moving the pointer over the squares causes colours to appear and bleed into adjacent squares with an effect that is quite mesmerizing. Try clicking the corner squares or typing on the keyboard for additional effects.
  • Burn

    A simple test of local pixel-based modifications of an HTML5 canvas drawing area. Hold a mouse button down for a "slide down" effect.
  • Cheloniidae Live

    This project is pure JavaScript, though it uses a library that dynamically recompiles JavaScript functions to implement operator overloading. (This is done inside the browser, not ahead-of-time.) Pretty fun, you can alter the code and make your own drawing!
  • Canvas 3D engine

    A 3D engine on canvas, currently supporting a collection of basic prefab shapes, textures, and basic interaction. Current work includes collada (import) support, and improved texture and lighting features.
  • Bomomo

    Best give it a try yourself... just use your mouse & mouse button! All of the sudden, I have become artistic. :)
  • DDD

    Move mouse to draw, drag to rotate. This one is pretty fun, you have to try to see it.
  • Plasma Tree

    Inspired by nature - a visual presentation of a algorithm

Author: Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Share the love

23 comments

Gordy
Fri, 16th September 2011
Has anybody tried Hippo Animator yet? It's like adobe edge but it works in all browsers including iPhone and IE6. http://www.hippostudios.co.uk Reply
Deepak
Wed, 5th October 2011
Excellent work by developers...thanks for organizing these here Reply
html5 nut
Fri, 4th November 2011
Flag burning using canvas particle effects: http://flagburningworld.com
Enjoy. Reply
Jack Stanley
Sat, 12th November 2011
You may also want to check mugeda.com. They do HTML5 animation online. Reply
ee
Thu, 24th November 2011
nice Reply
nursuraiya
Tue, 24th January 2012
it's so good Reply
Francivaldo
Mon, 6th February 2012
Inovador (BR)
INNOVATIVE
Reply
saravanan
Wed, 8th February 2012
excellent.... cool cool Reply
Carlos Lima
Fri, 13th April 2012
I developed some powerful tools for creating HTML5 Canvas animations. Please, check them out at http://www.redblizzard.com and let me know what you think. Reply
xisto
Wed, 6th June 2012
AMAZING...
Reply
pradeep
Thu, 2nd August 2012
its really great ! i,ve never seen this type of animation with html5 and jquery. thanks for this post. Reply

Leave a Comment

Please keep in mind that comments are moderated and rel="nofollow" is in use. You can use [code][/code] if you want to write codes. Don't spam us :) Thanks!

Advertisement