Parallax scrolling is an awesome effect that has recently started gaining popularity on the web. The effect layers images and content which moves around at different speeds and many other variables as the user scrolls through the web page. Here are some awesome examples of effective use of parallax scrolling in web design.
Dangers of Fracking
Jess and Russ
This site is a nice example of using parallax scrolling for an interesting effect while not overusing the effect just to use it. As you scroll down the page you are introduced to boxes that help the viewer visualize their story. The boxes play well with the text content on the site to bring everything together in an interesting presentation.
This is one of the most visually interesting sites you can set your gazing eyes upon. This site employs an untraditional sideways parallax scrolling effect that is controlled by normal up and down scrolling to avoid user confusion. As you explore their website they create the experience that you are spending your day at the actual orchard itself!
This site uses the parallax scrolling effect in a slightly different way than the other examples that we have showcased so far. This site uses the scrolling effect to create the illusion of different sections on the site.
Inception Explained is an excellent use of parallax scrolling to explain the details of a movie that is quite complex to understand. As you scroll through the site, it details the story and highlights information via the parallax scrolling in a way that makes it easy to grasp much of the information.
This site really utilizes the parallax scrolling effect in a visually heavy way. As you scroll the entire page is changing images in the background as well as the foreground making the entire page interesting to look at.
360 LONG STREET ZURICH
This site, like a few of the others, tells a sort of story as the user scrolls through the site. This site uses the parallax scrolling effect coupled with Google Street View images to make the experience of the website very original and authentic as the user scrolls through the city like they are racing around on a wild police chase.
Nike pulls out all the stops on this one, using the parallax scrolling effect to really show off this shoe. As you scroll through the page you get an exhilarating experience of how the shoes are built for perfection.
This is an excellent use of parallax scrolling to tell a story. As you scroll through the web site you will see different characters being animated a little text to go along with the story.
This article was written for you by Chris Steurer, a freelance marketing consultant and designer for small and medium sized businesses. You can follow me on Twitter or circle me on Google+ to say hi and stay connected.