From previous attempts of ideas that didn’t work i had now decided that the stop-motion technique is something that best suited my web banner vision. I took a 3rd batch of photographs in the sequence that I wanted and then followed this process to prepare the images.
1. Firstly, I resized my images in photoshop to reflect the size of my composition window by using the website http://www.batchresize.com. This meant that i did not have to individually alter each photograph, and that it would resize all of them.
2. Secondly, I renamed all the images into a number sequence so they would be read easily from start to end.
3. Thirdly, I then created a new composition in Adobe After Effects and imported my stop-motion and dragged it into the window. This produced one layer, where each image lasted for one frame, so the whole animation was very fast.
4. I then had to make it slower by using time remapping and adding keyframes to each individual frame.
5. Then, because my footage wasn’t long enough to fit the size guidelines of a web banner, I duplicated the footage and placed them next to each other to allow the banner to be extended.
This was an effect that I thought would work really well at the top of a website as it would run across the screen, grabbing the users attention, however I faced a problem at this stage. Because I was using multiple footage the shoes were running into eachother, and therefore the first shoe was entering the second screen and conflicting with the next shoe on the first. Here is a screen shot of what I am describing. You can see the brown shoe and the orange shoe are clashing into each other and this clashing continues throughout the animation.