"Ajouter et soustraire une valeur" Contrôle horizontal ou vertical une meilleure accessibilité?
"Ajouter et soustraire une valeur" est l'alignement horizontal des contrôles moins efficace que l'alignement vertical?
Je travaille sur un projet, où nous essayons de presser une interface utilisateur équivalente à la complexité d'un centre de commande de la NASA dans un écran tactile de 14 ", et nous manquons d'espaces horizontaux essayant de presser vertical" + "et" - "contrôler tout en essayant de conserver la catégorie entière dans un seul plan horizontal.
nous expérimentons donc avec des placements horizontaux de "+" et "-". Quelqu'un a-t-il eu de l'expérience avec cette disposition? le placement vertical est-il plus abordable que horizontal? 
Pourquoi je préférerais l'alignement vertical:
Dans mon opinion personnelle (que je ne peux pas soutenir par aucune recherche), la variante verticale serait juste un peu plus intuitive:
Nous avons l'habitude de penser
5 est supérieur/supérieur "que 2
plutôt que
5 est plus à droite que 2.
"Supérieur" implique une orientation verticale .
Cependant, si vous disposez les nombres sur un vecteur horizontal, plus à droite pourrait avoir un sens.
Cela étant dit, je suppose que la différence réelle dans le monde réel entre la disposition verticale et horizontale est négligeable.
Ce qui importe beaucoup plus que l'alignement:
Peu importe si vous décidez d'utiliser la variante horizontale ou verticale, gardez regroupement à l'esprit, comme dans "quel bouton modifie ce nombre ".
Particulièrement s'il s'agit d'un panneau rempli de différents indicateurs et boutons, cela devient d'une importance vitale (et est souvent négligé).
Les étiquettes - mon cas pour + et -:
Je suggère d'utiliser + et - pour les étiquettes, tant que la valeur en cours de modification est un nombre . Franchement, c'est aussi intuitif que possible.
Si et quand il s'agit de listes de valeurs arbitraires (telles que "45 °", "90 °", "180 °" ou "Pommes" ou " Oranges ") d'autre part, je recommanderais certainement l'utilisation de ◀ et ▶.
Gardant tout cela à l'esprit, voici ce que j'irais avec:
Approches alternatives:
Une autre option à considérer serait de ne montrer que le nombre par défaut. Au toucher/toucher long, vous pouvez alors effectuer l'une des opérations suivantes:
- Afficher une vue "machine à sous" pour la sélection des numéros (similaire à celui-ci - regardez l'exemple 3 ou 4 )
- Afficher un curseur de sélection de valeur similaire dans la moitié supérieure de cette image - qui suppose que vous avez une plage de nombres finis.
- Affichez une superposition avec votre méthode préférée de sélection/saisie de numéro.
La viabilité de ces méthodes dépend bien entendu de:
- si l'étape supplémentaire de toucher/toucher long est acceptable pour les utilisateurs (si les numéros doivent être modifiés toutes les deux secondes, cela pourrait s'avérer assez lourd);
- s'il est acceptable que d'autres commandes soient masquées lors de la saisie.
Qu'en est-il de placer le bouton d'incrémentation au-dessus du nombre et le bouton de décrémentation ci-dessous? C'est aussi le nombre d'applications pour smartphone qui le font. De cette façon, vous conservez l'association haut/bas pour plus/moins, mais vous pouvez utiliser plus d'espace vertical. Cependant, cela utilise plus d'espace vertical que les boutons gauche/droit sous le nombre.
Pensez complètement différent, c'est tactile :)
Un excellent moyen de mettre en œuvre des cadrans se trouve dans le Figure iPhone app (regarder la vidéo) de Propellerhead. Il a une grande interface utilisateur en général, mais l'expérience de changer les valeurs est vraiment agréable. Regardez comment ils font les contrôles circulaires en haut qui sont modifiés en faisant glisser vers le haut et vers le bas. Cela pourrait être plus proche de ce dont vous avez besoin pour économiser de l'espace et le rendre plus intuitif/approprié.
Considérations
Le seul problème avec leur interface serait si vous avez besoin d'un nombre très précis dans un grand ensemble. Par exemple 345 dans une plage comprise entre 1 et 500, cela est difficile à faire sur un curseur, mais encore plus fastidieux avec votre incrément de + -1.
Et en fait, c'est mon principal problème avec le modèle d'incrémentation que vous utilisez actuellement, vous ne pouvez que faire +1 ou -1 à la fois, est-ce une bonne expérience lorsque vous passez de 0 à 29?
Que diriez-vous d'aller vers une solution totalement radicale et de n'avoir aucun contrôle?
Lorsque les utilisateurs cliquent sur la cellule et glissent latéralement, le curseur change et le fait de faire glisser le curseur vers la droite et vers la gauche fait monter ou descendre la valeur.
Bret Victor le fait dans ses explications visuelles: http://worrydream.com/TenBrighterIdeas/
Ainsi, par exemple ici, lorsque l'utilisateur se déplace sur la valeur numérique interactive, le curseur se transforme en curseur de sélection et l'utilisateur peut glisser vers la gauche ou la droite. Je peux voir que cela fonctionne bien dans un environnement tactile:
Il utilise également des curseurs qui apparaissent en survol: 
Vous pouvez incrémenter les curseurs ou autoriser un réglage fin par de nombreuses méthodes différentes. Par exemple, vous pouvez donner aux utilisateurs le contrôle des incréments via un seul paramètre dans un menu ou un outil en haut de la fenêtre ou des raccourcis.
Il y a quelques problèmes avec l'application de cette technique au toucher - qui, je pense, pourraient tous être surmontés avec un aperçu minutieux:
De toute évidence, vous devrez adapter les commentaires fournis à un environnement tactile car les doigts des utilisateurs masqueraient le changement de curseur. Vous pouvez peut-être mettre en surbrillance la cellule entière et afficher un contrôle au clic.
Il y a un problème de découvrabilité ... il serait important d'indiquer tout sur la page qui est interactif ... peut-être avec une nuance de couleur ou une ligne pointillée comme Bret l'a utilisé. Une autre idée est de flasher rapidement tous les contrôles cachés lors de l'entrée dans une page ... comme discuté ici .
Le survol ne fonctionne pas au toucher ... il devrait donc être basé sur les clics.
Cette solution vous permettrait certainement d'économiser un espace considérable et un "encombrement visuel". Je pense que ce serait très facile à apprendre, surtout s'il est utilisé dans un environnement expert.
Une autre ressource que je recommanderais vivement pour concevoir des dispositions d'affichage est l'excellent site Web de Stephen Few: http://www.perceptualedge.com/
Il y a beaucoup de conseils sur la conception de tableaux de bord et un excellent forum de discussion.
Contre @Yallow, ce sont des gens dont l'expertise sera probablement dans d'autres domaines, et, je suppose, ils ne voudront pas apprendre de nouvelles interfaces. Les horizontales ne fonctionnent pas aussi bien pour moi que les verticales (parce que les verticales indiquent changer les valeurs "haut" et "bas", je suppose), donc ce serait préférable. De plus, les horizontales mettent un peu plus de temps à déterminer ce qui est - c'est peut-être juste moi.
Mais je m'attendrais également à ce que le public cible puisse apprendre à utiliser les commandes horizontales, s'il est nécessaire d'emprunter cette voie. L'inconvénient est probablement moindre que pour une population générale. Si vous avez - comme il semble que vous l'avez - une bonne raison de les rendre différents, alors faites-le. Dans ce cas, je pense que l'avantage de pouvoir ajuster les commandes horizontalement peut être plus important que les boutons de changement étant légèrement différents.
Centre de commandement de la NASA
L'une des premières étapes que je prends lors de la conception d'une interface utilisateur est d'apprendre à connaître l'utilisateur. D'après ce que vous avez indiqué avec ce projet pour [~ # ~] nasa [~ # ~] , c'est un bon indicateur pour lequel vous le concevez un ensemble d'utilisateurs assez formés où l'utilisation de vertical vs horizontal ne fera pas beaucoup de différence.
Ces quatre options sont relativement intuitives et ne demandent pas beaucoup de réflexion tant que vous respectez Principe de proximité de Gestalt. C'est le principe principal que vous devez garder à l'esprit lorsque vous concevez quelque chose avec beaucoup de fonctionnalités.