Design your way

Wednesday, January 22, 2014

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








Source: http://ift.tt/1hhX49o

No comments:

Post a Comment

 

The Cash Box Blueprint

Most Reading