Create PARALLAX SCROLL EFFECT In Figma | Figma Tutorial
Вставка
- Опубліковано 9 січ 2024
- #figma #parallax #figmaanimation
In this video, I'll show you how to create parallax scrolling animation in Figma. If you found this video useful then don't forget to like, comment, and share this video.
Image Link: www.freepik.com/free-vector/s...
Check Out Previous Videos
Fingerprint Animation: • FINGERPRINT SCANNING A...
Drop Down Animation: • How to Create Interact...
Onboarding Animation: • Create App ONBOARDING ...
UI Design Challenges: • Daily UI Design Challe...
UI Design Resouces: • UI Design Resources
Figma Animation Tutorial Playlist: • Playlist
Keywords: figma, figma tutorial, parallax animation, parallax scrolling animation, parallax scroll effect, figma prototypes, figma tutorials, figma tutorials for beginners, parallax animation in figma, website animation in figma
¡Genial!
@10:10 You can drag and select multiple prototype arrow paths. You can hold shift to select even more. This Dave's you time from doing one at a time
Love it! Very helpful, just what I was looking for, thank you! ❤
Glad it was helpful!
Vamos❤
damnnn😍😍😍
that's amazing! thank you, very clear! great job ;-)
Glad it helped!
❤❤Great! I appreciate for it. Thanks!❤❤
Glad you liked it
Great demonstration
Thank you!
THANKS BRO
U GAVE ME AN IDEAA TO TEST MY SKILLS
Great!
You solved my doubt in seconds❤
Glad it helped you
very helpful, thank you
Glad it was helpful!
It is an amazing tutorial
Thank you!
Nice tutorial ❤
Thank you! 😊
Its amazing 😊
Good job
Thank you so much!
I want to follow this but I don't understand the separating the foreground and background in AI. The layers are not seperate like what you have in the tutorial.
Thats a nice question but you can ungroup all the layers in AI, then select your desired layer copy it ctrl +C and then paste ctrl + V directy to figma, and repeat this process until you get all your desired layers seperated.
@@009hawks that's a lot or unnamed groups and layers ! How can i separate the?🥲
Thank you, sir
Welcome!
i found new figma legend bro love you
❤
Great
Thank you!
Very helpful
Glad it helped
Best video of the day... ❤
Thank you ♥
guys how do you separate the background and frontground of the image
Wonderful demonstration. Thank you for the tutorial. Could you link me to where you got the image and how you separated the background?
Thank you!
Please check the description for the image link and I have used Adobe Illustrator to remove the background.
nice
Thanks
Thanx Bro
Welcome!
You can press and hold the space bar while moving elements around without throwing them out of the frame.
Yeah!
Awesome video but what tool was used in creating the different individual elements? Like are there tools that be used to remove the whole background and leave the moon?? Or the other trees? You get my question right?
I have used the Adobe Illustrator to separate the background.
Sweeeet
Thanx!
how to add AI file in figma help me
Loved this... But can someone help me to publish this as a dedicated website pls
please what did u use to remove the background
I have used Adobe Illustrator to remove the background
Show love and subscribe. Thank you. Quick question is it possible to implement this into Wordpress (elementor) or better done without elementar or other page builders. Just wondering… thank you 😊
Yes, you can implement into WordPress using page builders.
Hi, where did you get these images? Also, how did you separate the foreground and background?
You can get these images from Freepik and I have used Adobe Illustrator to separate the background.
@@pixxelex Thank you!
is scroll and drag is samething?
No, that's what I was going to ask, about how can I do it with scrolling. Because it's different. To drag is to click and move the cursor and scrolling would be using the mouse scroll up and down
btw how to separate the image from its background, help me out in new to this.
I've used Adobe Illustrator to separate the background
Do you have a link to that background asset you are using in this tutorial?
Check the description for the asset link
From where did you get these pictures
Where can I search for?
Check the description, I have given the image link
Very cool! How would you get this to html?
Thank you! and you have to code it manually
Image should be downloaded in which format
Download the Adobe Illustrator file
Bro how did you separate the image from its background without the background being cut at 0:19? Please explain.
I've used Adobe Illustrator for removing the background
@@pixxelex Bro please explain in a video i need it. It's a request from your subscriber.
Just copy the foreground layers (inside Adobe Illustrator) and paste them inside the Figma. Same with the background layers.
How to seperate BG and foreground
You can use Adobe Illustrator
thank you
@@pixxelex
Can you post a video on it
@@pixxelex
Your tutorial is great and I've learned many new things. But please use your own voice and explain all the things. For example you're telling what to do with the next frame but you're not explaining why we have to make changes in the previous frames.
(And also the AI voice is annoying)
Thank you so much for your feedback. Will try to add my own voice in the future videos.
It's on drag not a scroll tutorial for that too
Yeah, it's just a prototype
Get some premium AI voice to narrate your videos. Or a different one....this free one is overused and fatigued to death. Other than that, thanks.
Thank you for your suggestion
Thank you! How about on scroll ?
Welcome! It's just a prototype