Skrollr Workshop

Learn how to create SVG drawing effect using Skrollr.js.

Module 1 Overview
Unit 1 Introduction
Module 2 SVG
Unit 1 Creating SVG In Illustrator
Unit 2 Exporting SVG From Photoshop And Illustrator
Module 3 Fullscreen layout
Unit 1 Full-Screen Background Image
Unit 2 Resizing The SVG To Fullscreen
Unit 3 Multiple Background Containers
Module 4 Scrolling SVG animation
Unit 1 Data-Attributes To Fade Out Text And Draw SVG Line
Unit 2 Draw SVG Line Continue
Unit 3 Cross-Fade Transitions and Adding Easing
Module 5 Fade and "horizontal" scrolling
Unit 1 Fading In First Features
Unit 2 Fading Features Reveal
Unit 3 Animating iMac From The Right
Unit 4 Zoom out iMac And Fade In CTA Button
Module 6 Mobile and responsive workflow
Unit 1 Mobile And Responsive Approach
Unit 2 Turn It Off For Mobile
Module 7 Skrollr menu
Unit 1 Adding Skrollr Menu
Module 8 Module 8 - Q&A
Unit 1 Your Questions Answered - Skrollr Workshop