Как верстать сайты как на awwwards.com?

Всем привет! Вопрос к профи.

Есть такие ресурсы:
http://www.awwwards.com/awards-of-the-day/
http://www.cssdesignawards.com/wotd-award-winners/
http://thefwa.com/

На них ежедневно публикуют лучшие в мире сайты, с технологической и дизайнерской точки зрения.

Помимо Canvas, WebGL и прочего, одной из особенностей таких сайтов является Анимация. Подскажите какие-нибудь готовые решения или советы что нужно изучать, что бы уметь реализовывать такие сайты.

Вот несколько примеров:

  1. http://www.anniecollections.com/ – анимация при прокрутке
  2. https://www.rezo-zero.com/en — загрузка сайта плавная и с определенной последовательностью, переходы между разделами сайта плавные без видимой перезагрузки страницы

Любой из этих сайтов может стать для вас живой инструкцией, если вы умеете пользоваться инструментами разработчика в браузере (инспектор, консоль, отладчик…)
Все исходники доступны, если разобраться.

Спасибо! Буду благодарен, если кто-нибудь подскажет какие-нибудь готовые решения, на основе которых делается амимация и загрузка как на сайтах в примерах 1 и 2!

такая анимация создается с помощью JavaScript, jQuery.

На WordPress много подобных нужных для вас скриптов, которые можно разобрать, они написаны на JS.
Рисованные видео, это дудлы.