iPoint Insights (blog)

A Focus on Parallax Website Design

Related Insights

by | May 1, 2013 | Web Design

If you follow us on Facebook and Twitter, you’d know that iPoint undertook a parallax website project a few weeks back.  But what exactly is this new type of website design?  You have probably seen a few already- web pages that seem to be moving, with interactive background images and engaging content.  These pages take the user on a journey through the website, using a technique called the parallax effect.

Background:

This parallax concept has been around for longer than you may think.  In fact, in the 1940’s it was used to create an illusion of depth in 2D video games.  Later, this effect was adopted by the arcade industry throughout 1980’s.  Today, web developers have adopted this technology and many exciting and engaging sites are being created as a result.

How it works:

Parallax design is a common way companies have differentiated themselves from websites of the past.  Businesses today realize that their viewers want to be entertained, and this engaging design captures their viewers’ attention in 3 ways:

  • To form engagement through story telling
  • To guide users through their website
  • To create an element of surprise

Parallax scrolling allows images to move around the website at different perspectives and speeds- this adds an aspect of depth which gives the appearance of a 3D effect. 

The user focuses on the center point of the screen.  Multiple backgrounds move at varying speeds, thus creating the illusion of depth and motion- almost like a fake way of animating background images.

When considering building a parallax website, you should use Javascript for animating elements.  The reason for this is that Javascript is installed automatically on every web browser- unlike other applications such as Adobe Flash.  What good is a beautiful website if nobody can see it?

For more information on parallax website builds, or if you are interested in developing one of your own, click here or contact iPoint.