Node Editor: Minimap #86723

Open
opened 2021-03-19 02:39:55 +01:00 by Pablo Vazquez · 49 comments
Member

A mini-map is a bird's-eye of the entire node tree. A quick way to see in which area of the node graph we are.

The map is represented by a rectangle shape in the bottom right corner, its aspect ratio matches the editor size. It's background color matches the nodes editor's. It doesn't contain a grid.

Each node in the node tree is represented by a tiny rectangle in the map.

When zoomed in, the area is outlined:

Dragging this area will pan the view.

State

Active and selected nodes are highlighted:

Colors

Nodes could receive the color of its category.

Custom colors on nodes will take precedence over category.

Frames

When using frames, show the frame as a whole (coloured). Don't show the nodes inside the frame, as it can become too complex to read. Once there is a working prototype we can test and see if having the nodes inside works, but I'd start without the inside nodes.


The Minimap is shown by default but it can be hidden from the header via the Overlay icon and popover. The icon toggles all overlays, the popover includes options to toggle Minimap, breadcrumbs, and gizmos.


For the first prototype the minimap could be:

  • Non-interactive
  • Monochrome
  • Frames without nodes inside
A mini-map is a bird's-eye of the entire node tree. A quick way to see in which area of the node graph we are. The map is represented by a rectangle shape in the bottom right corner, its aspect ratio matches the editor size. It's background color matches the nodes editor's. It doesn't contain a grid. Each node in the node tree is represented by a tiny rectangle in the map. ![ ](https://archive.blender.org/developer/F9898785/image.png) When zoomed in, the area is outlined: ![ ](https://archive.blender.org/developer/F9898790/image.png) Dragging this area will pan the view. ### State Active and selected nodes are highlighted: ![ ](https://archive.blender.org/developer/F9900194/image.png) ### Colors Nodes could receive the color of its category. ![ ](https://archive.blender.org/developer/F9898807/image.png) Custom colors on nodes will take precedence over category. ![ ](https://archive.blender.org/developer/F9900180/image.png) ### Frames When using frames, show the frame as a whole (coloured). Don't show the nodes inside the frame, as it can become too complex to read. Once there is a working prototype we can test and see if having the nodes inside works, but I'd start without the inside nodes. ![ ](https://archive.blender.org/developer/F9900148/image.png) ---- The Minimap is shown by default but it can be hidden from the header via the Overlay icon and popover. The icon toggles all overlays, the popover includes options to toggle Minimap, breadcrumbs, and gizmos. ![ ](https://archive.blender.org/developer/F9900198/image.png) ---- For the first prototype the minimap could be: * Non-interactive * Monochrome * Frames without nodes inside
Author
Member

Added subscriber: @pablovazquez

Added subscriber: @pablovazquez
Contributor

Added subscriber: @KenzieMac130

Added subscriber: @KenzieMac130
Member

Added subscriber: @PratikPB2123

Added subscriber: @PratikPB2123
Member

Added subscriber: @lone_noel

Added subscriber: @lone_noel
Fabian Schempp self-assigned this 2021-03-19 08:43:32 +01:00

Added subscriber: @tintwotin

Added subscriber: @tintwotin

Nice design. Question is, when implementing this, how to avoid generating inconsistency with all of the other editors(ex. animation editors), which also could need a mini-map, and keep Blender consistent?

Nice design. Question is, when implementing this, how to avoid generating inconsistency with all of the other editors(ex. animation editors), which also could need a mini-map, and keep Blender consistent?

Added subscriber: @MiroHorvath

Added subscriber: @MiroHorvath

Rather handy feature! Here's my 2cents:

"Nodes could receive the color of its category" - When looking at node tree from bird's view users care less about what particular nodes do(or what type they're of), more valuable information for them is to distinguish what bigger blocks of nodes do. Users typically represent such blocks by:

  • grouping them, in such case category's color wouldn't be much of help(all groups would have the same color)
  • putting them into frames, for better organization also colored

Would it be possible to color nodes by:

  • a color of frame they are in or
  • a custom color
    image.png
Rather handy feature! Here's my 2cents: "Nodes could receive the color of its category" - When looking at node tree from bird's view users care less about what particular nodes do(or what type they're of), more valuable information for them is to distinguish what bigger blocks of nodes do. Users typically represent such blocks by: - grouping them, in such case category's color wouldn't be much of help(all groups would have the same color) - putting them into frames, for better organization also colored Would it be possible to color nodes by: - a color of frame they are in or - a custom color ![image.png](https://archive.blender.org/developer/F9899290/image.png)

Added subscriber: @DuarteRamos

Added subscriber: @DuarteRamos
Author
Member

Added examples of frames and custom color nodes, and changed how to toggle the minimap on/off.

Added examples of frames and custom color nodes, and changed how to toggle the minimap on/off.

Added subscriber: @Ko

Added subscriber: @Ko

Errors shown as exclamation signs, maybe? And nodes which have only inputs or only outputs shown as triangle arrows.

Errors shown as exclamation signs, maybe? And nodes which have only inputs or only outputs shown as triangle arrows.

Added subscriber: @elfoglalt

Added subscriber: @elfoglalt
Member

Added subscriber: @Blendify

Added subscriber: @Blendify
Member

This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers.

This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers.
Member

Added subscriber: @Harley

Added subscriber: @Harley
Member

@Blendify - This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers.

Could work!

NodeGizmos.png

> @Blendify - This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers. Could work! ![NodeGizmos.png](https://archive.blender.org/developer/F9900391/NodeGizmos.png)

Added subscriber: @ThinkingPolygons

Added subscriber: @ThinkingPolygons

In #86723#1132963, @Blendify wrote:
This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers.

Please don't.
Bottom right is the standard for this, and it's easier to reach. Also less clutter around the navigation gizmos.

> In #86723#1132963, @Blendify wrote: > This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers. Please don't. Bottom right is the standard for this, and it's easier to reach. Also less clutter around the navigation gizmos.

Removed subscriber: @tintwotin

Removed subscriber: @tintwotin

Added subscriber: @jc4d

Added subscriber: @jc4d

In #86723#1132985, @ThinkingPolygons wrote:

In #86723#1132963, @Blendify wrote:
This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers.

Please don't.
Bottom right is the standard for this, and it's easier to reach. Also less clutter around the navigation gizmos.

Totally agree.

> In #86723#1132985, @ThinkingPolygons wrote: >> In #86723#1132963, @Blendify wrote: >> This should also be placed in the upper right to be consistent with the 3D Viewport navigation helpers. > > Please don't. > Bottom right is the standard for this, and it's easier to reach. Also less clutter around the navigation gizmos. Totally agree.
Contributor

Added subscriber: @AndresStephens

Added subscriber: @AndresStephens
Contributor

A toggle for top or botton corner would be nice, I personally would prefer top right for muscle memory from visual widgets and also consistency with the rest. Keep up the awesome proposal! Hope to see this soon, from what I understand the drawing code from the editor is a tricky beast to do something like this, so best luck to you!

A toggle for top or botton corner would be nice, I personally would prefer top right for muscle memory from visual widgets and also consistency with the rest. Keep up the awesome proposal! Hope to see this soon, from what I understand the drawing code from the editor is a tricky beast to do something like this, so best luck to you!
Contributor

Added subscriber: @Eary

Added subscriber: @Eary
Contributor

Input and output nodes are not like other nodes, the users should be able to recognize them is the minimap, right?

It looks like the in and output nodes are only recognizable in the category design, I think this might be problematic, because the category design is still up to debate, like what Miro said, but the in and output nodes need to be the anchor points for the users to know where they are in the node tree. Therefore I think the input and output nodes need to be recognizable even without the category design.

Input and output nodes are not like other nodes, the users should be able to recognize them is the minimap, right? It looks like the in and output nodes are only recognizable in the category design, I think this might be problematic, because the category design is still up to debate, like what Miro said, but the in and output nodes need to be the anchor points for the users to know where they are in the node tree. Therefore I think the input and output nodes need to be recognizable even without the category design.

Another idea: While user holding a hotkey entire node view is replaced by this schematic minimap, and to move "rectangle of interest" user just moving mouse around so no need to click and drag it.

Another idea: While user holding a hotkey entire node view is replaced by this schematic minimap, and to move "rectangle of interest" user just moving mouse around so no need to click and drag it.

Added subscriber: @Strike_Digital

Added subscriber: @Strike_Digital

Added subscriber: @GeorgiaPacific

Added subscriber: @GeorgiaPacific

Added subscriber: @cmzw

Added subscriber: @cmzw

Added subscriber: @Florian-10

Added subscriber: @Florian-10

thought this is going to be implemented in 3.0.
Looks like it was canceled :(
Verry sad

thought this is going to be implemented in 3.0. Looks like it was canceled :( Verry sad

Removed subscriber: @cmzw

Removed subscriber: @cmzw

Added subscriber: @BD3D

Added subscriber: @BD3D

Added subscriber: @dodododorian

Added subscriber: @dodododorian

Some inspiration:
minimap_customization.gif
minimap_navigate.gif
nested_level_loop.gif

Some inspiration: ![minimap_customization.gif](https://archive.blender.org/developer/F11443416/minimap_customization.gif) ![minimap_navigate.gif](https://archive.blender.org/developer/F11443420/minimap_navigate.gif) ![nested_level_loop.gif](https://archive.blender.org/developer/F11443422/nested_level_loop.gif)
Member

I both love this idea and struggle with it.

The struggle is that this is a rectangular area that represents a special thing in a area of many rectangles. I want the purpose of it to read quicker. At the moment it doesn't scream "I am a min-map".

At the extremes, I imagine going into Nodes at first when there are no nodes. At this point it is an empty field, but there is also an empty rectangle at bottom-right, and there is nothing to explain the relationship. If I add a single node then I now have a singular rectangle in the center, and at bottom right is a rectangle with a rectangle inside.

Is it a consideration to NOT show the mini-map when it is not needed? That way it is not shown immediately and only appears when you zoom, have lots of content, etc. It would not add clutter at the start when it is a clean slate, only appears when it can assist. That might help explain its existence.

I both love this idea and struggle with it. The struggle is that this is a rectangular area that represents a special thing in a area of many rectangles. I want the purpose of it to read quicker. At the moment it doesn't scream "I am a min-map". At the extremes, I imagine going into Nodes at first when there are no nodes. At this point it is an empty field, but there is also an empty rectangle at bottom-right, and there is nothing to explain the relationship. If I add a single node then I now have a singular rectangle in the center, and at bottom right is a rectangle with a rectangle inside. Is it a consideration to NOT show the mini-map when it is not needed? That way it is not shown immediately and only appears when you zoom, have lots of content, etc. It would not add clutter at the start when it is a clean slate, only appears when it can assist. That might help explain its existence.

Had an idea for a while that if the overlaid version is not wanted, the mini map could be only shown on a hotkey. The user could hold the key down to turn the entire viewport into the minimap (basically zoom out to fit the entire node tree and show the view area as a rectangle), and while the key is held, moving the mouse would pan the view around (and scrolling zooms in and out).

This way you have the overview at the press of a button, you can spare a whole lot of mouse clicks and zooming that you'd normally need for navigation, with the bonus of no overlay constantly obstructing the viewport. Would be a convenient way to frame a group of nodes.

Had an idea for a while that if the overlaid version is not wanted, the mini map could be only shown on a hotkey. The user could hold the key down to turn the entire viewport into the minimap (basically zoom out to fit the entire node tree and show the view area as a rectangle), and while the key is held, moving the mouse would pan the view around (and scrolling zooms in and out). This way you have the overview at the press of a button, you can spare a whole lot of mouse clicks and zooming that you'd normally need for navigation, with the bonus of no overlay constantly obstructing the viewport. Would be a convenient way to frame a group of nodes.

Added subscriber: @Nurb2Kea

Added subscriber: @Nurb2Kea

Added subscriber: @MarinGoleminov

Added subscriber: @MarinGoleminov

For me, the main job of the minimap would be navigating as fast as possible through large working areas, just like the navigator in Photoshop or Illustrator. One example of a nicely working minimap in node based apps is BMD Fusion: it can be toggled on and off, or switched to auto: if nodes are outside of the visible area, it appears. Usually, when building node trees, I mainly remember what function blocks are in which areas of the tree. Color coding on the other hand is not terribly important to me.
But honestly, even the most basic implementation in Blender would be very appreciated, as long as navigation is faster than now.

For me, the main job of the minimap would be navigating as fast as possible through large working areas, just like the navigator in Photoshop or Illustrator. One example of a nicely working minimap in node based apps is BMD Fusion: it can be toggled on and off, or switched to auto: if nodes are outside of the visible area, it appears. Usually, when building node trees, I mainly remember what function blocks are in which areas of the tree. Color coding on the other hand is not terribly important to me. But honestly, even the most basic implementation in Blender would be very appreciated, as long as navigation is faster than now.

Added subscriber: @Low_Polygon42

Added subscriber: @Low_Polygon42

Added subscriber: @blenderrocket

Added subscriber: @blenderrocket

Added subscriber: @dodo-2

Added subscriber: @dodo-2

When release please ?

When release please ?

Added subscriber: @FDesimpel

Added subscriber: @FDesimpel

In #86723#1240142, @Harley wrote:
The struggle is that this is a rectangular area that represents a special thing in a area of many rectangles. I want the purpose of it to read quicker. [...]".

Indeed. Why not have it as a panel in the sidebar?

Or even an editor / property editor tab in it's own right, with multiple minimap panels showing multiple nodegroups at once. That could also ease switching between groups on different objects, and keep view state per nodegroup that uses it.

Another possibility is in the modifier panel of the geonode, but i suppose soon there will be a generic geo(node) datablock where you don't need the modifier anymore.

> In #86723#1240142, @Harley wrote: > The struggle is that this is a rectangular area that represents a special thing in a area of many rectangles. I want the purpose of it to read quicker. [...]". Indeed. Why not have it as a panel in the sidebar? Or even an editor / property editor tab in it's own right, with multiple minimap panels showing multiple nodegroups at once. That could also ease switching between groups on different objects, and keep view state per nodegroup that uses it. Another possibility is in the modifier panel of the geonode, but i suppose soon there will be a generic geo(node) datablock where you don't need the modifier anymore.

Made a quick mockup to have this as a panel.

#86723 Node Editor_ Minimap_mockup_ds_v0.1.png

This way you could add additional ux functionality like zoom level buttons, stored views, etc...

Implementation wise, if done trough python, this would need a way to be able to draw to a panel using the gpu module, maybe trough a render to texture or something. Which would also benefit the Blender Apps project.

EDIT: Didn't realise there is already a patch being written for the original idea to have this in the main area ( https://developer.blender.org/D10776) , referenced back to this there.

Made a quick mockup to have this as a panel. ![#86723 Node Editor_ Minimap_mockup_ds_v0.1.png](https://archive.blender.org/developer/F14207311/T86723_Node_Editor__Minimap_mockup_ds_v0.1.png) This way you could add additional ux functionality like zoom level buttons, stored views, etc... Implementation wise, if done trough python, this would need a way to be able to draw to a panel using the gpu module, maybe trough a render to texture or something. Which would also benefit the Blender Apps project. EDIT: Didn't realise there is already a patch being written for the original idea to have this in the main area ( https://developer.blender.org/D10776) , referenced back to this there.
Member

I am removing the Needs Triage label. This is under the general rule that Design and TODO tasks should not have a status.

If you believe this task is no longer relevant, feel free to close it.

I am removing the `Needs Triage` label. This is under the general rule that Design and TODO tasks should not have a status. If you believe this task is no longer relevant, feel free to close it.
Alaska removed the
Status
Needs Triage
label 2024-04-07 06:11:52 +02:00
Sign in to join this conversation.
No Label
Interest
Alembic
Interest
Animation & Rigging
Interest
Asset Browser
Interest
Asset Browser Project Overview
Interest
Audio
Interest
Automated Testing
Interest
Blender Asset Bundle
Interest
BlendFile
Interest
Collada
Interest
Compatibility
Interest
Compositing
Interest
Core
Interest
Cycles
Interest
Dependency Graph
Interest
Development Management
Interest
EEVEE
Interest
EEVEE & Viewport
Interest
Freestyle
Interest
Geometry Nodes
Interest
Grease Pencil
Interest
ID Management
Interest
Images & Movies
Interest
Import Export
Interest
Line Art
Interest
Masking
Interest
Metal
Interest
Modeling
Interest
Modifiers
Interest
Motion Tracking
Interest
Nodes & Physics
Interest
OpenGL
Interest
Overlay
Interest
Overrides
Interest
Performance
Interest
Physics
Interest
Pipeline, Assets & IO
Interest
Platforms, Builds & Tests
Interest
Python API
Interest
Render & Cycles
Interest
Render Pipeline
Interest
Sculpt, Paint & Texture
Interest
Text Editor
Interest
Translations
Interest
Triaging
Interest
Undo
Interest
USD
Interest
User Interface
Interest
UV Editing
Interest
VFX & Video
Interest
Video Sequencer
Interest
Virtual Reality
Interest
Vulkan
Interest
Wayland
Interest
Workbench
Interest: X11
Legacy
Blender 2.8 Project
Legacy
Milestone 1: Basic, Local Asset Browser
Legacy
OpenGL Error
Meta
Good First Issue
Meta
Papercut
Meta
Retrospective
Meta
Security
Module
Animation & Rigging
Module
Core
Module
Development Management
Module
EEVEE & Viewport
Module
Grease Pencil
Module
Modeling
Module
Nodes & Physics
Module
Pipeline, Assets & IO
Module
Platforms, Builds & Tests
Module
Python API
Module
Render & Cycles
Module
Sculpt, Paint & Texture
Module
Triaging
Module
User Interface
Module
VFX & Video
Platform
FreeBSD
Platform
Linux
Platform
macOS
Platform
Windows
Priority
High
Priority
Low
Priority
Normal
Priority
Unbreak Now!
Status
Archived
Status
Confirmed
Status
Duplicate
Status
Needs Info from Developers
Status
Needs Information from User
Status
Needs Triage
Status
Resolved
Type
Bug
Type
Design
Type
Known Issue
Type
Patch
Type
Report
Type
To Do
No Milestone
No project
No Assignees
28 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: blender/blender#86723
No description provided.