Best way to represent "rotation" of an 3D object

by Joao Carvalho   Last Updated January 31, 2017 14:06 PM

Right now I'm working on improving a section of an app that we are redesigning on my workplace.

Basically it's an app that runs on a tablet and the specific part of the app that I present here is an option to rotate up/down and sideways a 3D representation of a physical object.

Initially the interface is like this:

enter image description here

The problem here are:

  1. I believe there is a lot of buttons "just to" rotate an object
  2. although you have buttons to rotate on both ways (e.g: left and right arrows), it doesn't mean that you will rotate with positive or negative values, it's only a shortcut to increase/decrease the rotation degrees. It's a way to simply add or retrieve 1° per tap (precision is an important factor here) but, again, makes the UI with a lot of buttons.

Any suggestion?

Answers 2

You could use a slider for each axis with a button on each side to increment the angle just one degree (as the user needs precision). Also if the user wants an specific angle he can enter it in the number input (which should auto-update with the slider, and the other way round).

enter image description here

January 31, 2017 13:26 PM

The most comfortable 3D design packages I used allows to use a concept that is very intuitive and friendly both to mouse and touchscreen.

You select the rotation icon, then point on any place of the screen and drag. The system behaves as you are pushing a transparent sphere that contains your drawing. It is easy for people to understand what is going on. Specially if you draw a wireframe or arrows representing the transparent sphere that is being touched by the user.

Analog concepts can be done for translation and zoom.

Blender, for instance, has an 3D cursor that controls the center of rotation. The anoying part is how to tell the package when you want to set the cursor position, select an object or do some operation. But if I understood your case this is not really necessary.

January 31, 2017 22:52 PM

Related Questions

Updated January 09, 2017 08:06 AM

Updated October 08, 2017 01:16 AM

Updated January 16, 2019 14:16 PM