I am a big fan of creative and captivating site design. One way of telling your story through your website’s design is by using animates scrolling effects. How they work is the viewer controls the animation and presentation through the amount the scroll wheel has been moved. Every pixel scrolled triggers a movent to some aspect or object on the web page. In many cases the web designer makes a sort of symphony with the multitude of events being moved and morphed on the page. You can see some past blog posts of mine on animated scrolling website designs here.
Here are some more recent orchestrations of stories being told in that fashion below. For this blog I am including video screen captures with the screenshots of the site as some of the sites in my older blog posts have since disapeared and there is no longer a way to see how they animated in the past. Live and learn 😉
(Note: Click the titles of each site to visit their webpage)
Fishy
I really liked the use of paper like textures on the site. It makes it feel like a book or pamphlet has exploded into life. I also really liked how they put a whole slew of characters and objects into motion without making the site feel cluttered or confusing. This site is a super rich scrolling experience.
Ikayzo
Your really gonna like this one. Not only are the graphics smooth, but they capture a great affect and time-period quite elegantly. The concept of having a single machine traverse and change as it scrolls through the deeper pages within it, while also tying it into the story being told is exceptionally well done.
Super Chemical
It was the subtle animations created in the background that really caught my eye on this one. There wasn’t as many objects in motion in the foreground as the others, but the scenery chosen to be animated did a good job supplementing the site instead of going heavy on the scroll animations being the star of the show. It looks like these guys put up a new version of the site quite a bit so check out the video, but makes sure you check out the site as well as they may already have a new one out by the time you read this.
CSSPiffle
A good use of foreground and background in the scrolling animation. Also a great demo of their product offerings, and I like that it is their “pitch deck” (Something given to clients or investors which is usually done in a power point or pdf).
Bagigia
I really give credit to this site. It is a site for a leather bag which could easily have been made into a static site like others in their space. They do a great job display the bag using a 3d rotation, and also do a cute tie in between the scroll and the bag by using a zipper as the scroll progress bar at the bottom of the screen.
You can find more here: http://favbulous.com/post/983/23-stunning-parallax-scroll-websites-you-have-to-know
Sean Shadmand 