Affichage de la "cliquabilité" sur les tuiles plates
Je suis actuellement en train de repenser une caisse pour un e-commerce qui a audince non-techy savvy. Je crains que sans élément actionnable tel que radio/case à cocher/bouton, notre public ne sache pas d'un coup d'œil que ces éléments sont sélectionnables.
Vous trouverez ci-dessous l'un des exemples avec la radio ci-jointe, mais pour être honnête, je ne suis pas convaincu que ce soit bon.
Avez-vous déjà vu un bon ajout aux tuiles qui les fait être perçues comme cliquables? Changer le design en skeumorphic n'est pas possible, car tout le site Web évolue dans le sens d'un style plat.
Puisque vous avez mentionné que cela s'adressait aux personnes qui ne sont pas technophiles, je conseillerais d'être aussi clair que possible. Voir une suggestion ci-jointe.
Quelques notes:
1) Vous pouvez avoir cette barre "Choisir cette option" persistante dans toutes les cartes, ou les faire passer en "vol stationnaire". En vol stationnaire est une meilleure idée, mais ensuite il faudrait d'abord survoler. Décidez donc cela en fonction du contexte.
2) Lors de la sélection, vous pouvez mettre en surbrillance la tuile sélectionnée, suggérant clairement quelle tuile l'utilisateur a choisi.
tilisez une couleur universelle (et de préférence une autre caractéristique stylistique) pour rendre les éléments cliquables évidents.
Dans votre exemple, le bouton Soumettre est jaune, donc j'ajouterais des bordures jaunes autour des tuiles cliquables. Une sécurité intégrée supplémentaire ou alternative serait d'utiliser du jaune pour les en-têtes de tuiles ou, comme le bouton Soumettre, du noir avec des arrière-plans jaunes.
La couleur est la caractéristique visuelle la plus saillante. Si elle est utilisée correctement, la couleur peut être utilisée pour conditionner classiquement les utilisateurs à associer une certaine couleur à un certain résultat ou une certaine classification. Pensez aux panneaux de signalisation:
- Prohibitif
- De précaution
- Temporaire
- Distance
- Limitation de vitesse
Chaque catégorie a sa propre couleur prédominante. Ce n'est pas une coïncidence. Vous utilisez actuellement le jaune pour indiquer qu'un bouton est cliquable, alors respectez ce schéma.
Vous avez déjà fait le bon choix ici si vos utilisateurs ne sélectionnent qu'un seul élément:
Sélectionnez un seul article
Un seul élément peut être sélectionné en cliquant dessus, en le touchant ou en appuyant sur la barre ESPACE lorsqu'il a le focus (sélection d'objet). Si une interface prend en charge la sélection de plusieurs éléments, elle affiche une case à cocher à côté d'un élément. Ainsi, en variante, cette case à cocher peut être cochée pour sélectionner l'élément (basculer la sélection). Dans les deux cas, un marqueur visuel puissant autour de l'élément signale sa sélection. De plus, toute vue visible et activée pour les détails de l'élément sera actualisée immédiatement et affichera des informations supplémentaires sur l'élément juste sélectionné.
Mais si l'utilisateur est censé sélectionner plusieurs éléments, vous avez besoin d'une case à cocher:
Sélectionnez plusieurs éléments
Pour sélectionner plusieurs éléments, vous sélectionnez plusieurs fois des éléments uniques à l'aide de leurs cases à cocher jusqu'à ce que tous vos éléments soient sélectionnés (basculer la sélection). Si vous utilisez les cases à cocher, tous les éléments déjà sélectionnés restent sélectionnés et les nouveaux éléments sélectionnés sont simplement ajoutés à l'ensemble d'éléments sélectionnés.