On: Google Green - The Story of Send

[mrtron]

How was this made? The browser scrollbar is even perfectly useable.

[evincarofautumn → mrtron]

Very well, that’s how. A quick look reveals that each scene is a section, the assets are linked with data attributes, and the rest is fancy combinations of TweenJS and Three.js animations, coordinated by /assets/js/main.min.js (which also handles the invisible history).

[thisisblurry → evincarofautumn]

It also appears that Swiffy, the SWF-to-HTML converter (http://www.google.com/doubleclick/studio/swiffy/) was used for helping to generate some of those animations.

[kodablah → mrtron]

Although they don't appear to use it, there is a project out there which does pathing like this: http://joelb.me/scrollpath/

[KeithMajhor → mrtron]

It's plain HTML5. That scrolling behavior isn't a freebie. The scroll bar you see is actually for an empty div. There's an attached scroll event handler that they're likely using to run the animation.