Jittery user experience when dragging diagonally
samreid opened this issue · 9 comments
The vertex drag quantization works well when dragging vertically or horizontally, but when dragging diagonally the horizontal/vertical quantization leads to a suboptimal user experience. Even if the cursor is within pixels of the diagonal, it still shows a jumpy behavior. Would it be difficult to support the case where the user is dragging diagonally?
We brainstormed this together. You could use Utils.distToSegmentSquared to get the distance between the diagonal vs distance to teh x/y axis. Whichever one is closer, you could use that to determine which to snap to.
We touched this today during a check-in meeting. Smooth movement would make it easier to maintain a kite/rhombus. Design team agreed it is a little jittery, but not worth a lot of time to improve. Lets assign priority to this issue after the code review is complete and we can review it with all open issues.
After another check-in it was decided this is important to improve for mouse input, Ill work on this next.
OK, a first stab at this for vertices was done in the above commit. Here is how it works:
If the mouse is within a distance d / 2 from the diagonal line between the two end points, we consider it moving along the diagonal. If along the diagonal, distance needs to be length between current position and X in the diagram (pythagorean theorem) to move the vertex. Its hard to get value for d just right without biasing movement along the x/y axis or along the diagonal. @BLFiedler can you please try master and comment on how it feels? If this is the right direction we can try doing the same thing for sides. It feels about right to me but a little different for large steps vs small steps.
I think @jessegreenberg's intuition on this is good! I might try it on a touchscreen and/or smaller screen, but so far so good.
@jessegreenberg, go ahead and try this for side, if it's taking long or proves frustrating, feel free to bail in favor of other issues.
I was able to just use the same function for sides, hooray! Another case to check is reducedStepSize. It usually feels nice, but reudcedStepSize + "Small StepSize" button causes a lot of jitter as you move a Vertex vertically.
@BLFiedler can you please test that case? If it is a concern to you, we could disable this feature when running the sim in those conditions. Or play with a different value for "distance to the diagonal".
We reviewed in meeting - It's such a 'small step' with ?reducedStepSize and small step engaged (shift or button lock), that it's not worth having the diagonal assist, no matter how small we make d (in #406 (comment)).
Let's
- Remove the diagonal aid for the ?reducedStepSize and Shift modifier/small step button case.
Alright, that is done! It feels pretty better/more intuitive without this in those conditions. Closing.