Comment afficheriez-vous des articles (produits) distincts sur une seule photo?
Disons que nous avons une image d'un homme avec un chapeau cool, un t-shirt, des bottes, etc. L'idée est de montrer ces articles comme des produits, afin que vous puissiez les trouver et les acheter si vous le souhaitez.
En ce moment, je vois deux façons d'afficher ce
Comment résoudrais-tu ce problème?
Il y a deux choses principales à considérer:
- Où l'utilisateur voit-il les informations
- Où l'utilisateur interagit-il (/ demande-t-il cette information)
Avoir les informations en dehors de l'image ne couvre pas l'image et est toujours visible pour que l'utilisateur sache à quoi s'attendre et ne manque rien.
L'utilisateur peut interagir à la fois sur l'indicateur (votre point dans ce cas) ou sur les informations. Donner la possibilité d'interagir avec les deux est probablement une bonne idée. Donc, si les informations sont en dehors de l'image, l'interaction avec elle note l'indicateur correspondant et inversement.
Ce sont des suggestions générales et selon votre cas, vous souhaiterez peut-être changer la façon dont l'utilisateur obtient les informations et interagit avec elles pour obtenir une certaine expérience utilisateur.
Je pense qu'il y a des pièges dans la première approche. Des facteurs tels que le style, la composition, le montage, etc. ont été délibérément choisis par le photographe afin de transmettre un certain message (style de vie, attractivité, désirabilité, ...) au spectateur. L'impression globale prévue de la photo peut être compromise lorsque vous ajoutez du texte et/ou des contrôles sur l'image. Surtout dans une boutique de mode en ligne, l'image du produit est l'élément le plus important sur la base duquel l'utilisateur décide d'acheter ou de ne pas acheter - en fait, vous ne devez pas ajouter d'éléments qui pourraient de quelque manière distraire ou perturber le produit présentation.
De plus, toutes les boîtes de produits doivent être visibles en même temps: par exemple, les utilisateurs choisissent non seulement par leur apparence, mais aussi par leur prix. Ne pas afficher les détails essentiels de chaque produit peut représenter un risque pour les grandes entreprises. Ce fait rend encore plus difficile de combiner les boîtes de produits avec l'image: Par exemple, les détails des vêtements ne doivent pas être couverts par du texte et le texte doit être conçu pour être clairement lisible (par exemple, pouvez-vous garantir une taille de texte appropriée pour tous boîtes sur l'image?).
Je ne veux pas exclure qu'il existe un design où photo et texte (encadrés) s'harmonisent parfaitement les uns avec les autres. Je veux juste souligner quelques difficultés potentielles et la nécessité d'une conception très soignée.
Vous pourriez faire quelque chose comme Polyvore. qui est une sorte de vue rapide lorsque vous survolez la zone. similaire à votre 1ère option
Je suggérerais d'aller pour la première option avec un style génial comme dans ce lien https://tympanus.net/Development/TooltipStylesInspiration/curved.html
Les cercles pulsants sensibilisent l'utilisateur aux éléments cliquables ou à quelque chose à explorer.
- Cette option est utile car elle donne des indications claires sans distraire la vue de l'utilisateur et peut obtenir des informations sur les détails du produit sans supposer voir les détails dans une autre vue en dehors du produit.
- Cette option permet aux utilisateurs de voir les détails en dehors du produit et je pense que cela distrait et moins simple d'afficher tous les détails en un seul endroit.
Et mon option serait numéro un.