Développement d'interfaces. Conception d'interface utilisateur graphique

Table des matières:

Développement d'interfaces. Conception d'interface utilisateur graphique
Développement d'interfaces. Conception d'interface utilisateur graphique
Anonim

Concevoir est une opportunité en peu de temps avec un ensemble minimum d'outils pour découvrir l'efficacité de telle ou telle solution, ou la capacité de la trouver. Il vous permet de comprendre si le bon produit est créé, s'il sera utile aux clients et comment l'améliorer. Mais derrière toute conception, il devrait y avoir des analyses et une conception.

Où commence le design

La conception d'une interface utilisateur commence par la question de savoir à quoi elle sert et qui la gérera. Un bon designer jette toujours un regard critique sur la réalité qui l'entoure et fait quelque chose non seulement pour le processus, mais de manière réfléchie, pour une raison quelconque. Une conception d'interface appropriée est le processus de recherche de solutions aux problèmes des utilisateurs. Leur expérience d'interaction (UX) influence la décision d'acheter ou d'effectuer une autre action de conversion et peut leur faire abandonner même un produit de haute qualité. L'interface résout également les problèmes commerciaux, car c'est pratique pour euxprofiter des clients, dépend du profit de l'entreprise.

développement d'interfaces gérées
développement d'interfaces gérées

Pyramide des besoins produits

Le designer Maxim Desytykh a proposé un modèle des composants importants de tout produit, quel que soit son destinataire. Il l'a appelée la "pyramide des besoins en produits". Il peut être utilisé dans le développement de l'interface utilisateur. Au cœur de ce modèle, le critère d'évaluation le plus important est la performance. Si un produit ne fonctionne pas, aussi attrayant soit-il, il ne réussira pas.

Sur la deuxième marche de la pyramide se trouve l'opportunisme. Si le produit fonctionne, il doit être utilisé pour quelque chose et résoudre les problèmes des utilisateurs et de l'entreprise, en plus d'être fonctionnel. Autrement dit, si des produits similaires sur le marché ont certaines fonctions, mais pas celui en cours de développement, il deviendra non rentable. La prochaine étape dans la pyramide des besoins en produits est la productivité, la rapidité par rapport aux concurrents. S'il est inférieur à celui des concurrents, le produit sera moins volontiers utilisé. Au sommet se trouve l'esthétique, car un site Web ou une application attrayant mais non fonctionnel n'intéressera pas le consommateur.

interface graphique
interface graphique

User Stories et Scénarios

Lors du développement d'interfaces graphiques, les concepts de user story et de scénario utilisateur sont utilisés. Le premier terme fait référence à une manière de décrire les exigences d'un produit conçu sous la forme de plusieurs phrases. La seconde est une description détaillée des comportements possiblesl'utilisateur lors de l'interaction avec l'interface. Ils sont nécessaires pour créer le bon produit. Par exemple, lors de la conception d'un formulaire sur un site Web, le concepteur doit comprendre combien de champs il devrait avoir, ce qui sera suffisant et ce qui sera redondant. C'est à cela que sert un script personnalisé. Un exemple d'une bonne option consiste en quelques lignes avec une description détaillée des actions attendues de l'utilisateur et des diverses réactions des éléments d'interface à celles-ci. Mais il est important de garder à l'esprit qu'il ne sera pas possible d'écrire tous les scripts utilisateur avant le lancement du produit.

développement d'interfaces de programmation
développement d'interfaces de programmation

Développer une interface managée

La possibilité de modifier indépendamment l'interface selon les besoins de l'utilisateur existe dans les produits de la société "1C". Par exemple, dans le système 1C:Enterprise 8.2, à l'aide des outils de développement intégrés, l'administrateur peut programmer des formulaires, optimiser l'interaction entre les parties client et serveur et affiner la plate-forme. Les solutions d'application sont disponibles non seulement dans le réseau local, mais également via Internet, si des canaux de communication à faible vitesse sont utilisés.

Le développement de l'interface en 1C s'effectue à l'aide d'un langage intégré, grâce auquel l'utilisateur peut reconstruire dynamiquement ses parties et créer ses propres algorithmes de traitement des données. La structure est définie par un ensemble de commandes disposées dans une certaine séquence. Le système n'a aucune restriction sur le nombre de niveaux d'imbrication. Dans le processus de développement d'une interface dans 1C 8.3, il existe un mécanisme de configuration du programme en fonction des droits d'accès de l'utilisateur etaffiliations d'équipe. L'administrateur peut configurer les droits des utilisateurs et la visibilité de certains éléments pour différents groupes, et l'utilisateur lui-même a accès à des paramètres supplémentaires avec l'autorisation de l'administrateur.

Psychophysiologie de la perception des interfaces

Dans le processus de conception et de développement d'interfaces, il est important de bien comprendre la psychophysiologie de la perception humaine. La qualité du futur produit dépend de cette connaissance. Actuellement, la soi-disant théorie de l'énergie gagne en popularité, selon laquelle le cerveau cherche à économiser autant que possible ses propres ressources. Il se nourrit de glucides hautement raffinés, préparés de manière spéciale. Seuls ces glucides peuvent pénétrer dans le cerveau et le nourrir. Cette ressource est très chère et précieuse, donc l'énergie ne doit pas être gaspillée. Lorsqu'il y a une opportunité de ne pas activer certains neurones, le cerveau essaie de ne pas le faire. Par conséquent, dans le processus de résolution du problème, la solution la moins énergivore est trouvée. Si le cerveau y fait face avec succès, l'hormone de la satisfaction - la dopamine - est libérée. Ceci est important à prendre en compte lors de la conception d'interfaces.

développement d'interface utilisateur
développement d'interface utilisateur

Numéros magiques 7±2 et 4±1

Dans les années 1920, le psychologue George Miller a mené une expérience dans les laboratoires Bell dans laquelle des groupes de personnes ont résolu certains problèmes en utilisant un nombre différent d'objets. En conséquence, il s'est avéré que moins d'objets sont utilisés, plus la tâche est résolue efficacement. Après avoir examiné les résultats de l'étude, MillerIl en a déduit la règle selon laquelle 7 ± 2 objets est le nombre maximum que la mémoire à court terme d'une personne peut contenir. Le cerveau commence à éviter les grands nombres pour économiser les ressources. Il n'y a pas si longtemps, une nouvelle étude est apparue, qui dit qu'il ne devrait pas y avoir 7±2, mais 4±1 objets.

La différence dans la façon dont le cerveau traite les objets

Mais il y a une différence dans la vitesse de traitement des informations lorsque vous travaillez avec différents objets. Les plus simples sont traités plus rapidement que les plus complexes. Les problèmes avec les nombres sont résolus plus rapidement. En deuxième position en termes de vitesse de traitement, on trouve les couleurs, en troisième place les lettres, en quatrième place les formes géométriques. Beaucoup dépend aussi de la motivation. Si le résultat en vaut la peine, le cerveau est plus disposé à relever le défi. Si la règle 7±2 n'est pas respectée lors du processus de développement de l'interface, l'utilisateur est perdu dans l'abondance d'éléments et ne sait pas quelles actions effectuer en premier. Il peut refuser de résoudre une tâche trop difficile et quitter le site ou l'application.

Développement d'interfaces 1s
Développement d'interfaces 1s

Importance d'appliquer la règle 4±1

L'utilisateur doit résoudre de nombreux problèmes dans la vie quotidienne, donc l'interface du programme ou du site ne devrait pas lui causer de difficultés. Tout doit être construit de manière prévisible, logique et simple. Lors du développement d'interfaces logicielles, il est nécessaire de prendre en compte la ressource du cerveau humain et de ne pas le forcer à gaspiller de l'énergie sur des actions inutiles. Une architecture et une taxonomie appropriées de l'information, lorsque les éléments de menu sont regroupés de manière compréhensible, aident l'utilisateur à naviguer et à trouver ce qu'il recherche.

Le développeur a besoindéfinissez des tâches pour lui, pour la solution desquelles il suffit d'opérer avec un petit nombre d'objets, après quoi vous pouvez passer à autre chose. Lorsque l'utilisateur regarde la page, il sélectionne environ 5 objets avec lesquels il interagit ensuite. Parmi ceux-ci, il choisit celui qui le conduira rapidement au but. Travaillant avec l'objet, il résout le problème et passe à autre chose. En conséquence, son énergie sera économisée, le problème résolu et l'utilisateur sera satisfait, ayant reçu une expérience agréable d'interaction avec le produit. Par conséquent, l'application de la règle 4±1 améliore l'interface.

Développement d'interface graphique
Développement d'interface graphique

Utiliser la perception des couleurs et de la taille

La perception humaine possède plusieurs autres fonctionnalités importantes qui sont utilisées lors de la création d'interfaces. Par exemple, le principe de contraste vous permet de mettre en évidence des objets significatifs, les rendant plus clairs et plus lumineux. Le contraste de volume vous fait regarder un objet plus grand. Un gros bouton surligné en couleur attire l'attention plus rapidement qu'un petit bouton quelconque. Les boutons avec des actions indésirables, telles que la désinscription, sont conçus de manière opposée. Le flou d'arrière-plan derrière et la perspective aérienne sont utilisés pour indiquer l'important, ce qui vous permet de contrôler la mise au point de l'utilisateur et de prêter attention à un objet spécifique.

Les fonctionnalités de perception des couleurs sont également utilisées dans le développement d'interfaces de programmes et d'applications. Par exemple, le rouge pour une personne signifie un danger. Par conséquent, divers boutons d'avertissement et signes indiquant des actions qui ne peuvent pas être annulées sont colorés de cette façon. Couleur. Le jaune est utilisé pour attirer l'attention, le vert et l'orange sont associés à quelque chose de sûr et de naturel. Mais s'il y a un grand pourcentage d'utilisateurs d altoniens parmi les utilisateurs, les contrastes de couleurs doivent être utilisés avec prudence. Une façon de diriger l'œil vers un point spécifique consiste à ajouter une image d'un visage humain. Depuis l'enfance, les gens ont appris à reconnaître les visages et à y prêter attention, ils réagissent donc toujours à une telle image.

Image et texte

Dans le processus de lecture, plusieurs grandes zones du cerveau responsables de la reconnaissance sont activées, mais beaucoup moins d'efforts sont nécessaires pour percevoir l'image. Par conséquent, les développeurs d'interfaces essaient de remplacer le texte par des images ou des icônes. Les interfaces de développement d'applications sont souvent elles-mêmes constituées d'icônes et d'autres éléments visuels. La séquence souhaitée d'informations de lecture par les utilisateurs peut être définie à l'aide d'images correctement sélectionnées. Mais il y a un problème avec les pictogrammes - tout le monde ne peut pas déchiffrer correctement leur signification, sans processus d'apprentissage.

interfaces de développement d'applications
interfaces de développement d'applications

Par exemple, l'icône avec une disquette, qui signifie enregistrer les modifications, est toujours utilisée dans certains programmes, mais l'image d'un nuage ou d'un nuage avec une flèche est devenue plus courante. Ainsi, lors de la première itération du produit, de nouveaux pictogrammes doivent être signés, qui expliqueront à l'utilisateur quelle action les suivra. Ensuite, pour les utilisateurs qui n'ont pas appris à la première étape, une signature est ajoutée dans la nouvelle version du produit, mais dans une taille plus petite. Àproduit final, lorsque l'icône est devenue familière, la légende peut être supprimée. Ces icônes permettent d'économiser de l'espace et sont plus rapidement reconnues par les utilisateurs, ce qui est particulièrement important pour les applications mobiles et les sites Web réactifs.

Lisibilité du texte

Les règles de contraste sont importantes non seulement pour les éléments graphiques, mais aussi pour le contenu textuel. Par exemple, les lecteurs de livres ont un mode nuit spécial qui vous permet de rendre le fond noir et le texte blanc. Grâce à cela, dans l'éclairage du soir, les yeux sont moins fatigués par l'écran lumineux. Le même principe est utilisé par les programmeurs dans le processus d'écriture de code. Avec le codage couleur, l'œil reconnaît plus de nuances sur un fond sombre, en particulier le spectre rouge et violet. Une bonne typographie aide à économiser les ressources cérébrales et à lire le texte plus rapidement. Auparavant, on pensait que les gens lisaient mieux les polices avec empattement, mais selon de nouvelles recherches, les gens sont désormais plus susceptibles de lire une police familière, qu'elle soit avec empattement ou sans empattement.

Après avoir développé le concept, la conception et le prototypage, la dernière étape de la conception de l'interface est le test. Après avoir réussi les tests, le projet est lancé.

Conseillé: