[maguirre]

For the web inclined guys here. What techniques are used to show motion/animation? looks quite smooth/impressive

[UnoriginalGuy]

As a web developer and web user I completely refuse to tell you, otherwise I worry you might copy this horrendous site design elsewhere.

This is a site anti-pattern (at least at desktop resolution). The site is only readable when I shrink the browser down until that terrible animated nonsense goes away.

[uptown]

It's an HTML5 video. If you inspect the page, you'll see the following:

  <video id="dyson-360-video">
  <source src="/video/dyson.mp4" type="video/mp4">
  <source src="/video/dyson.ogv" type="video/ogg">
  <source src="/video/dyson.webm" type="video/webm">
  </video>

So your browser determines which video to play based on your browser's capabilities. And the pagination can be handled with a technique as follows:

http://www.thepetedesign.com/demos/onepage_scroll_demo.html

[deanclatworthy]

It cycles through images based on scroll position. My colleague built a site that uses technique and made a library to make managing it easier.

The site: http://download.kone.com/ultrarope/index.htm

The code: https://github.com/kontur/jquery.video-frame-animation

[andyhmltn]

It seems heavily inspired by the recent Apple Mac Pro page redesign which is dissected here:

https://ihatetomatoes.net/apple-mac-pro-page-deconstructed/

Personally, I hate this kind of design as it breaks the scroll but it's interesting to see how it works none-the-less

[Cthulhu_]

HTML5 video, I'm sure. They used that on the Mac Pro website too - they had two videos for each 'image', one forward, and one in reverse. Some JS playback controls linked to scrolling, and that's pretty much it. Very nice results though.

[dimxasnewfrozen]

It's a series of images and videos is looks like. The video plays and then overlays an image (in the exact location that the video ended) on each scroll/navigation.