Set Up a SWIPE TO DELETE Interaction in Figma (Prototyping Tutorial) 

great video. i'm shocked figma hasn't made this easy. it's such a standard pattern but creating this takes 100x longer than it should :(

Oh, that's how proper swipe-to-delete interaction should be built :D Thank you for making this video, I believe it can save a lot of time and tons of nerves for those new to Figma 🧡 When I just started to learn UX/UI through one of the courses in Coursera, my first prompt was to build a cat food delivery app. Instead of making a simple user flow, which was kinda expected from the beginner, I decided to add a complex search feature, which will allow users to search for a product based on both desired and undesired ingredients. To make it more fun, I decided to use swipe to add/swipe to delete interactions, instead of yes/no checkboxes. And now imagine the two weeks old Figma user, who is trying to build such a complex interaction :D I spent days, watching endless youtube tutorials and trying to understand how those freaking components work. Was super proud of myself when I was finally able to solve this problem (better not to see how the interactive component looked like - it was such a mess). And you know what? This feature failed in the usability study :D Users tried to click instead of swipe and were super frustrated when nothing happened. So I even had to add a small video clue to the prototype to overcome this issue in the next round of testing. Sorry for the long comment. It was just such a painful, but fun learning experience :D www.figma.com/proto/M1MLLAnE2j0As6s6LcC9if/CatCheers-app?node-id=527%3A23984&scaling=scale-down&page-id=527%3A21377&starting-point-node-id=527%3A23870

thanks, you are a literal figma super san

Absolutely amazing stuff, I really love your prototyping skills 🤩

Hi. Got almost everything working, but in mine, when the item is deleted, even though the height is 0.001, I get extra space left behind once the item is removed. On a single item its not too bad, but when you delete a few in a row it is very noticeable.

Hey, How to add more , for example pop up (notification) at below „have been deleted”? After delation by swiping?

That was cool thanks m8

Thanks. Keep them coming.

You're lifesaver

Great tut, thanks for the content!

Great video❤

Problem with "on drag" is that, it works even if you drag it in opposite direction :/

Hey Mavi, Do clear my doubt im facing. after making fixed width with varient 2 by giving independant spacing but the content does not move after giving fixed width. why this happen?

It worked !😁 but my question where to change the image and the text for each time ? In the component section?

Can uh plzz make the tutorial of disappearing scroll menus which is used in Zara app