web-dev-qa-db-fra.com

Abordance pour la suppression de petites images / icônes

J'ai une collection empilée d'images/icônes qui ressemblent à ce qui suit lorsqu'elles sont placées dans une colonne relativement étroite:

Stacked icons

Ceux-ci peuvent être supprimés un par un, et actuellement la façon dont je le fais est similaire à cette image (mal recréée mais correctement mise à l'échelle), en assombrissant l'image et en superposant une croix rouge:

enter image description here

Je ne peux pas m'empêcher de penser que ce n'est pas la meilleure façon de procéder, bien que je ne sois pas vraiment sûr d'une bonne alternative.

J'avais envisagé de placer des croix sous chacune, ou peut-être partiellement superposées dans les coins en haut à droite, mais cela augmente l'espace pris par chacune.

Existe-t-il une alternative qui me manque ou la possibilité de suppression vaut-elle l'utilisation d'espace supplémentaire?

1
Dan

J'aime toujours voir comment "les gros joueurs" gèrent ce type d'interactions. Ils ont généralement eu le temps et les ressources pour trouver la solution la plus parfaite.

Dans ce cas, je pense à Google avec leur application Photos. Pour supprimer (ou effectuer toute autre action avec les images), vous devez sélectionner les images en frappant un petit cercle avec une coche. Après avoir sélectionné une ou plusieurs images, l'option de suppression (entre autres) apparaît dans l'en-tête. Cela permet également une suppression en masse.

Je pense que ce modèle est très applicable à votre situation.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Donnez à vos images/icônes un état sélectionné (en ajoutant une bordure par exemple) et montrez l'option de suppression une fois sélectionné.

Si vous vous inquiétez de la possibilité de découverte, si l'utilisateur sait qu'il peut supprimer les images/icônes, vous pouvez toujours les inverser.
Afficher un lien "supprimer les images" ou une icône de corbeille. Lorsque vous cliquez dessus, changez l'état des images/icônes afin qu'elles soient plus cliquables. Pour ce faire, vous pouvez ajouter une bordure à peine visible et la colorier (ou la rendre moins transparente) lorsqu'elle est sélectionnée.

1
Paul van den Dool