Les typos Uniwidth
Source image de couverture : dribbble
Lors de la conception d’une interface orientée utilisateur, le design occupe une place centrale dans la mesure où il affecte sa perception, son utilisation et l’éventuel parcours vers la conversion ou le passage à l’action. Le design inclut, entre autres, la typologie.
C’est dans ce sens que les typos Uniwidth jouent un rôle prépondérant dans la lisibilité et donc l’efficacité des messages véhiculés. Caractérisées par la proportionnalité de leur espacement, les polices de caractères Uniwidth permettent de résoudre des soucis liés au design et au développement d’une interface digitale.
Comprendre l’UI Design
Qu’est-ce que l’UI Design ?
UI, pour User Interface, ou interface utilisateur, désigne la représentation graphique d’une interface. Il s’agit des éléments sur lesquels l’utilisateur clique ou interagit, comme les textes, les images, les boutons, des champs de saisie, les curseurs…
L’UI, c’est aussi la disposition des animations, de l’écran, des transitions et de chaque micro-interaction disponible au niveau de l’interface.
L’UI Design est l’étape de conception de l’interface qui permet une éventuelle interaction avec les utilisateurs et contribue donc à améliorer l’UX Design. En effet, une interface homme-machine optimisée pour une expérience utilisateur agréable doit tenir en compte le design et le processus permettant d’élaborer un agencement adéquat du logo, des couleurs, des icônes, de la grille de mise en page et de la disposition des boutons de navigation…
C’est l’UI Designer qui se charge de choisir les couleurs, les formes de boutons, les polices des textes… ainsi que les autres détails graphiques qui incombent de l’apparence de l’interface. Il collabore avec l’UX Designer pour mettre en place une version graphique de l’interface qui soit optimisée pour une expérience utilisateur de qualité.
La conception du dispositif digital se fait en se basant sur ce qui se perçoit, notamment l’émotionnel, la dimension humaine de l’écran, l’esthétisme de l’interface… et ce qui optimise l’interaction avec les utilisateurs, comme les fonctionnalités disponibles, le parcours de navigation qui doit être intuitif, l’architecture de l’information…
La différence entre UI et UX Design
Lorsqu’on parle de conception d’un projet digital, l’UI et l’UX sont généralement confondus et mis dans le même panier. Toutefois, ces deux termes diffèrent de point de vue théorique et pratique. On parle d’UX pour désigner l’expérience utilisateur et de l’UI pour le design graphique. Il est important de distinguer ces disciplines pour comprendre le rôle de chaque professionnel, son intervention et les tâches qui lui sont attribuées dans le milieu de la conception d’une interface ergonomique.
Pour faire simple, si l’on compare l’UX à un iceberg, l’UI en serait la partie visible. En effet, l’UX mixe un travail perceptible (que l’on voit lorsqu’on utilise une interface) et un autre inapparent (le processus de conception qui contribue à l’expérience globale de l’utilisateur). L’UI est la partie apercevable qui appartient à ce processus de conception complet qu’est l’UX.
L’UX vs l’UI : deux disciplines différentes mais complémentaires
Malgré que l’UX soit le processus qui comprend l’UI, ces deux approches impliquent des compétences différentes. En effet, une interface esthétique, agréable et ayant un beau design n’induit pas forcément une navigation fluide et une expérience utilisateur optimale. De même, une expérience utilisateur peut être tout à fait gâchée à cause d’une conception qui manque de goût, ou avec des couleurs inappropriées et une typologie peu lisible.
L’UX et l’UI doivent être combinés pour contribuer au succès du projet digital. Des conceptions UX et UI doivent être réalisées en se basant sur les attentes des utilisateurs et les objectifs de la marque afin de créer une interface et une expérience utilisateur excellentes.
C’est pour cela que l’UI Designer doit collaborer étroitement avec l’UX Designer pour le succès du projet et afin de concevoir un dispositif digital qui garantit l’accès à l’information et le passage à l’action.
Typologie et UI Design
La conception UI doit répondre aux besoins des utilisateurs tout en renvoyant une image positive de la marque, ce qui requiert un travail de fond, de la créativité et une capacité technique en design graphique. Parmi les règles et les bonnes pratiques à apprendre lors de la conception de l’UI, une typologie cohérente et adaptée à l’image de l’entreprise.
La typologie est un aspect de taille lorsqu’on parle de design de l’interface. En effet, le choix d’une police de caractère peut impacter directement la manière dont le message est véhiculé et l’information est perçue. Une bonne typographie peut augmenter la qualité d’une interface, comme elle peut réduire son utilisabilité étant donné qu’elle affecte la lecture et la compréhension d’un texte.
Les polices Serif, cursives, monospace ou autre, chaque typo a sa propre personnalité. La typographie diffère selon les clients visés et le type de communication. Elle ne doit pas fatiguer les yeux mais susciter l’intérêt de l’utilisateur et permettre d’exprimer une valeur, comme le sérieux pour le Times New Roman, ou le modernisme à l’instar de Arial ou Helvetica.
Les éléments qui constituent une typologie sont :
- Les polices de caractères qui peuvent être de type empattement, sans empattement ou décoratif ;
- L’espace blanc qui se trouve autour des textes et des graphiques et qui doit être pensé pour garantir une interface épurée ;
- L’alignement qui désigne l’unification et la composition des textes pour un rendu dont les tailles et les distances sont égales ;
- La couleur qui permet d’accrocher l’utilisateur et de rendre le texte encore plus lisible ;
- La cohérence en se tenant à un même style de police pour aider les internautes à comprendre vos contenus ;
- La hiérarchie pour créer une distinction entre les textes ou les titres importants à retenir ;
- Le contraste qui aide à transmettre des idées ou des messages clés auprès des utilisateurs.
Les polices Uniwidth pour la conception d’interface
Qu’est-ce qu’une police Uniwidth ?
Le terme Uniwidth est utilisé dans un contexte d’interface utilisateur pour désigner les polices qui ont des espacements proportionnels et dont les largeurs de caractère sont cohérentes le long de l’axe de pondération.
Les polices Uniwidth sont aussi appelées « les polices égales », ou encore « duplex ». Leur classification peut se faire selon que la police soit à espacement fixe (ou police non proportionnelle). La police non proportionnelle est une police dont les lettres et les caractères occupent chacun la même quantité d’espace horizontal.
Pour mieux clarifier ces notions, sachez que les polices de caractères peuvent être divisés en deux catégories principales : les polices serif et sans serif, ou avec et sans empattement. L’empattement est la petite ligne, ou trait, fixée à la fin d’un trait plus grand au niveau d’une lettre ou d’un symbole.
Côté proportion, une police proportionnelle est celle contenant des glyphes de différentes largeurs. La police non proportionnelle, dite à largeur fixe ou à espacement fixe, utilise une seule largeur standard pour tous les glyphes de la police. Ces polices à largeur fixe peuvent faire référence aux polices monospaces dont les glyphes s’alignent dans des colonnes régulières, et les polices à double espacement avec des caractères pleine largeur et demi-largeur.
Les polices de caractères Uniwidth sont très utiles pour la conception UI. En effet, plusieurs personnes trouvent ces polices plus agréables et surtout faciles à lire. D’autant plus qu’elle permet d’aérer le texte et d’avoir un rendu visuel équilibré.
Pourquoi utiliser les polices Uniwidth ?
La typographie garantit une expérience optimale qui pousse l’utilisateur à une éventuelle conversion. Dès la première vue, cet utilisateur peut avoir une impression favorable de l’interface et même la numériser en raison de son design et de sa typologie. Des polices de caractères bien réfléchies créent une excellente première impression et garde l’utilisateur sur l’interface.
Une fois l’utilisateur attiré par le design et la cohérence de l’interface, l’objectif de l’UI Designer est de lui transmettre des informations qui optimisent son parcours, améliorent son expérience et guident son passage à l’action. Véhiculer ce message incombe d’une conception graphique qui opte pour des polices aidant à transmettre le message, au lieu de détourner l’attention de l’utilisateur.
Par ailleurs, lorsque vous disposez d’un contenu qui combine différents caractères, le poids du texte peut s’alourdir, ce qui met en cause sa lisibilité et son ergonomie. Avoir des caractères uniformes qui partagent la même largeur et offrent des lignes proportionnelles garantie une certaine visibilité. C’est pour cette raison que recourir à l’utilisation des polices Uniwidth propose une issue pour équilibrer les contenus et garantir une UI Design optimisée.
Les polices Uniwidth permettent une superposition artistique des caractères et solutionnent le problème lié à une police à espacement fixe, ou non proportionnelle, dont les caractères occupent la même largeur (une A majuscule a la même largeur qu’un w minuscule, par exemple).
En revanche, les polices Uniwidth sont des polices à espacement proportionnel, c’est-à-dire que pratiquement, peu importe le poids qui définit votre texte, sa longueur ne changera pas. Cela élimine toute redistribution du texte en question, étant donné que chaque caractère occupe le même espace.
Une collection de polices Uniwidth
Les polices Uniwidth permettent un contenu qui se fond avec les autres éléments de l’interface. Elles maintiennent la cohérence entre l’ensemble des polices, des boutons et des visuels, pour un rendu global harmonieux et agréable, sans pour autant ajouter des codes spécifiques lors du développement de l’interface.
A l’instar des autres polices de caractères, il existe un très grand nombre de polices Uniwidth qui peuvent être utilisées. Les polices Uniwidth sont variées et peuvent avoir des caractéristiques toutes aussi différentes.
Récursive
Recursive est une police variable disponible en version proportionnelle et mono. Le Recursive prend en charge un large éventail de langues latines, y compris le vietnamien. Il est également livré avec un ensemble étendu de devises, symboles, fractions et flèches.
PT Root UI
PT Root UI est une police de caractères sans empattement moderne et sans fioritures qui se décline en quatre poids (léger, régulier, moyen, gras). PT Root UI est spécialement conçu pour la lecture d’écran, les interfaces et les sites web. Il a un large support de langue, y compris le latin et le cyrillique. La police est également livrée avec des chiffres tabulaires, des signes monétaires, des fractions et des indices, ainsi qu’un certain nombre de flèches et de formes alternatives.
Golos UI
Golos UI est similaire à PT Root UI, mais dispose de proportions légèrement réduites. Il a un large support de langue, y compris le latin et le cyrillique. Pareil que le PT Root UI, le Golos UI propose différents chiffres tabulaires, des signes monétaires, des fractions et des indices, des flèches et des formes variées.
Angus
Angus est une police de caractère sans empattement. Moderne et disposant de bornes arrondies. Cette police a une esthétique distinctement monospace. Angus prend en charge le jeu de caractères latins et comprend des figures, des fractions et des indices de style ancien et tabulaire, des ligatures et des flèches.
Pochoir Halvar et Halvar complet
Halvar est un système de type massif, avec un total de 162 styles. Avec des proportions volumineuses et des formes construites, la police de caractère Halvar prend en charge plusieurs langues comme le latin, le grec et le cyrillique. Des figures tabulaires, des surlignements encerclés, des exposants, des fractions et des caractères alternatifs sont également disponibles.
Service Gothic
Service Gothic est une police de caractère Uniwidth variable. Encore en cours de développement, elle est disponible uniquement en majuscules.
Mot de la fin
En matière de conception d’interface UI, les typos Uniwidth offrent des polices de caractères interactives qui résolvent des problèmes de visibilité et de codage. Ces polices vous aident à véhiculer vos messages clés et à combiner les nuances pour réussir l’effet recherché. N’hésitez pas à exploiter les typos Uniwidth pour vos supports numériques pour privilégier des contenus dynamiques, aérés et attrayants.
by 
