A Collection Of Amazing HTML5 Demos And Experiments

Gone are the days of boring websites that only used plain text pages and boring simple colors. Today, the possibilities are endless as to what can be produced.

With the current versions of HTML5, JavaScript and CSS3, you can create absolutely mind-blowing dynamic graphics and animations to spice up your ordinary website. These tools will allow your users to you use geolocation information, 360 degree views that they can move around and zoom at their leisure and ‘drag and drop’ file movements, plus many others; all without having to install any special software.

One element of this web design revelation is the < canvas > element. With canvas you can create extravagant yet efficient animations for pages utilizing JavaScript instead of Flash, thus eliminating the need for your visitors to continually have to update their Flash players. Canvas allows HTML5 to replace certain types of Flash animation with its ability to build dynamic, scriptable 3D rendering of shapes and combining bitmap images with Javascript to make controllable animations.

If you find that cool, hold on because HTML5′s capability is not done yet. Canvas also has the ability of 3D effect. Utilizing the canvas element along with Document Object Model (DOM) and JavaScript, the 3D effect is created, which can then be developed into 3D animation.

HTML5 is a wave maker in today’s world and is on the tip of everyone’s lips. In the following article you are going to see some HTML5 demos and experiments that will leave you speechless.

(Don’t try these HTML5 demos and experiments in Opera 12 or less cause they most likely won’t work, or Firefox cause they’ll crash your browser)

Motion graphic typeface

motion graphic typeface

3D Grapher – Launch

3D Grapher - Launch

Google I/O 2013 Experiment

Google I/O 2013 Experiment

30.000 Particles: A study creating performant particles with Canvas 2D

30000 Particles: A study creating performant particles with Canvas 2D

The warehouse

The warehouse

Interactive Typography Effects

Interactive Typography Effects

Ball pool

Ball pool

Flat surface shader

Flat surface shader

Ripples

Ripples

Surface waves

Surface waves

The planetarium

The planetarium

Wiper typography

Wiper typography

Block based destruction of HTML5 video

Block based destruction of HTML5 video

The scream

The scream

Canvas Rider

Canvas Rider

Sheep

Sheep

Canvas demo

Canvas demo

Bokeh

Bokeh

Cloth

Cloth

Universe

Universe

Subtitles added to a video with the track element

Subtitles added to a video with the track element

Pixelated

pixelated

Techniques for Creating Textured Text

Techniques for Creating Textured Text

Spiral

Spiral

Hypnos

Hypnos

Triangulation

triangulation

Plant trees

Plant trees

Enjoyed this article? Subscribe to read more like it

 
 
 
 
 

Sponsors