Scrollytelling: Creating a One-Page Web Experience
1h 18mIntermediate2021-07-02
Authors

Bill Shander
CEO and Founder of Beehive Media
Course details
What is scrollytelling? What can you do with it, and what are some alternatives? In this course, instructor Bill Shander answers these questions and more. Bill begins with a definition and example of scrollytelling, then gives you examples of its benefits for user engagement and narrative experience. He presents some alternative ways to tell stories on your website and offers some pros and cons for each. Bill goes over the technical components of what makes a scrollytelling experience and goes over some options for technologies you can use to create such experiences. He walks you through the complete process of turning your idea into a scrollytelling masterpiece using one particular approach, then concludes with useful advice on cleaning it up to deliver the best possible experience to your users.
Skills covered
Interactive Web ContentWeb DesignFront-End Web DevelopmentProjectWeb Development
Concepts
0. Introduction
- 01 - Scrollytelling for the web
- 02 - What you should know
- 03 - Using the exercise files
1. Why Scrollytelling
- 04 - What is scrollytelling
- 05 - Why scrollytelling is great
- 06 - Alternatives to scrollytelling
2. Technology
- 07 - Components of scrollytelling
- 08 - Technology options
3. From Idea to Scrollytelling Masterpiece
- 09 - HTML and CSS basics
- 10 - Scrollama setup
- 11 - Triggering events
- 12 - Test before you go too far
- 13 - Affecting other objects
- 14 - Making scrollytelling more dynamic
- 15 - Affecting things in any way you want
- 16 - Beyond triggering - Progressive dynamic actions
- 17 - Clean it up
Conclusion
- 18 - Next steps