Diagonal Swipe/Drag Gesture - Think Fruit Ninja Game?

For some Time I have been researching a way in Figma for a swipe or probably rather drag gestures that moves diagonally vs. Just horizontally or vertically. Think fruit Ninja Game, basically you can slice a fruit from any angle.

The Idea is to have an object in the center surrounded by multiple buckets, and I want to drag that object into its respective bucket. Then I could transition to next screen indicating that the object has been added to the bucket. To be more clear some of the buckets will be off-set obviously and not on the horizontal or vertical axis hence “diagonal”, see image attached.

So ideally, I tap the red item and drag it into the bucket. That action should also be reversible, to empty the bucket. And it should work in one smooth way, so the moment I tap it I am able to drag it.

Hey @Patrick_33 - I want to say right off the bat that I don’t think an animation or prototype of this nature is possible natively. There’s an on-drag motion available, but it would be a single motion only, and not ‘dynamic’ in the way I think you’re looking for: https://youtu.be/6Id4INKEwb8

So if I interpreted correctly, the flow is: center item > dragged into bucket > toast/pop up message alerting the object has been added to select bucket > dismiss the alert.

Are there multiple objects stacked in the center? Just trying to feel out more of what you’re accomplishing, just in case I misunderstood.

For the buckets – do you also want the ability to have the center item be put into multiple buckets?

Hey KSN, thanks for replying. Yes the integration seems tricky.

So imagine this like a game where you have 1 marble in the center (to keep it simple):

  1. put the marble in 1 bucket it and show that it is inside the bucket
  2. pull the marble out of the bucket and put it back to center
  3. Once you put 1 marble into a bucket a new one will appear in the center, which can be placed into any bucket of your choice

I think that should cover the general logic of the moves I want to realized down the line. I find it important to mention that the marble can be moved all ove rthe place until you release it (lift your finger).

Besides the difficulty realising this in Figma, I do understand that this is totally possible in a finished app on any modern day 10-point touchscreen phone. Would you agree ?