Usability issue when drawing gradents (.054)



  • @Ingolf said in Usability issue when drawing gradents (.054):

    Let's just say it works great in all these programs, and no one has ever requested the Illustrator model ever in any context I've witnessed.

    Not satisfied with 'Let's just say it works great in all these programs' and with bandwagon arguments ('CorelDRAW, Affinity, Gravit Designer, Figma, etc don't use handles).

    If they don't use handles, how do they do that necessary operation? With a modifier key?



  • All inside shape

    Also outside

    No modifiers or complexity. Just moving gradient stops.



  • See how easy it is to work with (and understand), plus how easy it is to switch between gradient types in the context toolbar.

    That's the kind of thing that makes you effective. And happy with your tool.

    Quick demo of gradients

    EDIT: New video



  • @b77 said in Usability issue when drawing gradents (.054):

    Handles are needed anyway β€” think about the case where the start or end color stop doesn't coincide with the start or end of a gradient. You do need a visible handle to grab and adjust the gradient angle, isn't it?

    And if handles are not displayed separately for "normal" gradients (those with the both start and end stops at the start and end), I guess the poll I made last week missed an important fifth possibility β€” Option-drag to "unglue" a color stop from the start or end of the gradient? Because you need this.

    @b77

    I'm with you, even though gradients in Vector programs I used don't have such handles.

    The way VS does it has never bothered me much, even if it was a bit unusual at the beginning.



  • Aha. I hear no arguments or business case for the extra handles being there. On the contrary. πŸ™‚



  • Let me make it easier for you. You are a product owner at Corel, Serif or Figma, and need to write a user story explaining to the development team what needs to be developed and why (this is done so that the programmers fully understand the value to be added, which in turn helps to achieve a better common understanding between customer and developer of the 'Definition of Done'):

    Template:
    As a <type of user> I want <feature> implemented to achieve <business value>

    Finish this:
    "As a designer I want handles a'la Illustrator/vectorstyler added to gradients to achieve" <business value>

    ?? Exactly what?

    This is how I work daily with our software engineering team as a product owner. πŸ™‚



  • @Ingolf said in Usability issue when drawing gradents (.054):

    Aha. I hear no arguments or business case for the extra handles being there. On the contrary. πŸ™‚

    I wondered if the question was meant for me or @b77 ?



  • Anyone may have a go at it.



  • @Ingolf said in Usability issue when drawing gradents (.054):

    Aha. I hear no arguments or business case for the extra handles being there. On the contrary. πŸ™‚

    Uh… πŸ™‚ I did mention the limitation that arises from having the gradient handles "under" the start and end color stops β€” you wouldn't be able to move any of these two stops away from the gradient ends with the gradient tool.

    Unless a keyboard modifier is assigned for this, the user has to go to the Appearance or Gradient panel to do it.

    You might say: "Please no more shortcuts, it's OK to do this operation only from the panels β€” most people won't mind". And you might be right.

    But the app still needs visually different handles for these cases β€” both with the current detached handles and with "hidden" handles (your suggestion).

    ……… . .

    Btw, my CDR 2021 trial expired last week, so I could test moving start or end color stops only in Inkscape v1.2.1, and… I don't see any such possibility with its gradient tool β€” it can be done only from its 'Fill and Stoke' panel, and the gradient tool displays no detached handle at that end after you do that… this last part is terrible if you ask me.

    I also tried to do this in AD on iPad, and… I couldn't even find a Gradient panel equivalent, so I guess it's not possible.

    ……… . .

    @VectorStyler Are combinations of dragging + two keyboard modifiers possible/allowed?



  • @b77 said in Usability issue when drawing gradents (.054):

    @Ingolf said in Usability issue when drawing gradents (.054):

    Aha. I hear no arguments or business case for the extra handles being there. On the contrary. πŸ™‚

    Uh… πŸ™‚ I did mention the limitation that arises from having the gradient handles "under" the start and end color stops β€” you wouldn't be able to move any of these two stops away from the gradient ends with the gradient tool.

    You did but I am not sure what limitation that would be.

    Could you demonstrate with a side by side example from one program like VS and one like the others what you can achive with these gradient ends that will be missing if they are removed?



  • @Ingolf Yes, here is a quick comparison:

    alt text

    (Btw, I love these GIF compression artifacts! πŸ˜‹).

    So in VS I can drag the start or end color stop easily and without disturbing those three color stops in the middle.



  • @b77 said in Usability issue when drawing gradents (.054):

    @Ingolf Yes, here is a quick comparison:

    Ah, that makes some sense, granted. And now I understand your love of screentshots. πŸ™‚ Much easier to understand.

    Still, if I need the middle nodes to "stand still" I insert an extra gradient stop and get same result. I don't remember that as an issue/need, personally.

    Gradient static stops

    So I'm neither completely convinced nor with a winning argument. I can certainly say I enjoy using programs that remove as many controls and noise on the screen as possible, so I can focus on the drawing and exactly what needs to be done by the user interface, and would rather have the "modern" model any day.

    @VectorStyler If you keep the current model, then the model used in Amadine might be worth considering for gradient end nodes. Here I don't think their choice of symbol for gradient ends is particularly logical either.

    0_1661340788297_ab0b1461-aa45-4a50-b29f-8a2f5ee55931-image.png



  • (However, the advantage of the Amadine model is that the gradient start-end symbol and first gradient stop stand exactly next to each other, beginning at the same place, which is much more logical than the Illustrator model.)



  • @Ingolf Oh, I did think about that workaround. πŸ™‚
    But since it adds an intermediary color, it's not "the same result" β€” it's not the exact color of the closest color stop. Which might not be a problem sometimes, but sometimes it is.

    To recap, from my POV:

    1. If the current "detached handles" model stays, the handles should look visibly different from the color stops β€” smaller and let's say squared.
      Or maybe the color stops should be bigger.

    2. If the simpler "no visible" handles model is implemented, I hope there is a way to easily "unglue" the start or end color stop from its location.
      Not a must, but it's nice to be able to do this from the gradient tool, not only from a panel.
      And when one of the start or end color stops is moved, the handle that becomes visible still needs to look different in size and shape. (I hope everybody agrees on that).



  • But please for the love of all wonderful, no fugly symbols like CorelDRAW:

    0_1661344018549_475fd80a-573c-4b53-bed9-7c797fe826ae-image.png

    Like arrows and squares. 😱 I am asking for less details. Then I'd rather stick to the current model

    CorelDRAW take me back to a distant fugly past with lines and noise ad libitum:

    0_1661344120320_20745524-5ff9-4bc2-abed-fa4a4e9b99b8-image.png



  • @Ingolf Oh God… where did you find that last screenshot? πŸ˜‚

    Upvoted anyway. πŸ™‚

    If CDR would keep those squares rotated with the gradient angle, it wouldn't look terrible. But of course it would look much better with round color stops. πŸ‘



  • @b77 said in Usability issue when drawing gradents (.054):

    @Ingolf Oh God… where did you find that last screenshot?

    I don't know what weirdo that posted it on the Internet, but it was disturbingly easy to find. πŸ˜‚

    If CDR would keep those squares rotated with the gradient angle, it wouldn't look terrible. But of course it would look much better with round color stops. πŸ‘

    Not great, not terrible. ☒

    ... I think Gravit, Affinity and Amadine did it just beautifully and that there is not reason to try to invent own logic and design. Also for the sake of easy adaption for newcomers.


  • Global Moderator

    @b77 Interesting point about the extraneous end stops for that particular operation.

    Another way to handle that without needing the extra end stops would be to let the user drag a stop with a modifier key to duplicate that stop, keeping the same color. That way you could move the end point in as a duplicate point (with the same color) to get the same effect, and would get some additional functionality which may be useful to support other cases as well.



  • @fde101 OK, interesting idea. Let's see:

    Option is instinctively the key you expect to press if you want to duplicate something (we're used to Option-drag for objects).

    But with the gradient tool, Option is used to pick a color for the selected color stop.

    Shift is used to rotate the gradient in 45Β° increments (or whatever value is set in Prefs > Editing Options 1).

    Is the Control key better for picking a color for gradient stops, so that Option-drag can be assigned to duplicating stops?


  • Global Moderator

    @b77 said in Usability issue when drawing gradents (.054):

    @fde101 OK, interesting idea. Let's see:

    Option is instinctively the key you expect to press if you want to duplicate something (we're used to Option-drag for objects).

    But with the gradient tool, Option is used to pick a color for the selected color stop.

    Shift is used to rotate the gradient in 45Β° increments (or whatever value is set in Prefs > Editing Options 1).

    Is the Control key better for picking a color for gradient stops, so that Option-drag can be assigned to duplicating stops?

    Control on the Mac is normally used to open context menus, and indeed does so in VectorStyler in this context. It would probably be an ok choice on Windows, maybe using Command for this on the Mac?

    The problem with this, of course, being that Command currently functions as a momentary switch to the Transform tool.

    Is the tab key actually doing anything in this context? A bit unique, but maybe that would work?

    It seems the ultimate limitation is as usual a lack of modifier keys to play with.