/Flash/ The art of parallax scrolling
18/09/2007 | Filed under Develop > Flash
Paul Wyatt shows you how to use the pseudo-3D parallax scrolling technique to add the illusion of depth to your portfolio or showcase sites. Get ready for some clever Flash fakery
Parallax scrolling sounds like something a doctor would prescribe antibiotics and three weeks of bed rest for. Thankfully, it’s nowhere near as unpleasant. In Flash, it’s a fake 3D technique that provides the illusion of depth and distance between layers. It’s based on multiplane cameras, which were used in traditional animation to move animation cells and backgrounds past the camera at different speeds and distances.
In the real world, if you walk down a street, turn your head to the right and watch the buildings as you pass them, you’ll notice one important thing: the objects nearer to you apparently move more quickly than the objects in the background. This depth is what you’ll be faking in Flash.
But it doesn’t end there. I’ll also show you how to make your scene move according to the position of the mouse pointer. You’ll learn how to create seamless graphics, then put it all together to make a site that’s ideal for anyone’s portfolio.
About the author:
Name: Paul Wyatt
Site: www.paulwyatt.co.uk
Areas of expertise: Website design, Flash, animation, interactive design and motion graphics
Clients: Lycos, Universal, Five
Favourite holiday destination: Scarborough
Click here to download the support files
Click here to download tutorial PDF
Bookmark with:
Comments
fel3232 / 25/11/2007 / 01:39 / http://www.livesteaua.com
I just downloaded the support files and I get some kind of an error. It sends me back to the main page. I wonder if there is a forum where I can solve that.
Thanks for the link.
andy / 30/11/2007 / 12:33
looks amazing. was thinking of doing a portfolio site with a setting, not decided on graphics yet though
paseka mohapi / 04/12/2007 / 10:52
I fand parallax scrolling very excating.but my problem is linking to my pages
Richard / 06/02/2008 / 09:25
This is very cool, but has anyone had any issues with the movie ceasing to work (just disappearing) after a short period of time? This happened in the orginal file and in the version that I created.
Nick / 09/04/2008 / 20:20 / http://www.nicholasklick.com
This is a cool tutorial. But the huge thing missing from this tutorial is that when you create your doubled movie clips (Step 8) you have to center this doubled clip on the zero.
That is... the spot where the clip repeats has to sit directly on 0 (zero). Hope that saves others the hours I wasted trying to figure that out..
Check out my implementation of this: www.nicholasklick.com
Ken / 03/08/2008 / 23:27 / http://www.groundsection.com
does this tutorial exist as actionscript 3.0? having trouble translating it myself from as2 to as3.
Mike / 20/11/2008 / 21:43
Great tutorial! Is there a way to stop the scroll when a button is clicked so I can load an external swf?
