Cette question est un peu plus subjective, mais j'espère avoir une nouvelle perspective. Je suis tellement habitué à concevoir pour une certaine taille d'écran (généralement 1024x768) que je trouve que cette taille n'est pas un problème. L'extension de la taille à 1280x1024 ne vous permet pas d'acheter suffisamment d'écran pour faire une différence appréciable, mais cela me donnera un peu plus de répit. Fondamentalement, je développe simplement ma "taille de grille" et le même design de base pour l'écran légèrement plus petit fonctionne toujours.
Cependant, dans les deux derniers projets, mes clients utilisaient tous des écrans 1080p (1920x1080) et ils voulaient des solutions pour utiliser autant de biens immobiliers que possible. La largeur de 1920 pixels offre un peu moins de deux fois la largeur à laquelle je suis habitué, et l'écran large fait que certaines de mes anciennes approches de conception ne fonctionnent pas aussi bien. Le problème que je rencontre est que lorsqu'on me présente tellement d'espace, je suis confronté à des problèmes majeurs.
- Combien de colonnes dois-je utiliser? Le format large se prête à une division de 3 colonnes avec une division de 2: 1: 1 (c'est-à-dire la colonne de contenu plus grande que les deux autres). Cependant, si je choisis trois colonnes, que dois-je faire avec cette colonne supplémentaire?
- Comment utiliser efficacement l'espace d'écran? Il y a une tentation de tout afficher à l'écran en même temps, mais trop d'informations rendent l'application plus difficile à utiliser. L'espace blanc est important pour donner un sens à des informations complexes, mais trop fait que les concepts connexes semblent trop séparés.
- Je travaille généralement avec des applications Web contenant des données complexes, et la visualisation et la présentation sont essentielles pour donner un sens aux données brutes. Lorsque votre utilisateur dispose également d'un grand écran (au moins 24 "), certaines informations sont hors de vue et vous devez déplacer le pointeur sur une longue distance. Comment vous assurer que tout ce qui est nécessaire reste dans les points chauds visuels?
- Les sites simples comme les blogs font mieux quand la largeur est limitée, ce qui entraîne beaucoup de gaspillage immobilier. Je me demande un peu si avoir la zone de texte et l'aperçu du texte côte à côte serait un gros avantage pour le côté administrateur de ce type d'écran? (Division à deux colonnes 1: 1).
Pour vos réponses, je sais que presque tout dans le design est "ça dépend". Ce que je recherche c'est:
- Principes généraux que vous utilisez
- Comment votre approche du design a changé
Je constate que je dois me recycler pour travailler avec ce format différent. Chaque bosse de résolution à laquelle j'ai travaillé jusqu'à présent a été d'environ 25%: 640 à 800 (augmentation de 25%), 800 à 1024 (augmentation de 28%) et 1024 à 1280 (augmentation de 25%). Cependant, le saut de 1280 à 1920 est une bonne augmentation de 50% de l'espace - l'équivalent d'un saut de 640 directement à 1024. Il n'y avait pas de taille moyenne couramment utilisée pour aider à apprendre les leçons plus progressivement.
Réponses:
C'est ainsi que j'aborderais cette question.
Je commencerais par découper mes données en blocs logiques. Je pourrais même aller jusqu'à créer un fichier ascx différent pour chaque bloc logique. Chaque bloc saurait comment il aime être affiché (largeurs min / max). Je ferais cela b / c, je n'aime pas réécrire le code et s'il y a une chance que l'application ait besoin d'être étendue pour prendre en charge plusieurs tailles de résolution, alors cela faciliterait la tâche, contrôle par contrôle.
Ensuite, je créerais une nouvelle feuille de style pour la plus grande résolution. Faites des boutons et un cap plus gros. Ajoutez plus d'espace blanc autour des éléments. De cette façon, le basculement entre les deux types de résolution est juste un changement de feuille de style.
Vient maintenant la partie difficile, la mise en page. Comme vous l'avez dit, la disposition sera très différente avec cette quantité de biens immobiliers. La réponse indirecte serait de permettre à l'utilisateur de placer les éléments où il le souhaite, comme une page iGoogle. L'utilisateur peut choisir 2 ou 3 colonnes comme bon lui semble. Comme je ne sais pas quels types d'écrans vous construisez, je ne sais pas si cela fonctionnerait vraiment pour vous.
La deuxième réponse indirecte serait d'engager un expert en interface utilisateur pour vous aider à concevoir ces pages. Ayant travaillé avec un spécialiste de l'interface utilisateur dans le passé, je peux dire que cela en vaut la peine à 100% d'avoir un avis d'expert sur des choses comme ça. Ils peuvent identifier les problèmes et suggérer des solutions avant même que le client ne voie le produit.
Si je devais le faire moi-même, je placerais des éléments fixes sur les côtés et ferais grandir la zone centrale pour remplir le reste de l'espace. Ayez des données qui peuvent croître remplir la section du milieu.
Je ne sais pas à quel point cela vous est utile, mais j'espère que cela vous donnera quelques idées.
la source
Je dirais que si vous ne pouvez pas utiliser l'espace supplémentaire en ajoutant plus d'informations / contrôles, je dirais que le contenu existant et le contrôle sont plus grands .
Pourquoi? Parce que selon la loi de Fitt, les choses plus grandes sont plus faciles à utiliser .
Peut-être aussi demander sur https://ux.stackexchange.com/ ou https://graphicdesign.stackexchange.com/
la source
Je ne suis pas un expert de l'interface utilisateur, mais j'utilise un écran 1920x1080 tous les jours avec Eclipse. Eclipse a une interface très facilement configurable, et voici certaines de mes observations lors du basculement entre 1280 et 1920:
Parfois, je mets également des vues et des contrôleurs les uns à côté des autres en mode 2 colonnes, mais cela est définitivement spécifique au programmeur. :)
Sur un écran plus grand, je veux l'utiliser pour voir autant d'informations que possible, tout en étant facile à trouver. Plus d'espace autour des composants permet de différencier les collections d'informations. Les icônes sur les onglets sont un moyen d'attirer l'attention sur la signification de chaque composant.
la source