web-dev-qa-db-fra.com

Meilleure expérience utilisateur possible pour les pièces jointes?

Je travaille en tant qu'équipe d'interface utilisateur individuelle pour Kanbanery et je travaille actuellement à l'amélioration de notre interface utilisateur et de l'expérience utilisateur pour les pièces jointes des tâches. Actuellement, nous prenons en charge deux types de pièces jointes de tâches - les pièces jointes régulières (juste affichées sous forme de liste) et les pièces jointes que nous pouvons prévisualiser (images, etc.) qui génèrent une miniature.

Ma tâche consiste à rendre évident comment prévisualiser et comment télécharger la pièce jointe sans la rendre trop occupée (notre interface utilisateur est assez occupée).

enter image description here

Actuellement, cliquer sur la miniature agrandit l'image dans une fenêtre modale et cliquer sur le titre (ou l'icône "flèche vers le bas") la télécharge. Je ne pense pas que ce soit assez évident. De plus, je n'aime pas le fait que les grandes images prennent autant de place.

Des idées pour l'améliorer?

2
Mariusz Ciesla

Si vous ne voulez pas encombrer votre interface utilisateur et que vous avez des pièces jointes avec et sans aperçu, je m'en tiendrai à une liste simple, j'ajouterais le plus petit pouce possible à cette liste et ferais en sorte que la zone d'aperçu (comme la lightbox) ne couvre pas cet élément/liste pour faciliter l'aperçu suivant/précédent en survol (ou ajouter un bouton d'aperçu/zoom).

Quelque chose comme ça:

hover zoom

Vous pouvez également créer des boutons suivant/précédent dans la lightbox ainsi qu'un lien de téléchargement dans le pied de page de la lightbox pour faciliter la navigation dans les pièces jointes prévisibles ...

Pour le rendre plus élégant, je resterais avec les pouces carrés ...

4
rombarcz

N'ayez pas peur d'utiliser des liens texte, Google les aime bien sûr. Voici comment google traite les pièces jointes dans gmail:

attachemnts in gmail

Maintenant, je pense que c'est plutôt moche et non organisé mais l'UX fonctionne très bien. Je sais exactement comment télécharger chacun et comment les visualiser, etc.

Vous pourriez faire quelque chose comme ça:

hover over

Il pourrait être en vol stationnaire ou juste là. (vous n'avez pas besoin d'utiliser une ombre portée haha)

6
jonshariat