Getting to Know Parallax Scrolling

Parallax scrolling was on almost everyone’s list of predictions for this year, but the community has been oddly quiet on the topic for a little while, most likely because it requires more finesse than many of the other trends on the tips of designers’ tongues.

To use parallax scrolling, you have to thoroughly understand what it is and how to use it. You can’t just follow a simple tutorial. You have to design around parallax ideas which requires much more time and focus.

To see the effect in action, click the image.

For those unfamiliar with the niche trend, parallax scrolling is a technique that happens when multiple layers of information and images are combined and move at different speeds to create movement, depth, or a 3-D appearance. What makes parallax scrolling different from other similar uses of this technique is putting the power in the hands of the user. Instead of an automated effect, the visitor controls the illusion with their mouse.

It is a tricky method to master, and requires quality resources to work properly. A great parallax scrolling page is easily ruined with low quality images. The scrolling can be vertical or horizontal. Though vertical scrolling is by far the more popular, horizontal scrolling is gaining a following slowly.

While it is difficult, parallax has some unique advantages over other types of designs. Many use the technique simply for aesthetics, but it also changes how users interact and read a webpage.

One of the easiest ways to see how parallax changes browsing patters is to look at its storytelling capabilities. Parallax scrolling can turn your average webpage into an interactive storybook that users can move through at their own pace. Where videos usually require sound and complete attention, stories can be told with parallax scrolling that puts the user in control, and won’t be as prone to get visitors in trouble when their at work.

Parallax scrolling is also especially adept at showcasing products. Like an online catalog  parallax techniques can make it appear as if you are flipping through a group of products, or seeing multiple angles of the same item for a better idea of what it really looks like, all while keeping the focus directly on the product by putting it front and center.

Carrie Cousins from Designmodo has a few other ideas of how you can use parallax scrolling, but the best thing to keep in mind about parallax scrolling is, as Cousins says, “the backbone of parallax is user experience.” Parallax techniques engage and intrigue users in a way that makes them feel as if they are experiencing web sites in a new way entirely. Don’t squander it with bad UX.