web-dev-qa-db-fra.com

Quelles sont les interfaces / composants les plus courants? Quelles sont leurs forces / faiblesses? Comment améliorer?

Hm, je suis en train de me trouver souhaitant que nous ayons communautairewiki

Après avoir vu cette question: Quelle est l'interface utilisateur la plus courante au monde? J'ai pensé qu'il serait instructif de ne pas limiter la discussion en essayant de distinguer les most ​​common, mais au lieu de cela, discutez des nombreuses interfaces communes avec lesquelles nous (lire: l'humanité) interagissons quotidiennement, et comment elles peuvent être améliorées.

Quels sont donc les UI/composants UI les plus courants? Quelles sont leurs forces et leurs faiblesses? Comment peuvent-ils être améliorés?

Par exemple:


Boîtes combinées

Les zones de liste déroulante sont abondantes sur le Web et dans les logiciels de bureau.

Avantages: Bon pour permettre à un utilisateur d'avoir une liste de choix tout en nécessitant un minimum d'espace lorsqu'il n'est pas utilisé.

Problème : devient difficile et difficile pour un utilisateur si la liste de choix est trop longue.

Solution potentielle : zones de liste déroulante à saisie semi-automatique, utilisant la correspondance de texte sur les entrées utilisateur tapées pour affiner la liste des choix possibles et permettre une sélection plus facile.


Évidemment, je n'ai pas inventé la liste déroulante de saisie semi-automatique; notez que les réponses ne doivent pas nécessairement être des améliorations que vous avez inventées.

3
instanceofTom

Les tables

La réponse est donnée du point de vue des applications bureautiques mais peut être également valable pour les applications web.

Avantages: Peut contenir une grande quantité de données dans une zone relativement petite.

Inconvénients: La recherche peut devenir impossible si le nombre d'entrées est important. Sans rendu attrayant (icônes, couleurs), l'application pourrait sembler ennuyeuse. Certaines informations peuvent être redondantes pour certains utilisateurs. La priorité des données est aplatie.

Comment améliorer: Fournir des méthodes d'organisation des données - tri (indispensable!), Réorganisation des colonnes, filtres à la volée (c'est-à-dire lors de la frappe). Utilisez des icônes au lieu de/avec du texte si possible, utilisez des couleurs. Fournissez l'option de sélection de colonne. Afficher uniquement les colonnes de base par défaut et afficher les données complètes dans un endroit fermé mais séparé uniquement lorsqu'un utilisateur clique sur une entrée.

1
Assimiz

Ne réinventez pas la roue, lisez ici à la place: http://www.welie.com/patterns/index.php

1
Özgür

Je me réfère souvent à Yahoo! Design Pattern Library pour les modèles d'interface utilisateur. Ce que j'aime, c'est qu'ils répondent à ces questions pertinentes pour chaque modèle.

  • Quel problème cela résout-il?
  • Quand utiliser ce modèle
  • Quelle est la solution?
  • Pourquoi utiliser ce modèle?
  • Cas spéciaux
  • Accessibilité

et je pense que ces questions doivent traverser l'esprit de chaque concepteur d'interface utilisateur chaque fois qu'ils choisissent un composant d'interface utilisateur.

Je trouve que la page d'exemples Sencha ExtJS est la meilleure compilation de ces types de composants.

En termes de comment les améliorer, c'est probablement beaucoup trop important pour un seul post. C'est un livre que vous demandez. Peut-être poser la question plus spécifiquement sur un seul composant?

1
Glen Lipka

Barres de défilement

Avantages:
  • Autoriser la navigation directe vers n'importe quel point d'un document/page
  • Autoriser les mouvements fins
  • Autoriser le défilement rapide d'un document/d'une page
  • Indiquez la longueur d'un document/d'une page
  • Le placement commun juste contre l'Edge facilite la convivialité selon loi de Fitt
Inconvénients:
  • Ne fonctionne pas si bien pour les très gros documents
  • Moins utile depuis l'avènement de la molette de défilement
  • Différentes implémentations peuvent créer de la confusion
Comment améliorer
Je considère la barre de défilement comme l'un des éléments d'interface utilisateur les plus utilisables: beaucoup de fonctionnalités, mais généralement bien comprises. Cependant, des problèmes surviennent si les barres de défilement sont implémentées de manière incohérente (par exemple, dans certaines applications flash). Peut-être qu'un élément visuel peut améliorer les barres de défilement - par exemple une combinaison de vignettes Acrobat avec la barre de défilement.
0
Bobby Jack