>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