Create an Awesome Rounded Carousel using MotionPath on ScrollTrigger - GSAP/Motion.page 🔥

Published: 30 October 2023
on channel: MotionPage
3,933
96

Hello guys! 👋🏻

In today's tutorial, we will be showing you the power of MotionPath! Using this feature, we can create an awesome-looking carousel which scrolls on an arc.

We will create an SVG that is used as the path for the elements to follow. We will also be using the ScrollTrigger trigger, along with a pinned element.

Additionally, we will animate some additional elements such as text and images, as well as the background colour of the main section.

We hope you like it!

00:06 - Intro
00:30 - Example
02:10 - Creating SVG
03:20 - Builder Setup
03:45 - Paste SVG Code
04:28 - Test AnimatePath in Motion.page
05:40 - Troubleshooting Common Problem
06:25 - Add All Images
07:34 - Add All Elements
12:30 - Continue Work in Motion.page
17:44 - Animate other Elements
23:23 - Start Animating the Section Background
28:01 - Finished Result
28:30 - Outro

----------------------------------------------------
Purchase Motion.page today - https://motion.page
CoreFramework - https://coreframework.com


Watch video Create an Awesome Rounded Carousel using MotionPath on ScrollTrigger - GSAP/Motion.page 🔥 online without registration, duration hours minute second in high quality. This video was added by user MotionPage 30 October 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 3,933 once and liked it 96 people.