Swipe to Remove - All Cards | Figma Interactive Components
Вставка
- Опубліковано 27 лип 2024
- In this tutorial, I will show you how to make Swipe to Remove (All Cards) in Figma with Figma Interactive Components. To demonstrate the animation (Swipe to Delete / Remove), I will use a Food Delivery App Cart Screen. Also, you will learn how to use Figma Auto Layout, Frames, Components, Variants, Figma Prototype and Smart Animate.
In this video I show you:
00:00 Intro
00:31 Create the Remove Button
01:25 Frame Selection
02:00 Position the Frames
02:38 Create Component
02:53 Add Variant
03:40 Prototype Part 01
04:42 Duplicate Components
06:43 Prototype Part 02
07:53 Figma Auto Layout
08:05 Prototype Part 03
======
Watch my others Figma Interactive Components tutorials:
Automatic Carousel: • Figma Automatic Carous...
Circle Progress Bar: • Circular Progress Bar ...
Sound Wave Animation: • Figma Sound Wave Anima...
Dynamic Island Animation: • Dynamic Island Animati...
Dropdown Menu List: • Dropdown Menu with Scr...
Animated Modal Overlay: • Animated Modal Pop Up ...
Time Picker Animation: • Time Picker Animation ...
Animated Heart Icon: • Figma Animated Heart I...
Animated Swipe to Delete: • Figma Swipe to Delete ...
Floating Action Button (FAB): • Floating Action Button...
Pulse Loading Animation: • Figma Pulse Animation ...
Animated Like Button: • Animated Like (Heart) ...
Search Bar (Keyboard Input Animation): • Search Bar (Keyboard I...
Loading Animation: • Loading Animation | Fi...
Animated Countdown: • Animated Countdown Tim...
Interactive Star Rating: • Figma Star Rating Anim...
Interactive Slider: • Figma Slider Animation...
Interactive Button: • Figma Interactive Butt...
Radio Buttons: • Figma Interactive Comp...
Checkbox: • Checkbox | Figma Inter...
Dropdown Menu: • Figma Dropdown Menu Tu...
Input Fields: • Figma Interactive Comp...
Progress Bar: • Figma Progress Bar Tut...
Toggle Switch Button: • Figma Toggle Switch Bu...
======
Don't forget to like, subscribe and turn on notifications to watch new ui ux design videos and figma tutorials - Наука та технологія
Many many thanks for your response 😊
Hi!😃 You're welcome! Glad to help!
One more amazing content
Thanks 👍
Hi!😃 I'm glad to hear this! Thanks a lot for the feedback!🙏
awesme man
Hi!😃 Thank you so much for the feedback! Have a great week!
nice bro, next tutorial
Thank you so much bro!😃 Have a great week!
Thank you so much for your platform, is really helpful.
Please there's an issue with this particular tutorial, i have repeated the exactly what you did but time to prototype it is not playing nor dragging. Please your feedback will be appreciated. Thanks
Hi!😃 Thank you so much for the feedback!🤩 Try pressing “R” in presentation mode to restart the presentation. Let me know if it worked.
Great tutorial, although I’m still not understanding how to apply this to your swipe to delete tutorial? Need I duplicate the variant for each card swipe as well? It’s not working for me 😅
I am sorry for My previous comments.
No problem! If you need more tutorials, you can talk and then it will go to the to-do list. Due to the amount of work, it takes a while, but I see what I can do to help. Have a great week!😃
@@ChinskDesign in this tutorial everything is clear to understand
But my next problem is about accordions. You see that when you make an accordion (like frequently asked questions) and open any of the section then the space in page Will be short. That is the problem that I can't able to solve.
Can you understand it because my english is poor.🥺
If you understand the actual problem that I communicate with you.
So please solve it. This is not my order. This my humble request
Hi!😃 I understood, don't worry, this tutorial is on the to-do list. I'll try to post this video as soon as possible. I will do my best to help. Have a great week mate!