Video Scroll

Posted on Posted in Websites

Overview

Hoffi were invited to attend a two day convention by the BBC and compete with other companies to develop an interactive advertising campaign for the programme Hinterland. Over the two days each company had to develop a prototype that would showcase their respective idea for the advertising campaign. We as a team at Hoffi came up with an idea where users would play an interactive mystery game using a mobile device or computer. The game would be tailored to each individual user using their Facebook and Twitter details. To make the experience more interactive there would be an option for the user to use binaural audio, webcam, mobile number and Snapchat. I was allocated the role of developing a scroll video similar to Langstrasse which would be used to unease the user.

I created the scroll video by converting a 30 second video to an image sequence containing 500 images. I then implemented a scroll system using HTML, CSS, JavaScript and JQuery which would change the image source every scroll. This technique makes the user feel more involved and in control of the experience like they are walking through the corridor.

Screenshots

Technologies

  • JavaScript
  • JQuery
  • HTML
  • CSS
  • Parallax scrolling
  • Image sequence