Awesome HTML5 Canvas and Video Demos

Awesome HTML5 Canvas and Video Demos

Hello everyone and welcome to the long weekend (for those of you in the US that is). The rest of us, well some of us even work on the weekends... This weekend I thought we would take a look at some really cool uses of the HTML 5 canvas and incorporating video into it.

Why? Just for the heck of it really. Plus, some of this stuff is insanely cool. Now I had the brilliant idea to include video of all of them, but I'm on my mobile Internet and while it is 3.5G, it's only 500MB a day, so I couldn't. You'll have to make due with images or go see the demos yourselves.

There's no real use for it, but the video explosion demo from Crafty Mind is just downright awesome. I suppose you could make a game out of it. Choose your favorite moment from a video, click to explode it and then sort the pieces like a jigsaw puzzle. It really is impressive that it can deform the video, while it's playing, in real time and then put itself back together.

Awesome HTML5 Canvas and Video Demos

Awesome HTML5 Canvas and Video Demos

This Html 5 Canvas experiment wasn't really video based, but was pretty cool so I included it. It ties into the social networks and the links are actually clickable.

Awesome HTML5 Canvas and Video Demos

Another cool one I found was The Wilderness Downtown. As can see in the demo that it takes input from the user in the form of an address and then creates a pretty cool film out of it with some really interesting effects.

Awesome HTML5 Canvas and Video Demos

The Ambilight project was pretty cool. I'm sure you've now all seen the ambient lighting systems that are included in some TVs or available as separate units. Well now you can get that same effect in an Html 5 video with a canvas.

Awesome HTML5 Canvas and Video Demos

This one is pretty wicked as well it incorporates all sorts of cool things in the canvas as well as video and dynamic content injection...notice the ReelSEO I typed in. This could certainly make for som pretty cool stuff in the long run as well.

Awesome HTML5 Canvas and Video Demos

All in all these really show off some of the ultra cool things that we will be able to do not only with HTML5 and video but with a wide range of other content as well. So get out there and make something. Who knows, maybe I'll include in my next article.

Posted in Video Technology
About the Author -
Christophor Rick is a freelance writer specializing in technology, new media, video games, IPTV, online video advertising and consumer electronics. His past work has included press releases, copy-writing, travel writing and journalism. He also writes novel-length and short fiction as part of Three-Faced Media . View All Posts By -

What do you think? ▼
  • http://www.facebook.com/people/Tomas-Eriksson/719266302 Tomas Eriksson

    HTML5 become cool and trendy after Apple refused Flash. So the big question is how these demos works on Iphone/Ipad.

    • http://www.reelseo.com/ Mark Robertson

      The only problem is that Apple isnt really using "open" HTML5. They only support the h.264 codec on Safari so if any of these are using webM or Theora, you are probably out of luck.

      • http://www.reelseo.com/ Mark Robertson

        just realized that you are probably asking about the non-video ones. Id love to have an ipad to tell ya ;-)

        • Christophor Rick

          Yes it would...when are we getting some? :D

      • Christophor Rick

        I know for a fact that at least two of those demos don't use H.264. Additionally, Apple hasn't announced full support for HTML5 at present which means that those canvas pages might not work properly at all in Safari right now.

  • http://www.tanitanis.com Arkadaslik

    Bloody awesome. I never knew any of those queries, and I’m meant to know these things!! LOL!!