Métaphore de l'interface utilisateur ou exemples de sélection de préréglages de configuration
Quelle est une bonne métaphore de l'interface utilisateur pour sélectionner parmi un ensemble d'options de configuration?
L'outil pour lequel je conçois possède près de 200 (!) Entrées qui peuvent être définies en fonction de votre application et de vos besoins particuliers. Vous pouvez penser à l'application comme une fonction unique avec 200 paramètres d'entrée.
Nous savons qu'il existe ~ 10 ensembles de paramètres communs, nous voulons donc donner aux utilisateurs un moyen de choisir rapidement l'un des paramètres préconfigurés en fonction de leurs besoins. Mais bien sûr, vous avez la possibilité de faire les ajustements nécessaires.
L'analogie ou la métaphore la plus proche à laquelle je peux penser est comme les réglages d'égalisation preseq sur votre récepteur stéréo. Vous choisissez l'un des préréglages (classique, rock, pop, etc.), puis vous avez la possibilité de modifier n'importe quelle barre individuelle à votre convenance.
- Pouvez-vous penser à des outils logiciels qui font quelque chose comme ça?
- Comment puis-je donner à l'utilisateur une idée des paramètres modifiés/mis à jour lorsqu'il modifie le préréglage?
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Si vous faites une brève animation de "mise en évidence" sur les éléments à droite à droite lorsqu'ils changent. Les utilisateurs pourront rapidement et facilement voir comment les préréglages de gauche manipulent les options complexes de droite.
Lorsqu'un nouveau préréglage est vérifié: les paramètres qui sont désélectionnés "décocher" et deviennent rouges, une courte pause, puis ils retombent à leur emplacement d'origine dans la liste. Le rouge s'estompe. Les paramètres nouvellement vérifiés deviennent verts et apparaissent en haut de la liste APRÈS la disparition des éléments rouges. Le vert s'estompe. Les éléments inchangés sont inchangés.
De toute évidence, mes noms sont des espaces réservés. Cela aurait beaucoup plus de sens, avec de vrais noms de préréglages explicatifs et de vrais paramètres.
Problème intéressant.
Vous pouvez placer le menu des préréglages horizontalement en haut de l'écran. Une liste déroulante est également une option si vous voyez que vous avez beaucoup de préréglages, mais la comparaison des préréglages deviendra très ennuyeuse, car vous devez ouvrir la liste déroulante et localiser votre élément à chaque fois.
Divisez vos 200 articles en catégories. Avec un si grand nombre d'éléments dans la même application, je suis sûr qu'une catégorisation significative doit être possible. Affichez-les groupés par catégorie, de cette façon cette quantité d'informations est beaucoup plus facile à digérer. 10 groupes de 20 sont beaucoup plus faciles à manipuler que 200 articles. Si tout le reste échoue, même un regroupement alphabétique "vide de sens" est préférable à aucun regroupement.
Lorsque vous passez d'un préréglage à un préréglage, les deux affichent les nouvelles valeurs des éléments et mettent en surbrillance les éléments modifiés afin que vos utilisateurs puissent localiser facilement les modifications. Je l'ai fait avec une police en gras, mais ce qui devrait être utilisé est la couleur d'arrière-plan ou peut-être quelque chose de plus fort. Si vous voulez aller plus loin, vous pouvez également fournir cette indication sur le titre de la catégorie, de cette façon, les utilisateurs peuvent rapidement identifier les catégories à inspecter de plus près.
Faites corriger la liste des préréglages afin qu'elle ne disparaisse pas lorsque les utilisateurs défilent vers le bas dans les catégories inférieures.
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
