Use cases.md

1. Scroll-triggered animations

---

Trigger an animation based on scroll position:

• https://info.internet.org/en/
• http://www.nurturedigital.com/work/pfister-react
• http://fantasy.co/work
• https://www.pumperlgsund-bio.de/de/
• http://us.rimmellondon.com/ (Perhaps This example uses scroll snap)
• http://tomerlerner.com/web/scroll/index.html#top (dito)
• http://graphicnovel-hybrid4.peugeot.com/start.html (AutoPlay)

Play an animation continually within a certain scroll range:

• http://www.kabu-kitamura.com/colon/en/

Animation stops playing once the scroll position leaves a certain range but continues to the end of the current iteration:

• http://www.dementialab.org/ (time-base animation is made by Flash!)
• http://www.dementialab.org/conclusion/ (time-base animation is made by Flash!)
• http://www.cabletv.com/the-walking-dead (Last slides)
• https://scrollrevealjs.org/
• https://ihatetomatoes.net/demos/one-page-scroll-animations/
• http://www.beoplay.com/products/beoplayh5#magnetic

Multiple scroll-ranges:

• http://www.exsus.com/highway-one-roadtrip (some animation related with wall clock)
• http://neomam.com/interactive/13reasons/ (Dit)
• http://pitchfork.com/features/cover-story/reader/savages/
• http://www.soleilnoir.net/believein/#/end

2. Scroll-triggered style changes

---

• http://unformedbuilding.com/articles/fixed-nav-with-jquery/

3. Scroll-linked animations

---

Scroll position controls progress:

• http://alfredservice.com/ (controls animation progress, even movie progress)
• http://www.flatvsrealism.com
• http://makeyourmoneymatter.org/
• http://www.dementialab.org/discovery-lab/
• http://lostworldsfairs.com/atlantis/
• http://everylastdrop.co.uk/
• http://www.madwell.com/work
• http://www.fannabee.com/
• http://www.culturalsolutions.co.uk/
• http://jason-kenny.com/
• http://lamoulade.com/#!/home
• http://www.nytimes.com/projects/2013/tomato-can-blues/?hp
• http://www.unfold.no/
• http://www.arnoldclark.com/challenge/
• http://cyclemon.com/
• http://www.bbc.co.uk/news/special/2014/newsspec_7617/index.html
• http://johnpeelarchive.com/joe-boyd/#TOOTS
• http://nasaprospect.com/
• http://allout.org/en/
• https://www.washingtonpost.com/graphics/sports/olympics/scale-of-the-olympics/?%3Ftid%3D=sm_pg&%3Ftid%3D=sm_pg (scroll → zoom)
• https://www.invisionapp.com/product-design-industry-report-2016

4. Combination scroll and time-based animations

---

• http://www.nytimes.com/projects/2012/snow-fall/#/?part=tunnel-creek
• http://www.gestrandete-wale.info/
• http://cuberto.com/