Quelle est la meilleure façon de faire pivoter un objet?
Je suis un développeur sur le long chemin pour apprendre le design, alors pardonnez-moi si je ne suis pas dans le jargon du design ????.
Je dois concevoir une interface pour faire pivoter un objet 2D. La rotation est discrète par pas fixe: l'objet peut être tourné de 0 °, 45 °, 90 °, ..., 180 ° degrés (dans cet exemple le pas est de 45 ° mais il peut être paramétré par configuration).
J'ai peu d'idées et j'aimerais discuter de celle qui pourrait être la meilleure.
Curseur standard:
Le curseur standard est partout, facile à mettre en œuvre, facile à utiliser. Il y a un curseur sur l'objet et en le déplaçant, l'utilisateur peut contrôler la rotation de l'objet.
Poignée coulissante à arc circulaire
Il y a l'objet entouré d'un curseur d'arc circulaire avec une poignée que l'utilisateur peut faire glisser pour faire pivoter.
Je pense que la forme circulaire du curseur peut être fonctionnelle pour conseiller le but du curseur (une rotation), mais je pense que le déplacement par pas fixe ne peut pas être aussi intuitif à la fois pour la mise en œuvre et l'utilisation.
Quel peut être le meilleur? Des considérations/idées/conseils? Y a-t-il d'autres façons de le faire? Peut-être des moyens plus simples?
Je pense que l'arc a l'air cool, mais c'est un enfer à mettre en œuvre et les utilisateurs vont essayer de suivre l'arc avec un mouvement assez complexe à faire avec la souris et surtout le trackpad. Je pense qu'il vaut mieux suggérer un mouvement le long d'un axe parce que vous contrôlez une dimension. Pourquoi gaspiller la deuxième dimension pour ça?
Ou suggérez simplement que la rotation est possible en plaçant l'icône de rotation à côté de l'objet, puis autorisez le mouvement de la souris le long de n'importe quel axe, le point de rotation est au centre de l'objet (ou si autrement indiqué) et la rotation se produit le long d'une ligne de rotation comme indiqué sur l'illustration (le pointeur de la souris est à l'autre bout de la ligne magenta)
Cela devrait être contrôlé par de simples boutons car il ne tourne que sur quelques positions.
Des boutons simples peuvent supprimer toute la charge cognitive de déterminer ce que font les boutons. Ils encouragent les utilisateurs à appuyer pour découvrir.
Voici un outil avec des commandes de bouton simples: 
Lorsqu'il est en rotation, il peut afficher les informations de rotation sur l'objet: 
Je pense que l'affichage de "l'arc circulaire" est mieux combiné avec un bouton radio (ou un autre en fonction de vos préférences) pour choisir sous l'objet.
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Puisque vous avez des degrés donnés en degrés fixes, c'est plus viable et de cette façon, vous pouvez éviter d'avoir à gérer des animations supplémentaires pour ce curseur circulaire.
Remarque: je n'avais pas besoin de modifier la photo originale de vous même si elle affiche le mouvement de la main comme un élément actionnable, mais plutôt la partie supplémentaire.
Si vous regardez la capture d'écran, normalement dans un logiciel de conception comme Adobe, lorsque vous déplacez votre curseur sur le bord d'un objet, il se transforme en curseur de rotation.
Ceci est un exemple du logiciel de prototypage figma. Notez que sur le côté droit, vous avez un panneau où vous pouvez définir avec précision les paramètres de rotation. Il peut être judicieux d'avoir un panneau global comme celui-ci afin que d'autres propriétés d'objet puissent être manipulées ici. Faites défiler jusqu'à objets en rotation