[Prototype]-Does XD randomize drag direction of the element when moving from screen to another?

Report · Feb 19, 2020

I have done navigation through artboards with drag (and sometimes also with tap) function. I have known that there is no way to navigate different destinations with drag direction. But now I'm feeling that XD is somehow randomizing the drag direction that user must do to get next artboard (screens in prototype).

I'm having now two screens, where user can change the sizes of elements - in the first screen, upper element is bigger and in the second screen lower element is bigger. It feels natural that if you want upper element bigger, you drag it downwards and again, if you want to get lower element bigger, you drag it upward.

First they were working like this, but after some modifications, the drag direction in both screens are now upward. That could be understanded that as a prototype mistake.

But for a moment, it was even worse: To get upper element bigger, you had to swipe it from right to left and lower element was possible to get bigger with swiping it upward (as it should be)...

Is there any relations to drag direction, where you place artboards in layout view, how you make connections between screens (from dropdown or by dragging the arrow) or how you can manage the drag direction in XD - or is the function "automized" as auto-animate is too?

Report · Feb 19, 2020

Hi there,

We are sorry to hear you are having trouble. I unable to reproduce the same at my end, it would be really helpful if you can share a short video or screenshot of your workflow for better understanding?

We will try our best to help.

Thanks,

Harshika

Report · Feb 20, 2020

OK, I made a demo where I copied the elements without information (classified) and in this copy version, the lower element is still working as I wanted, but upper element (element 1) works now with left-right movements. The real version still moves to second screen by swiping ~~either~~ element 1 ~~or 2~~ upward... (edited: of course element 2 downward is still "right" direction)

Video about it can be found from here next 24 hours:

< link removed >

And only functions in the elements are "drag" with auto-animate and without easing.

So my question remains the same: How you can control, change or manipulate the drag direction, which will be used to move into the next screen. I don't want different destinations with different swiping directions, only thing is that the swiping direction is rational for the user...

Report · Feb 20, 2020

I think I'm onto something...

The required drag direction (up, down, right, or left) is being derived from the vector between the upper left corner (X,Y) of the trigger element on the initial screen and the next screen. So in the example below, you'll need to drag up, no matter what the second state looks like to move or expand to.

I also tried putting their corners on the respective X,Y (so there's no vector), and I couldn't drag in any direction...

So in order to get the drag direction you want, it might help to create a group with an invisible element, positioned in such a way it leads the vector in the required direction. A work-around, while we're waiting for a clearer reply and maybe a proper solution.

Report · Feb 21, 2020

Thank you Peter for your advice.

I tried that and somehow it worked for a while, but then it changed that now element 1 is zoomed with downward movement (ok), but returning back to normal screen will happen with swiping left (?). I have changed the "extra"circle back of component layers, but that doesn't help. And I double checked that circle's X position will not change between screen.

Here my solution (that worked in to "half-way")

Report · Feb 21, 2020

Hmm... it looks okay, and I just tried to create a similar reverse scenario (with a ghost element within the group) and that worked well. So there must be some glitch or another culprit spoiling the work-around...

Feel free to Share this file with us, so we can take a closer look.

Report · Feb 21, 2020

Thanks for your helping hand - now I decided to just remove the drag function from that demo and used tap function to move screen to another....

And I'm hoping that one day Adobe wll offer a tool to select the drag direction. I can present the my demos with wrong swiping directions or just leave them out and explain them to test users. The real product will be done by other means, so there our software guys can do functions as I have designed them...

Of course, if someone finds the solution, how you can manipulate the swipe direction, I'm willing to hear it. 😉

Report · Feb 21, 2020

I just noticed a related topic below this discussion, and a feature request at UserVoice. Same problem, same conclusion, and no solution (yet...)