Three Excellent Parallax Scrolling Sites (with tutorials)

Posted on October 4, 2012 at 2:12 am by David M Becker 4 Comments

Excellent Parallax Scrolling Sites… and tutorials.

Video games may at times implement the  parallax scrolling technique to alter your depth perception by moving several different layers of images at different speeds. This nifty technique can also be applied to the world of web design. This detailed post will consist of a list of nifty parallax scrolling sites, resource tutorials and design tips. If you are thinking about creating a parallax scrolling site this is a must read.

1. Ben The Bodyguard

The perspective seems out of whack, but having the character and train moving seem pretty neat.

2. Mario Kart

This Mario Kart site make me feel like I was playing the Wii. No not really. But its cool to watch the carts move around the track and the graphics scroll and shake. Very well done.

3. Art Of Flight

Art of Flight provides similar scrolling aspects to the Mario Kart site. Very well done and inspiring.

Things to Remember

If you are going to design a parallax scrolling site,  keep some of these factors in mind:

Pre-loading of the graphics: If your design is graphic intense or heavy you may want to preload the graphics so the user experience is seamless.
Keep Mobile devices in mind
: Test and debug in mobile devices. It may not feel the same as viewing through the many desktop browsers.
Remember Viewpoint sizes
:  Remember all display types monitors and resolutions.  (small, medium, large). What looks nice on one way not on another.

Offsite Tutorials

Here are some tutorials that you might find useful:

You might also likeclose