Framer Parallax Trick (Loop & Scroll Speed Tutorial)

Опубликовано: 11 Март 2025
на канале: Tim Gabe

13,292

276

In this Framer Tutorial you will learn how to create a parallax scroll effect using some underrated settings and techniques.

🔴 Working File: https://timgabe.com/resources/sneaky-...

Timecodes
0:00 - Introduction
0:45 - Starting the creation of the frame in Framer.
1:15 - Positioning and sizing image frames.
1:51 - Discussing the removal of animations for initial setup.
2:30 - Adding and configuring the particles component.
3:14 - Customizing particle colors and settings.
4:03 - Locking layers and discussing layer management.
4:49 - Inserting and adjusting images within frames.
5:33 - Creating and applying a blur effect for a glass look.
6:26 - Finalizing the layout and discussing opacity settings.
7:05 - Adjusting image rotation and pinning for responsiveness.
8:02 - Organizing text fields into a stack for layout management.
9:01 - Preparing for animation: setting up the section frame.
10:03 - Demonstrating text fade-in as part of scroll animation.
11:00 - Applying scroll speed effects to images.
12:03 - Adjusting scroll speed settings for image animations.
13:06 - Adding loop effects for continuous image rotation.
14:18 - Setting up scroll-triggered animations for text.
15:50 - Copying and applying effects to multiple elements.
17:51 - Final adjustments and troubleshooting cut-off issues.