web-dev-qa-db-fra.com

Placement d'icône de champ modifiable?

J'ai un formulaire pour télécharger des pièces jointes (PDF). Après les avoir téléchargés, il y a une section (comme le montre l'image ci-dessous) vous permettant de renommer la pièce jointe, de la visualiser ou de la supprimer.

Les icônes d'édition semblent avoir des problèmes de convivialité. Ils sont difficiles à remarquer en raison de la nature très contrastée du bouton d'affichage, de l'icône de suppression et du nom de la pièce jointe.

Ce que je me demande, c'est s'il vaut mieux placer l'icône de modification directement à côté de celle qu'elle modifie, ou à côté de l'icône de suppression (pour créer une zone exploitable)?

Et quel raisonnement objectif existe pour soutenir ce choix?

enter image description here

4
Bill Martin

Il y a quelques zones dans la mise en page qui causent probablement des problèmes.

  1. Vous avez à la fois des actions d'édition et de suppression disposées de différentes manières
  2. Votre bouton d'édition est très faible et difficile à repérer

Pour résoudre ce problème, je recommanderais d'implémenter une zone d'actions qui montrerait clairement quelles actions possibles peuvent être effectuées pour chaque élément de ligne de pièce jointe comme ceci.

enter image description here

Pour soutenir ce choix -

  • La zone d'actions est maintenant beaucoup plus claire avec des titres ainsi que des icônes familières pour le supporter.
  • La couleur de l'icône est beaucoup plus forte et beaucoup plus lisible pour l'utilisateur

J'espère que cela pourra aider.

6
stradled

Je ne suis pas d'accord avec les autres sur la modification et la suppression qui doivent être rapprochées. D'après ce que j'ai compris, la modification concerne uniquement le nom de la pièce jointe. La suppression concerne l'intégralité de la pièce jointe. Il n'y a pas d'option pour modifier la pièce jointe entière. Ainsi, l'action de suppression fait référence à l'élément entier et ne doit pas ressembler à l'action de modification du nom de l'élément. Je suggère simplement de rendre l'icône d'édition plus sombre, et c'est tout. La meilleure façon est d'essayer les deux types de solutions ensemble dans les tests A/B, et de voir simplement quelle édition sera la plus cliquée. Dans un nombre élevé d'utilisateurs, le pourcentage de "modifications" doit être réparti de manière uniforme si le test A/B est aléatoire.

4
Yoav Moran

Les fonctions d'affichage et d'édition doivent être plus proches les unes des autres. Le bouton de pièce jointe occupe une grande partie de l'immobilier. L'icône de la corbeille est plus explicite.

cleaner layout

2
Ballisticone

Changez la couleur du crayon pour qu'il contraste davantage. Le bleu est correct, il suffit de l'assombrir un peu pour qu'il ait un poids visuel similaire au X.

Rapprochez le crayon beaucoup plus de la croix. En ce moment, vos boutons sont partout; un à gauche, au milieu, à droite. En déplaçant l'édition à côté de la supprimer, vous créez une sorte de barre de modification.

Je ferais aussi le bouton vue/détail (le V) plus large, tout le texte du titre ou même la barre entière, pour en faire un bouton plus grand.

(Modifier) ​​Fondamentalement, ce que chevauché a dit pendant que j'étais distrait.

0
PixelSnader