- 153
- 1 086 967
Pixxelex
India
เข้าร่วมเมื่อ 16 ก.พ. 2021
All About Designing...
For Business: rohanrhn.work@gmail.com
For Business: rohanrhn.work@gmail.com
MOTIFF: Speed Up Your UI Design 10x Using This AI Tool
Discover Motiff, a powerful UI design tool with AI features like UI generation, AI Reduplication, and AI Magic Box to speed up your design process. I have explained about them in this video.
If you found this video helpful, don’t forget to like, comment, and share the video.
Try Motiff: motiff.com/
Check Out Previous Videos
Advanced Image Slider: th-cam.com/video/D2FZkt7EXnw/w-d-xo.html
Parallax Image Slider: th-cam.com/video/_W4oVbPxq5U/w-d-xo.html
Modern Landing Page UI: th-cam.com/video/FcguhJoYne4/w-d-xo.html
UI Design Challenges: th-cam.com/play/PLBblYKb7F1vr3b_N8ZuagaJDAaq1zWrfa.html&si=vYKY0eAWmHI9H4kn
UI Design Resouces: th-cam.com/play/PLBblYKb7F1vpVughMvteE5FP4PSot0sq7.html
Figma Animation Tutorial Playlist: th-cam.com/play/PLBblYKb7F1vpEIYsbTdzTUO3EbMkWOWuc.html
If you found this video helpful, don’t forget to like, comment, and share the video.
Try Motiff: motiff.com/
Check Out Previous Videos
Advanced Image Slider: th-cam.com/video/D2FZkt7EXnw/w-d-xo.html
Parallax Image Slider: th-cam.com/video/_W4oVbPxq5U/w-d-xo.html
Modern Landing Page UI: th-cam.com/video/FcguhJoYne4/w-d-xo.html
UI Design Challenges: th-cam.com/play/PLBblYKb7F1vr3b_N8ZuagaJDAaq1zWrfa.html&si=vYKY0eAWmHI9H4kn
UI Design Resouces: th-cam.com/play/PLBblYKb7F1vpVughMvteE5FP4PSot0sq7.html
Figma Animation Tutorial Playlist: th-cam.com/play/PLBblYKb7F1vpEIYsbTdzTUO3EbMkWOWuc.html
มุมมอง: 696
วีดีโอ
Create ADVANCED Image Slider Animation In Figma | Figma Tutorial (With Voice)
มุมมอง 3K14 วันที่ผ่านมา
In this video, I tried to explain how to create an advanced image carousel animation using Figma. If you found this video useful, don't forget to like, comment, and share the video. Check Out Previous Videos Interactive Feedback Animation: th-cam.com/video/c7vN6m7MWW4/w-d-xo.html Revealing Scroll Animation: th-cam.com/video/Dbvxfq3X47k/w-d-xo.html Portfolio UI/UX Design: th-cam.com/video/b5sYBm...
Create AMAZING Interactive Button Animation Using Figma | Figma Tutorial
มุมมอง 1Kหลายเดือนก่อน
In this video, I tried to show you how to create an interactive button hover animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Horizontal Parallax Animation: th-cam.com/video/385PVKUUN5Q/w-d-xo.html Revealing Scroll Animation: th-cam.com/video/Dbvxfq3X47k/w-d-xo.html Sticky Scrolling Animation: th-cam.com/video/...
Create Interactive Star Rating Animation In Figma | Figma Tutorial
มุมมอง 1.8Kหลายเดือนก่อน
In this video, I tried to show you how to create an interactive star rating animation. If you found this video helpful, don't forget to like, comment, and share this video. Check Out Previous Videos Parallax Slider Animation: th-cam.com/video/_W4oVbPxq5U/w-d-xo.html Up/ Down Slider Animation: th-cam.com/video/5cCe3fM6sPc/w-d-xo.html Refracted Glass Effect Animation: th-cam.com/video/80IxygJl8Cc...
How to Create Full Page Website Scroll Animation In Figma | Figma Tutorial
มุมมอง 9Kหลายเดือนก่อน
In this video, I tried to show you how to create a full-page website scrolling animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. 🔴Portfolio UI Design (Part-1): th-cam.com/video/b5sYBmFI2RE/w-d-xo.html Check Out Previous Videos Parallax Image Slider: th-cam.com/video/_W4oVbPxq5U/w-d-xo.html Modern Landing Page UI Design: th-cam.com/video/...
Create Full Website UI/UX DESIGN From Scratch In Figma | Figma Tutorial
มุมมอง 9K2 หลายเดือนก่อน
In this video, I tried to show you how to create a personal portfolio website UI design from scratch in Figma. If you found this video useful, don't forget to like, comment, and share this video. Portfolio Web Animation (Part 2) - th-cam.com/video/c6YL6-dsLCE/w-d-xo.html Check Out Previous Videos Curved Carousel Animation: th-cam.com/video/yk2DflmxmXI/w-d-xo.html Travel Website UI Design: th-ca...
Create PARALLAX IMAGE SLIDER Animation Using Figma | FIgma Tutorial
มุมมอง 7K2 หลายเดือนก่อน
In this video, we will learn how to create a unique parallax image slider animation using Figma. If you found this video helpful, please remember to like, comment, and share. Check Out Previous Videos Interactive Video Hover: th-cam.com/video/r2Ff76AGrtc/w-d-xo.html Advanced Card Animation: th-cam.com/video/-CallQaRgYk/w-d-xo.html Advanced Image Slider: th-cam.com/video/cPSU3CbH5qE/w-d-xo.html ...
Create AMAZING Interactive Button Animation Using Figma | Figma Tutorial
มุมมอง 5K2 หลายเดือนก่อน
In this video, I tried to show you how to create an interactive button hover animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Auto Scrolling Text: th-cam.com/video/QYkdzTGy7uc/w-d-xo.html Bouncing Ball Animation: th-cam.com/video/3m0NHZz7ncI/w-d-xo.html Floating Button Animation: th-cam.com/video/Aa5QVUHX5J4/w-...
Create HORIZONTAL PARALLAX EFFECT Animation In Figma | Figma Tutorial
มุมมอง 4.4K2 หลายเดือนก่อน
In this video, I tried to show you how to create a horizontal parallax animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Advanced Image Slider: th-cam.com/video/D2FZkt7EXnw/w-d-xo.html Endless Card Carousel: th-cam.com/video/P5qEU73IPr8/w-d-xo.html Sticky Sidebar On Scroll: th-cam.com/video/4kTjNGrl9yM/w-d-xo.ht...
Create INTERACTIVE Video Hover Animation In Figma | Figma Tutorial
มุมมอง 4.1K2 หลายเดือนก่อน
In this video, I tried to show you how to create an interactive video hover animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Modern Slider Animation: th-cam.com/video/cPSU3CbH5qE/w-d-xo.html Card Swiping Animation: th-cam.com/video/G2Ri1aV6ky8/w-d-xo.html Sticky Sidebar On Scrolling: th-cam.com/video/4kTjNGrl9y...
Create ADVANCED Image Slider Animation In Figma | Figma Tutorial
มุมมอง 4.8K3 หลายเดือนก่อน
In this video, I tried to show you how to create an advanced image slider animation, which is likely a swipe animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Interactive Hover Animation: th-cam.com/video/nk7Bw38qoZw/w-d-xo.html Endless Spinning Animation: th-cam.com/video/An9IqPnqu2c/w-d-xo.html Refracted Glass...
How To Create CURVED Carousel With Endless Auto Scrolling In Figma | Figma Tutorial
มุมมอง 4.9K3 หลายเดือนก่อน
In this video, I tried to show you how to create an endless scrolling animation with curved carousels using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Revealing Scroll Animation: th-cam.com/video/Dbvxfq3X47k/w-d-xo.html Image Slider Animation: th-cam.com/video/ygguk1mbdkQ/w-d-xo.html Parallax Scroll Animation: th-cam.com...
Create ADVANCED Image SLIDER Animation In Figma | Figma Tutorial
มุมมอง 4.6K3 หลายเดือนก่อน
In this video, I tried to show you how to create a minimalistic animated landing page with slider animation for a portrait-showcasing website using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Revealing Scroll Animation: th-cam.com/video/Dbvxfq3X47k/w-d-xo.html Parallax Scrolling Animation: th-cam.com/video/sc3eI-vgsn0/w-d...
Create ADVANCED Image Slider Animation In Figma | Figma Tutorial
มุมมอง 6K3 หลายเดือนก่อน
In this video, I tried to show you how to create a slider animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Image Slider Animation: th-cam.com/video/36UbHfpakCk/w-d-xo.html Revealing Scroll Animation: th-cam.com/video/Dbvxfq3X47k/w-d-xo.html Parallax Scrolling In Figma: th-cam.com/video/sc3eI-vgsn0/w-d-xo.html U...
Create Image Slider Animation In Figma | Figma Tutorial
มุมมอง 5K4 หลายเดือนก่อน
In this video, I tried to show you how to create an image slider animation using Figma. If you found this video useful, don't forget to like, comment, and share this video. Check Out Previous Videos Accordion Card Animation: th-cam.com/video/7gQ8XsmubsU/w-d-xo.html Refracted Glass Effect: th-cam.com/video/80IxygJl8Cc/w-d-xo.html Endless Auto Scroll: th-cam.com/video/n4lbfl5rXsw/w-d-xo.html UI D...
Create ENDLESS CARD CAROUSEL Animation In Figma | Figma Tutorial
มุมมอง 3.8K4 หลายเดือนก่อน
Create ENDLESS CARD CAROUSEL Animation In Figma | Figma Tutorial
Create INTERACTIVE Card Hover Animation Using Figma | Figma Tutorial
มุมมอง 15K4 หลายเดือนก่อน
Create INTERACTIVE Card Hover Animation Using Figma | Figma Tutorial
Create ADVANCED Card Animation In Figma | Figma Tutorial
มุมมอง 5K4 หลายเดือนก่อน
Create ADVANCED Card Animation In Figma | Figma Tutorial
Create ADVANCED Image Slider Animation In Figma | Figma Tutorial
มุมมอง 104K5 หลายเดือนก่อน
Create ADVANCED Image Slider Animation In Figma | Figma Tutorial
Create UP/DOWN Image Slider Animation In Figma | Figma Tutorial
มุมมอง 13K5 หลายเดือนก่อน
Create UP/DOWN Image Slider Animation In Figma | Figma Tutorial
Create PARALLAX CARD Animation In Figma | Figma Tutorial
มุมมอง 7K5 หลายเดือนก่อน
Create PARALLAX CARD Animation In Figma | Figma Tutorial
Create MODERN Landing Page UI Design In Figma | Figma Tutorial
มุมมอง 18K5 หลายเดือนก่อน
Create MODERN Landing Page UI Design In Figma | Figma Tutorial
Create REVEALING SCROLL Animation In Figma | Figma Tutorial
มุมมอง 6K5 หลายเดือนก่อน
Create REVEALING SCROLL Animation In Figma | Figma Tutorial
Create Cool HOVER ANIMATION In Figma | Figma Tutorial
มุมมอง 2.5K5 หลายเดือนก่อน
Create Cool HOVER ANIMATION In Figma | Figma Tutorial
Create Unique CARD HOVER Animation In Figma | Figma Tutorial
มุมมอง 9K6 หลายเดือนก่อน
Create Unique CARD HOVER Animation In Figma | Figma Tutorial
Create ACCORDION Card Animation In Figma | Figma Tutorial
มุมมอง 7K6 หลายเดือนก่อน
Create ACCORDION Card Animation In Figma | Figma Tutorial
Create ENDLESS Spinning Carousel Animation In Figma | Figma Tutorial
มุมมอง 4.6K6 หลายเดือนก่อน
Create ENDLESS Spinning Carousel Animation In Figma | Figma Tutorial
Create ENDLESS Auto Image Slider Animation In Figma | Figma Tutorial
มุมมอง 4.8K6 หลายเดือนก่อน
Create ENDLESS Auto Image Slider Animation In Figma | Figma Tutorial
Create Card SWIPE Animation In Figma | Figma Tutorial
มุมมอง 8K6 หลายเดือนก่อน
Create Card SWIPE Animation In Figma | Figma Tutorial
Create ENDLESS Auto Slider Using Figma | Figma Tutorial
มุมมอง 3.9K7 หลายเดือนก่อน
Create ENDLESS Auto Slider Using Figma | Figma Tutorial
thanks dude! appreciate you for doing this
thank you so much ^^
Wow perfect
Thank you!
hey bro, good evening! why does after creating the final variation, the auto layout doesn't function well, like I cannot get the final variation out of the variation 1. like after selecting the horizontal type layout and selecting also the align middle and setting the horizontal gap on 100, the final variation is still inside the variation 1, like they are still attached to each other. that's where im stuck, i haven't made any progress for about 8 hrs now. pls help me brother.
Make sure to add the auto layout to the parent frame. ( Check 01:44 , like Frame 16 )
@@pixxelex okay ill check. anyways, also do you have tutorials also about making a basic full page website like what should be the tools to use in making the index? thanks also!
@@pixxelex that's exactly what I did, I don't know what went wrong, I followed your steps multiple times already :(((
No worries, you can skip the auto layout part and just place the frames side by side manually. Just make sure to follow all the steps for creating components and adding prototypes. It should work out fine! And for full page website design, you can check this tutorial: th-cam.com/video/b5sYBmFI2RE/w-d-xo.html
please continue designing you are so inspiring for me
Sure! and I'm glad videos are helpful.
How you are changing it to portraits at 6:33 ? , I have followed all the steps
Make sure to follow all the steps at 02:44. Then, you can select all the texts and move them to show the desired text.
Unfortunately my main component moves all the objects even on final version for some reason and i have no idea how to fix it. I followed step by step and watched like 10 times figma has now new interface and probably some features are not activated cause it doesn't work lile in tut😢😢😢😢
Thanks a lot u help me verry much and ya btw can u do an small thing for me can u tell me your outro song name thanks
Glad this was helpful! and song name is: You & I - Culture Code
tysmm 💖💖💖💖
Welcome 😊
Ok, but how to export all this?
Unfortunately, we can't export it
For a complete noob that was really hard to follow.
Actually, these videos are advanced Figma prototypes. For beginner-friendly Figma prototype tutorials, you can check out my channel.
Thank you so much for the video. It's really helpful. Also, how do you get your fonts, I don't have the 'Gilroy-ExtraBold' you used
Glad it was helpful! And this font is paid one.
This is working. But after coming back from another frame ,this is not working properly.The cursors doesnt stop blinking
can anyone tell me how to seperate element from pic ?
Hi, thanks for this. I am wondering why setting the passthrough to 0 when you move those items (like in 2:34)?
So in animation, it'll show a fade-in effect
where to get full page design
You can check the description for Behance link
You need more varieties of music for you videos, this one here especially is on almost all your videos and it keep repeating in my head when i go to bed, i cant get it out
Noted!😅
@@pixxelex if you need exclusive beats i can give you some
Thanks bro I found the solution I'm looking for to finish my portfolio! ❤
Glad it was helpful!
Thank you for the tutorial but mine is not responsive
Welcome! Yeah, this design is not responsive.
What an amazing video tbh gj man
Glad you enjoyed it
you had the two images/text frame and made them into a component, but when you drag in the component from the assets its only one image/text. What happened there?
This is how a component works in Figma. We made one component out of two images.
Your tutorial was of great help, Thank you so much
Glad to hear that!
Hello, quick question, thank you for your work. First of all, how do you export the animations from figma to framer or webflow because I don't know, I have the impression that we can only export the design and do we have to redo the animations on webflow and framer?
Yes, you have to do it manually on Framer or Webflow
Which plugin you used for images ?
Plugin: Lummi
if u can speak plz speak
that you man this is so clear
Glad it was helpful!
Hey can u create some 3d animation
Hey, why do you decrease fill opacity when making components?
So dope man thx a lot !
Welcome!
Hot
how to download after the slider animation is finished
If you have this problem : The slide of images doesn't work as expected, try this : turn on clip content for the frame (make sure it's the case) If it still doesn't work, select all the images => right click => delete auto layout. It should work I spent more than 2 hours to find out about this :)
Perfect!🤩
Thank you!
I need help bro its not working i do exactly
Please tell me which website did you get these beautiful photos from?
Freepik
@@pixxelex thank you very much 😉
Can you please let me know how you add those lines for the image positioning? I'm unable to find them from my side
You can enable rulers using ( Shift + R )
Really helpful. Thank you!
You're welcome!
You don’t have to duplicate all the main frames, just use the component set and make it work using prototype in.❤
While I click in on drag, smart animation not display, when I click on onclick it works
Thank you so much!! <3 the way you explain it is so much easier than other tutorials
Glad it helped!
so much in just 10 mins, well done.
Glad it was helpful!
How Can I use this button in development? CSS code is not visible on this effectes Can you send me the CSS code or anything else for the development of this button
You have to code it manually. Figma doesn't provide codes.
Ive managed to make the animation of it but when I try to scroll down its only stuck on that frame and is fullscreened into it , how do I not do that??
Nice music, I really like it
Awesome! I like it very much!
Glad it was helpful!
Thank you so much. I recently found a similar Welcome web page animation on TH-cam where its author used html, css and javascript codes. I copied its source code from a provided github link. But this is the first time I found a detailed tutorial on how to do it on Figma. Here the TH-cam link : th-cam.com/video/j7GG009J9uc/w-d-xo.html
Glad it helped!
So easy and cool! Amazing tutorial 💥
Thank you so much 😊
Thanks
Welcome!
Who's is here and is actually a Framer User ? Maan u will test to make this awesome tutorial directly in framer
Sure, will try to do in Framer
@@pixxelex Hi buddy when I insert this into my website frame it doesn't work. I mean the effects, but it works outside the design frame
Dude my question is how do you put this in an actual design and make it work? Cause i did all this in figma yesterday but then when i moved it to the website frame i was working on, none of the effects worked. Do you know any way around that?