Viewport Manipulator Design #54723

Closed
opened 2018-04-19 12:43:05 +02:00 by William Reynish · 36 comments

Currently in 2.8, we have this manipulator widget:

Screen Shot 2018-04-19 at 12.37.20.png

We want to re-design it to to improve these areas:

  • It should be less distracting
  • take up less constant space
  • We would like to be able to replace the XYZ angle indicator in the bottom left.

This is the design we've arrived at:

In the corner of the screen, users will see this:

Screen Shot 2018-04-19 at 16.59.34.png

On rollover, we reveal the sphere, like so:

Screen Shot 2018-04-19 at 16.58.01.png

Rolling over the buttons highlights it:

Screen Shot 2018-04-19 at 16.58.04.png

Side view:

Screen Shot 2018-04-19 at 16.58.07.png

Side View rollover:

Screen Shot 2018-04-19 at 16.58.09.png

Back View:

Screen Shot 2018-04-19 at 17.11.27.png

The viewport manipulator is designed to be able to replace the numpad for users who prefer a more visual interaction, and so it should cover the the same features. For this reason, we will also have a Perspective on/off toggle and a camera view toggle.

Preferences:

In Preferences, users will have three options:

  • Manipulator (Default)
    This option makes it so you can fully use the widget for rotation and to jump to various views
    Screen Shot 2018-04-19 at 16.59.34.png

  • Indicator
    This option removes all interaction from the widget and makes it slightly simpler
    Screen Shot 2018-04-19 at 14.15.23.png

  • Off
    We show nothing
    Screen Shot 2018-04-19 at 14.15.34.png

Process

This gives some insight into our design process. We went through these alternatives before arriving at our final design:

Screen Shot 2018-04-19 at 11.57.27.png

Screen Shot 2018-04-19 at 11.42.16.png

Screen Shot 2018-04-19 at 11.37.05.png

Screen Shot 2018-04-19 at 11.32.22.png

Sketches

viewmanipulator_sketch1.jpg

viewmanipulator_sketch2.jpg

viewmanipulator_sketch3.jpg

viewmanipulator_sketch4.jpg

Currently in 2.8, we have this manipulator widget: ![Screen Shot 2018-04-19 at 12.37.20.png](https://archive.blender.org/developer/F2838433/Screen_Shot_2018-04-19_at_12.37.20.png) We want to re-design it to to improve these areas: - It should be less distracting - take up less constant space - We would like to be able to replace the XYZ angle indicator in the bottom left. This is the design we've arrived at: In the corner of the screen, users will see this: ![Screen Shot 2018-04-19 at 16.59.34.png](https://archive.blender.org/developer/F2841930/Screen_Shot_2018-04-19_at_16.59.34.png) On rollover, we reveal the sphere, like so: ![Screen Shot 2018-04-19 at 16.58.01.png](https://archive.blender.org/developer/F2841932/Screen_Shot_2018-04-19_at_16.58.01.png) Rolling over the buttons highlights it: ![Screen Shot 2018-04-19 at 16.58.04.png](https://archive.blender.org/developer/F2841936/Screen_Shot_2018-04-19_at_16.58.04.png) Side view: ![Screen Shot 2018-04-19 at 16.58.07.png](https://archive.blender.org/developer/F2841938/Screen_Shot_2018-04-19_at_16.58.07.png) Side View rollover: ![Screen Shot 2018-04-19 at 16.58.09.png](https://archive.blender.org/developer/F2841941/Screen_Shot_2018-04-19_at_16.58.09.png) Back View: ![Screen Shot 2018-04-19 at 17.11.27.png](https://archive.blender.org/developer/F2842052/Screen_Shot_2018-04-19_at_17.11.27.png) The viewport manipulator is designed to be able to replace the numpad for users who prefer a more visual interaction, and so it should cover the the same features. For this reason, we will also have a Perspective on/off toggle and a camera view toggle. ## Preferences: In Preferences, users will have three options: - Manipulator (Default) *This option makes it so you can fully use the widget for rotation and to jump to various views* ![Screen Shot 2018-04-19 at 16.59.34.png](https://archive.blender.org/developer/F2842271/Screen_Shot_2018-04-19_at_16.59.34.png) - Indicator *This option removes all interaction from the widget and makes it slightly simpler* ![Screen Shot 2018-04-19 at 14.15.23.png](https://archive.blender.org/developer/F2840703/Screen_Shot_2018-04-19_at_14.15.23.png) - Off *We show nothing* ![Screen Shot 2018-04-19 at 14.15.34.png](https://archive.blender.org/developer/F2840700/Screen_Shot_2018-04-19_at_14.15.34.png) ## Process This gives some insight into our design process. We went through these alternatives before arriving at our final design: ![Screen Shot 2018-04-19 at 11.57.27.png](https://archive.blender.org/developer/F2838552/Screen_Shot_2018-04-19_at_11.57.27.png) ![Screen Shot 2018-04-19 at 11.42.16.png](https://archive.blender.org/developer/F2838559/Screen_Shot_2018-04-19_at_11.42.16.png) ![Screen Shot 2018-04-19 at 11.37.05.png](https://archive.blender.org/developer/F2838565/Screen_Shot_2018-04-19_at_11.37.05.png) ![Screen Shot 2018-04-19 at 11.32.22.png](https://archive.blender.org/developer/F2838569/Screen_Shot_2018-04-19_at_11.32.22.png) ## Sketches ![viewmanipulator_sketch1.jpg](https://archive.blender.org/developer/F2838676/viewmanipulator_sketch1.jpg) ![viewmanipulator_sketch2.jpg](https://archive.blender.org/developer/F2838680/viewmanipulator_sketch2.jpg) ![viewmanipulator_sketch3.jpg](https://archive.blender.org/developer/F2838684/viewmanipulator_sketch3.jpg) ![viewmanipulator_sketch4.jpg](https://archive.blender.org/developer/F2838687/viewmanipulator_sketch4.jpg)
William Reynish self-assigned this 2018-04-19 12:43:05 +02:00

Added subscribers: @WilliamReynish, @ideasman42

Added subscribers: @WilliamReynish, @ideasman42
Member

Added subscriber: @brita

Added subscriber: @brita

Changed status from 'Open' to: 'Resolved'

Changed status from 'Open' to: 'Resolved'

This part isn't clear to me:

We've decided for now to remove the Jump to Camera and Perspective toggles for now.

Switching to camera and turning on/off perspective can be done in this menu in top left:

  • There is no example of switching cameras / perspective (probably trivial, just noting there is no example of how it should look).
  • I'm not convinced it's a good idea to move perspective/ortho switching out of the manipulator.
Accessing this from a menu isn't very convenient - nor discoverable in the sense it's not something you will quickly access when manipulating the view, so people will end up wanting to use the shortcut if we have this ability only available from a menu.

This raises the question - is it expected that people on laptops without a numpad can use this navigation manipulator instead?

That was my intention, with the new design this is no longer the case.

This part isn't clear to me: > We've decided for now to remove the Jump to Camera and Perspective toggles for now. > > Switching to camera and turning on/off perspective can be done in this menu in top left: - There is no example of switching cameras / perspective *(probably trivial, just noting there is no example of how it should look)*. - I'm not convinced it's a good idea to move perspective/ortho switching out of the manipulator. ``` Accessing this from a menu isn't very convenient - nor discoverable in the sense it's not something you will quickly access when manipulating the view, so people will end up wanting to use the shortcut if we have this ability only available from a menu. ``` ---- This raises the question - is it expected that people on laptops without a numpad can use this navigation manipulator instead? That was my intention, with the new design this is no longer the case.

Committed b5451a642f

Committed b5451a642f

Added subscriber: @DuarteRamos

Added subscriber: @DuarteRamos

Committed tweaks: 70bcb0c01c

- Only show axis backdrop when hovering.
- Move closer to the screen corner.
Committed tweaks: 70bcb0c01c - Only show axis backdrop when hovering. - Move closer to the screen corner.

Added subscribers: @pablovazquez, @fsiddi

Added subscribers: @pablovazquez, @fsiddi

I would like to point out a couple of minor issues with the current implementation:

christmas.jpg

As you can see, there are a few differences with the proposed design, namely:

  • Typography: the hand-crafted letters showing the axis name could/should follow more closely the font used in Blender
  • Anti-aliasing: I've been told that drawing smooth circles is hard, but I'm sure it's possible. Currently this is in stark contrast with all other areas of Blender's interface featuring curves.
  • Proportions: right now the circles are slightly too big to maintain good proportions with the axes (I imagine this is so that they are easier to select, but that can be a hidden hotspot around the actual circle). Can they be made smaller according to the proposed design?

I understand this is mainly "polish", but for such a prominent interface element enabled by default, I think it's worth it.

I would like to point out a couple of minor issues with the current implementation: ![christmas.jpg](https://archive.blender.org/developer/F5324655/christmas.jpg) As you can see, there are a few differences with the proposed design, namely: - Typography: the hand-crafted letters showing the axis name could/should follow more closely the font used in Blender - Anti-aliasing: I've been told that drawing smooth circles is hard, but I'm sure it's possible. Currently this is in stark contrast with all other areas of Blender's interface featuring curves. - Proportions: right now the circles are slightly too big to maintain good proportions with the axes (I imagine this is so that they are easier to select, but that can be a hidden hotspot around the actual circle). Can they be made smaller according to the proposed design? I understand this is mainly "polish", but for such a prominent interface element enabled by default, I think it's worth it.

@fsiddi: Yes, for some reason, it isn't anti-aliased here either. Campbell tells me it should be though, but it seems as if it doesn't work on hiDPI?

@fsiddi: Yes, for some reason, it isn't anti-aliased here either. Campbell tells me it should be though, but it seems as if it doesn't work on hiDPI?

I'm on a non-hiDPI monitor here, and it still shows the issue. Do you agree with the other 2 points of the issue?
What is the protocol to handle this kind of feedback? Should the task be set as open again?

I'm on a non-hiDPI monitor here, and it still shows the issue. Do you agree with the other 2 points of the issue? What is the protocol to handle this kind of feedback? Should the task be set as open again?

Yes I agree with you. The text is like that (afaik) because it doesn't use real fonts - it's just OpenGL lines. No idea how easy it would be to do it the nicer way. Not sure about correct protocol, we obviously have larger issues to tackle first. We could ask Campbell?

Yes I agree with you. The text is like that (afaik) because it doesn't use real fonts - it's just OpenGL lines. No idea how easy it would be to do it the nicer way. Not sure about correct protocol, we obviously have larger issues to tackle first. We could ask Campbell?

Hi @ideasman42 do you have time to comment on https://developer.blender.org/T54723#548752 and perhaps let us know when this could be worked on?

Hi @ideasman42 do you have time to comment on https://developer.blender.org/T54723#548752 and perhaps let us know when this could be worked on?

Added subscriber: @brecht

Added subscriber: @brecht

Changed status from 'Resolved' to: 'Open'

Changed status from 'Resolved' to: 'Open'

It may be a macOS specific issue with polygon smoothing, it's antialiased here on Linux. DPI is unlikely to have an influence.

I'll reopen the task.

It may be a macOS specific issue with polygon smoothing, it's antialiased here on Linux. DPI is unlikely to have an influence. I'll reopen the task.

Added subscriber: @xrg

Added subscriber: @xrg

I don't get antialiased circles either. Linux/AMD.

I don't get antialiased circles either. Linux/AMD.

This should be made to work everywhere, since I can't redo am not sure how to handle this though.

Isn't this a more general issue? if we can't rely on GL_LINE_SMOOTH / GL_POLYGON_SMOOTH this will impact many areas, not just the view manipulator.

Does the transform tools gizmo also not draw with anti-aliased shapes? (shows with smoothing here)

This should be made to work everywhere, since I can't redo am not sure how to handle this though. Isn't this a more general issue? if we can't rely on `GL_LINE_SMOOTH` / `GL_POLYGON_SMOOTH` this will impact many areas, not just the view manipulator. Does the transform tools gizmo also not draw with anti-aliased shapes? (shows with smoothing here)

Gizmos don't seem to be anti-aliased either.

manipulator.png

Gizmos don't seem to be anti-aliased either. ![manipulator.png](https://archive.blender.org/developer/F5329528/manipulator.png)

Changed status from 'Open' to: 'Resolved'

Changed status from 'Open' to: 'Resolved'

Since this is a spesific OpenGL issue which seems like it's not isolated to gizmo's - opening #57570, rather handle replies there since it's not about the gizmo design and more a compatibility issue.,

Since this is a spesific OpenGL issue which seems like it's not isolated to gizmo's - opening #57570, rather handle replies there since it's not about the gizmo design and more a compatibility issue.,
Member

This comment was removed by @pablovazquez

*This comment was removed by @pablovazquez*

psst, reply to #57570 :) seems all nvidia's support this and have done so since the feature was available.

psst, reply to #57570 :) seems all nvidia's support this and have done so since the feature was available.

I don't want to be repetitive, but there were two more topics in my initial post (typography and proportions).
Do you have time to look into this, or can it be placed on the task list?

I don't want to be repetitive, but there were two more topics in my initial post (typography and proportions). Do you have time to look into this, or can it be placed on the task list?

Added subscriber: @Sergey

Added subscriber: @Sergey

@ideasman42 , think this report has been closed too fast. There is definitely nothing resolved here -- aliasing is only one one of raised concerns. The rest of the points UI team agrees on, and is not addressed in any way.

The text is like that (afaik) because it doesn't use real fonts - it's just OpenGL lines. No idea how easy it would be to do it the nicer way.

This is super-easy to draw proper font.

@ideasman42 , think this report has been closed too fast. There is definitely nothing resolved here -- aliasing is only one one of raised concerns. The rest of the points UI team agrees on, and is not addressed in any way. > The text is like that (afaik) because it doesn't use real fonts - it's just OpenGL lines. No idea how easy it would be to do it the nicer way. This is super-easy to draw proper font.

Changed status from 'Resolved' to: 'Open'

Changed status from 'Resolved' to: 'Open'

Changed status from 'Open' to: 'Resolved'

Changed status from 'Open' to: 'Resolved'

Committed tweaks to axis handle size & use font for XYZ axis see (287c023b85, c192ce6717), closing.

Committed tweaks to axis handle size & use font for XYZ axis see (287c023b85, c192ce6717), closing.

Thank you Campbell, this is definitely an improvement.

Thank you Campbell, this is definitely an improvement.

@fsiddi np, and sorry for closing too quick!

For the eagle eyed users ...

  • While the code to center the characters over the circle is simple, at some UI scales there is subtle offset where it's not exactly centered. Even small errors are noticeable - somehow getting the boundbox of a character is not exacting.

  • The fonts aren't pixel aligned and are a little blurry, we could do this but then they would jitter relative to the circles, so ... those should be pixel too or it looks strange.

@Sergey, if you want some super easy rainy day todo, feel free to look into these ;)

@fsiddi np, and sorry for closing too quick! For the eagle eyed users ... - While the code to center the characters over the circle is simple, at some UI scales there is subtle offset where it's not exactly centered. Even small errors are noticeable - somehow getting the boundbox of a character is not exacting. - The fonts aren't pixel aligned and are a little blurry, we could do this but then they would jitter relative to the circles, so ... those should be pixel too or it looks strange. @Sergey, if you want some super easy rainy day todo, feel free to look into these ;)

Added subscriber: @0o00o0oo

Added subscriber: @0o00o0oo

Not sure if this is where it needs to be suggested, but couldn't find a more appropriate task.

Could we get a button in the viewport to toggle between Turntable and Trackball orbit styles?

Right now, it's a hassle needing to open up preferences to do so, especially because it can't even be hotkeyed.

Not sure if this is where it needs to be suggested, but couldn't find a more appropriate task. Could we get a button in the viewport to toggle between Turntable and Trackball orbit styles? Right now, it's a hassle needing to open up preferences to do so, especially because it can't even be hotkeyed.

@0o00o0oo: I can't see why this should be a button in the viewport. We cannot, for obvious reasons, add every single preference inside the viewport, or it will become unmanageable and get in the way of your work.

Something like Trackball vs Turntable really is a preference, hence that's where it should be.

@0o00o0oo: I can't see why this should be a button in the viewport. We cannot, for obvious reasons, add every single preference inside the viewport, or it will become unmanageable and get in the way of your work. Something like Trackball vs Turntable really is a preference, hence that's where it should be.

@WilliamReynish I see it akin to orthographic/perspective, it's a usability issue. I think this is especially true when sculpting, but I find even when modeling or animating, sometimes I want to turn the viewport a certain direction that Turntable doesn't allow me to, but it takes me out of my workflow to fire up the preferences window, find the option to toggle.

If nothing else, do you know if this switch will be hotkeyable in Blender 2.8 if we can't get a button for it?

@WilliamReynish I see it akin to orthographic/perspective, it's a usability issue. I think this is especially true when sculpting, but I find even when modeling or animating, sometimes I want to turn the viewport a certain direction that Turntable doesn't allow me to, but it takes me out of my workflow to fire up the preferences window, find the option to toggle. If nothing else, do you know if this switch will be hotkeyable in Blender 2.8 if we can't get a button for it?
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
11 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#54723
No description provided.