I wanted to enable rotation editing via a simplified 2D UI for futari-app. I have started by the most obvious way: 3 concentric circles (XYZ axis).

Even if the design was cool and super simple, there was a huge problem with this widget: NOTHING is circular in the UI! Obviously this appeared once the graphical and functional research was nearly over.

I decided to trash the whole design and start from scratch, and rebase the widget on an element already present in the interface: the color picker. It is easy to modify 2 axis of rotation at the same time by representing the rotation as a 2d gradient. It was only missing the plane selection, the display of axis constrains, current and target values (rotation will be smoothed on the object).

The visual impact is better, it is confusing at first sight but i’m quite sure it will be intuitive to use and will remove the usual difficulty to set rotations (all 3d guys are using shortcuts instead of UI to rotate their objects, as it is always tricky to click on the right axis). Starting the implementation now.