Skip to Main Content

4 Ways that Using Parallax will Enhance Your E-Commerce Site

Posted on 8.26.2015

:: By Larry Alton, @LarryAlton3 ::


Embracing the fluidity of the Web, parallax scrolling in Web design first appeared with Ian Coyle’s website for Nike, “Nike Better World.” This revolutionary concept spurred terms such as “immersive brand experience” and “interactive storytelling," effectively changing the playing field for brands looking to capitalize on e-commerce platforms. 

Why did parallax make such a difference in customer interaction? Derived from multiple camera use in animated films and classic video games, parallax scrolling in Web design is all about depth. This element of interactivity is created by deploying multiple elements moving on defined paths and at a set speed relative to the scrolling rate of the viewer; nearby objects often have a larger parallax than more distant objects, creating this sense of immersion.

Now, how does this relate to e-commerce you might ask. Think about the traditional relationship between a customer and an  online product - 2-D viewing, possibly hearing and reading. Now, think about the interaction that someone might have in a physical store - 3-D viewing, touching, hearing and the awareness of the branding of the store. Parallax enables the best of both worlds. Sellers are able to show all angles of their product in swift, continuous motion - motion that the customer has control over. 

Moreover, a brand is able to tell its story parallel to the progression of the product’s narrative, resulting in a  potent combination of product and information. Any call-to-action will be hard to resist when implemented well and the experience will linger even after leaving the site - an ideal marriage between physical principles and  an online medium. 

Here are four ways that using parallax will enhance your e-commerce site’s sales proposition:

1. Improved Product Engagement

When used correctly, parallax can be an effective tool for product presentation. Webydo - a SaaS Web design platform - notes in an article that, “You can add depth to your products, making them appear three dimensional. Parallax scrolling techniques [sic] can also be used to focus on the most relevant features of a product. Finally, the aesthetically pleasing sense of movement portrays products in the best possible light, allowing for detailed examinations and cursory overviews alike.” 

You can judge for yourself. Take a look at the subtle yet tasteful and strategic use of parallax on Apple’s latest Macbook release. From the first impression of the first element, you are invested: the perfectly timed movement parallel to your scroll, the fading text, and the white space enveloping the product, the Macbook’s elegant rotation opening and turning so that you see every feature, appreciate its functionality, and understand its streamlined beauty from every angle. 

There is a clear story here and a deep brand impression creating a sense of camaraderie. By displaying this product employing parallax, Apple positions visitors to choose one of those four purchasing options at the bottom of the page - completing the story arch. 

2. Higher Conversion To Sales

What do customers value the most? Engagement. Customers love to feel as if they have control over a situation when shopping online - parallax scrolling enables this feeling. It invites a certain curiosity and lets your visitors have some fun as they interact with what you are selling. Most importantly, this interaction happens on the viewer’s terms.

Consider the graphic novel advertisement used to promote Peugeot’s new HYbrid 4 technology. The comic plays as the viewer scrolls down the page, leading them through adventure and intrigue while discreetly selling them the car manufacturer's new technology. Capping off this story is a strong CTA to learn more about the technology, designed to convert. When you feel like you have control, you feel like the choice is yours. Think about it - would you click?

3. Stronger Brand Narrative

When looking for a product online, what do most customers want? A product with a good story. Parallax scrolling is one of the best ways to incorporate storytelling in a unique, inoffensive way to your e-commerce site. Content and images on a product page are given depth and context while these animations help to naturally highlight the value propositions of a given line or campaign. 

Through parallax, customers can pursue your goods and services with more ease and a greater sense of comprehension of who you are and why you want them to buy your product. This feature essentially opens a new world inside of your site which customers feel impelled to explore.

Take, for example Sony’s Be Moved Landing page. This page is an advertisement in the shape of a story. Through the use of parallax, the viewer is able to follow the beginning statement, “We are engineers, but we are also artists” with the subtext of ‘be moved’ through to the conclusion of, “When the World called us a Guinea Pig, we said Thank You.” Not only is this a compelling call to action that’s difficult to resist after such an entertaining journey, but also the entire experience deeply embedded the viewer into the story of the brand.

4. Greater Returns from CTAs

One of the most decisive factors in implementing parallax scrolling on an e-commerce site is its inherent ability to motivate action. It can enhance your call to action and give viewers that last push necessary to push them to click “purchase”. 

The concept of parallax scrolling is essentially returns-oriented. The more you scroll, the more something happens. It guides the viewer’s eyes to the CTA and promises your customers the same level of quality and intention as set forth in your site.

Dangers of Fracking is an excellent example of a site primed to make the viewer follow through with their CTA of supporting the FRAC Act and sharing on social. Hydraulic Fracturing, as most would agree is not the most approachable subject. Yet, through outstanding graphic design, complementary parallax animation and minimal text cues, this subject is intuitively ‘taught’ to viewers, encapsulating them in an immersive, interactive storytelling experience. By the time a viewer finishes the interactive display, they feel motivated to share the company’s CTA and moreover, an integral part of the cause.

Gone are the days when a company is simply selling products. To stay on top of the game and ahead of the competition, e-commerce sites must engage potential customers on the basis of storytelling and by creating a memorable experience. By creating a sense of immersion, parallax will help e-commerce sites build a deeper brand impression while putting forth a product value proposition too good to turn down, and maybe just good enough to tell others - that is after all, what happened with Nike.


Larry Alton is a professional blogger, writer and researcher who contributes to a number of reputable online media outlets and news sources. In addition to journalism, technical writing and in-depth research, he’s also active in his community and spends weekends volunteering with a local non-profit literacy organization and rock climbing. Follow him on Twitter and LinkedIn.

 Request Website Magazine's Free Weekly Newsletters 

Website Magazine Logo

Leave Your Comment

Login to Comment

Become a Member

Not already a part of our community?
Sign up to participate in the discussion. It's free and quick.

Sign Up

 

Leave a comment
    Load more comments
    New code
  •