Video Background with Parallax Effect

  • 20 November 2016
  • 9 replies
  • 62 views

Badge

Does anyone know of a way to use a video background and have the sliding parallax effect? I am advertising very technical products and have begun using the video backgrounds. But I wonder if they would convert better if viewers could scroll with the parallax effect as can be done when using the standard image background. My video background section is just below the fold after the benefits and social proofs. Thanks


9 replies

Userlevel 7
Badge +4

Have you considered using an animated GIF instead of a video as the background? That way you can easily just check the box to add the parallax effect to that section.

Just an idea to consider if you’re looking for something quick and easy.

Badge

Yes, that’s a great idea. Will go that direction.

Jim Hill

Userlevel 6
Badge +1

@Jim_Hill although I am a big fan of both video bg’s and parallax, together may slow down your page quite a bit. Even an animated gif with parallax. These are big files plus the code to add the effect. Plus, it’s wonky on mobile.

I’m curious as to why you need parallax here and why you think you’re page would covert better with this?

You mention “very technical products” what are the videos being used for? Are these diagrams, schematics, etc. Perhaps there are better ways to illustrate.

Badge

Thanks for your feedback. The product is software which converts checkmarks, handwriting, and scanned images to text. One of them converts scanned paper invoices to text and then compares it to their accounting system. To describe these features in text takes a lot of writing. The LP’s focus mostly upon the benefits and not the features. Right now we are using a video background in one A/B test. It just takes up a lot of space and I wondered if having it be sticky while scrolling could help with conversions. I may look at a simple animated gif in one variation and just show on function, say converting handwriting to text. The video shows the whole operation and takes about 60 seconds before it starts over again. We have some professionally made videos but they are just too long and don’t show technical stuff, just the benefits. Looking at https://www.powtoon.com/ to help with custom animations. The reason I was wondering about parallax was just to give the impression of a smaller vertical space while scrolling. Here is one page we are using right now. Landing page

Userlevel 6
Badge +1

Hey @Jim_Hill just took a look at the LP.

There are way too many videos on this page. You really only need one! Something short and relevant that quickly sums up the product. I understand that your product is very technical, and perhaps there’s a fear that if you do not explain enough people won’t get it and convert - just an observation.

However, you CTA is “book a demo”. All you NEED to do is get them excited enough about the concept and an over view of 1-3 key features/benefits. Once you get them on a demo you can blow them away with all the other features.

I would focus your LP around a few key features and a really short video in the header, no need for it to be a BG. You can test some small animated gifs as well in the key features section, maybe panel by panel.

just my two cents. Message me if you want to chat some more about how we may be able to help you.

🙂

Badge

Thanks so much, will work on that. This page has been a poor performer, bet that is why! I’ll trim it down a bunch. I like your idea about one or two animated gifs further down, and only one single video on the page header, take the others out.

Userlevel 6
Badge +1

No problem. Let m know if you need any help.

Userlevel 7
Badge +4

Jim, ah, this page looks familiar! Didn’t you share it a few months back here on the forums? It looks different, but I remember the product now.

I would agree with @digibomb, that the page is very busy. I’d recommend trying to cut out at least 50% of the content and text. It is overwhelming.

Try to simplify it to just one main thought, and one main call to action. Everything else just needs to support that.

Best of luck with the page!

Badge

Yep, that was the page. I have created some scaled down versions for other products since then. But this page is just too busy. Back to work slimming it down! Thanks much,

Reply