Differential D11930

Nodes: Improve readability of selected node links
ClosedPublic
Actions

Authored by Leon Schittek (lone_noel) on Jul 15 2021, 11:22 AM.

Details

Reviewers

Ray Molenkamp (LazyDodo)
Pablo Vazquez (pablovazquez)
Hans Goudey (HooglyBoogly)
Jacques Lucke (JacquesLucke)

Commits

rB75bb99fa40dd: Nodes: Improve readability of selected node links

Summary

This patch improves the drawing of selected node links:

Highlight the entire link to make it easier to spot where the link is going/coming from
Always draw selected links on top, so they are always clearly visible
Don't fade selected node links, when the sockets they are connected to are out out view
Dragged node links still get a partial highlight when they are only attached to one socket

Comparisons
Following a link to a crowded socket

patch	master

Note that it is much easier to see where links are going when the entire link is highlighted instead of just the beginning of it.

Selection with colored links:

patch	master

Partial highlight when dragging the link:

After testing I agree with Jacques assessment that propagating the
highlight through reroutes would be useful. Currently having your links
organized with a lot of reroutes does diminish the improvements from
this patch a bit, but that can be looked at at a later time.

Thanks to @Ray Molenkamp (LazyDodo) for asking for this.
Originally authored by @Jacques Lucke (JacquesLucke).

Diff Detail

Repository: rB Blender

Event Timeline

Jacques Lucke (JacquesLucke) requested review of this revision.Jul 15 2021, 11:22 AM

Jacques Lucke (JacquesLucke) created this revision.

Harbormaster completed remote builds in B15850: Diff 39590.Jul 15 2021, 11:22 AM

Jacques Lucke (JacquesLucke) edited the summary of this revision. (Show Details)Jul 15 2021, 11:31 AM

Jacques Lucke (JacquesLucke) edited the summary of this revision. (Show Details)

Jacques Lucke (JacquesLucke) added reviewers: Ray Molenkamp (LazyDodo), Pablo Vazquez (pablovazquez), Hans Goudey (HooglyBoogly).

Jacques Lucke (JacquesLucke) added a subscriber: Ray Molenkamp (LazyDodo).

Glorious! Given this is a UI change it's not mine to accept or reject, but thank you for fixing this!

I was convinced by @Jacques Lucke (JacquesLucke) this was mine to accept :)

Charlie Jolly (charlie) mentioned this in T86749: Geometry Node Community Additions.Jul 15 2021, 4:41 PM

Vladislav Macíček (Aeraglyx) added a subscriber: Vladislav Macíček (Aeraglyx).Jul 22 2021, 3:28 AM

This is such a huge improvement to readability in large node networks that I think I have to accept it right away. : )

However, a couple points to consider, now or later:

Selected links should draw on top of unselected links. Otherwise they aren't visible sometimes when a lot of links go to one socket and you only have one of them selected. This seems like a straightforward improvement.
Currently the zoom fading for links with sockets outside of the view still applies to selected links. Maybe we should take selection into account there as well.

This revision is now accepted and ready to land.Aug 11 2021, 7:45 PM

The requested changes sound reasonable.

After having asked on blender.chat, I will finish this patch and implement the suggested changes.

Merge master branch
Draw selected links on top
Disable link fading for selected links

This revision is now accepted and ready to land.Feb 15 2022, 2:11 PM

Harbormaster completed remote builds in B20555: Diff 48358.Feb 15 2022, 2:11 PM

Leon Schittek (lone_noel) retitled this revision from Nodes: Highlight entire link when connected to a selected node. to Nodes: Improve readability of selected node links.Feb 15 2022, 2:41 PM

Leon Schittek (lone_noel) edited the summary of this revision. (Show Details)

One small thing I just noticed with my change: We were also drawing dragged links highlighted, when their nodes were selected. Right now I'm always drawing those unhighlighted:

master	patch

I don't think it's too bad, and I can reimplement the old behavior, but it got me thinking. Another thing we could do, would be to only partially highlight the link, if it's dragged, but not connected, yet. That way the dragged link would always be easy to differentiate from the other links regardless of their selection state. I also think it gives a nice visual feedback, when attaching the link to a socket.

What are your thoughts, @Pablo Vazquez (pablovazquez)? (Also about how the patch looks with the colored links.)

Demo of the described highlight for dragged links:

In D11930#376504, @Leon Schittek (lone_noel) wrote:

What are your thoughts, @Pablo Vazquez (pablovazquez)? (Also about how the patch looks with the colored links.)

It looks great! Partially highlighted while dragged makes more sense now that the wires are fully colored when connected.

Perhaps outside the scope of this patch, but do you think there is a way to prevent the wire drawing on top of the socket? Ideally the wire would come from underneath the socket, but I guess that's a side-effect of drawing the wires on top of everything now (which is great btw, good idea Hans!).

Other than that, +1!

Merge branch 'master'
Add partial highlight to dragged node links.
Fix typo

Harbormaster completed remote builds in B20593: Diff 48420.Feb 16 2022, 1:25 PM

Leon Schittek (lone_noel) edited the summary of this revision. (Show Details)Feb 16 2022, 1:31 PM

Leon Schittek (lone_noel) added a project: Nodes & Physics.

LGTM.

In D11930#376807, @Pablo Vazquez (pablovazquez) wrote:

Perhaps outside the scope of this patch, but do you think there is a way to prevent the wire drawing on top of the socket? Ideally the wire would come from underneath the socket, but I guess that's a side-effect of drawing the wires on top of everything now (which is great btw, good idea Hans!).

This actually was already an issue before this patch, but I guess always partially highlighting the link when dragging makes it more noticeable.

The temporary link for dragging is drawn separate and after the rest of the node tree, so it also overlaps the nodes, as well.

My guess is that it would be easiest to simply draw the socket the link is dragged from again after the temporary link. It could even be highlighted which would fit in well with the partial highlight of the link.
Getting all the necessary info to draw the socket at that point seems to be a bit round about though. I'll think about and will make a separate patch if I come up with something nice.

Hans Goudey (HooglyBoogly) accepted this revision.Feb 16 2022, 5:25 PM

Paul Larson (GeorgiaPacific) added a subscriber: Paul Larson (GeorgiaPacific).Feb 21 2022, 5:49 PM

Closed by commit rB75bb99fa40dd: Nodes: Improve readability of selected node links (authored by Leon Schittek (lone_noel), committed by Hans Goudey (HooglyBoogly)). · Explain WhyFeb 28 2022, 9:52 PM

This revision was automatically updated to reflect the committed changes.

Hans Goudey (HooglyBoogly) added a commit: rB75bb99fa40dd: Nodes: Improve readability of selected node links.

Ethan Hall (Ethan1080) awarded a token.Mar 14 2022, 8:23 PM

Vyacheslav (hitrpr) awarded a token.Mar 16 2022, 2:40 AM

Duarte Farrajota Ramos (duarteframos) awarded a token.Jun 8 2022, 7:00 PM

Pratik Borhade (PratikPB2123) mentioned this in T98992: Node selection doesn't go through reroute nodes.Jun 20 2022, 6:19 AM