Scaling Section Animations Inspired by Patagonia | A Webflow Tutorial

- ABOUT -
I love how the current Patagonia website (patagonia.com) uses this animation to introduce full-bleed sections. They initially start out inline, with white padding around them. And, as you scroll through the section, the padding scales out. It's such a great way to transition to full width content. Let's recreate it in Webflow.

- CHAPTERS -
Intro | 00:00
Building the infrastructure | 01:01
Adding the white padding | 04:32
Adding the scale animation | 06:00
Preview of next week's video | 09:48

-- SKILLSHARE --
If you're a beginner or intermediate user, check out my Skillshare class: "Webflow for Beginners." Together, we create a simple one page portfolio website for a photographer, starting with the assumption you don't have any experience with HTML, CSS, or Webflow. Use the link below to get 2 months of Skillshare for free.
https://skl.sh/2PU9tML

-- Links --
Staging URL:
https://jocando-tutorials.webflow.io/patagonia-video-intro

Read Only Link:
https://preview.webflow.com/preview/jocando-tutorials?utm_medium=preview_link&utm_source=designer&utm_content=jocando-tutorials&preview=b1ade817df2e41566f53d6b876d5b9f9&pageId=61619be8c084973a259ba46e&workflow=preview

All Tutorials:
https://jocando-tutorials.webflow.io/

- ABOUT ME -

Serve - My Creative Studio’s Site
https://www.madebyserve.com/

Dribbble
https://dribbble.com/Jose_Ocando

Twitter
https://twitter.com/jaocando

Видео Scaling Section Animations Inspired by Patagonia | A Webflow Tutorial канала Jose Ocando