Refonte de l'interface : un seul langage pour tout le HUD

Une interface de jeu ne se dessine jamais d'un coup. Elle s'ajoute. Un panneau d'inventaire au premier mois, une fenêtre de craft au troisième, un traqueur de quêtes quand les quêtes arrivent. Chacun est correct le jour où il sort. Mis côte à côte deux ans plus tard, ils ne se ressemblent plus : le titre de l'un est en gras, celui du voisin en majuscules, un troisième n'en a pas. Les bordures ne font pas la même épaisseur. Aucun de ces écarts ne se remarque isolément, et l'ensemble donne pourtant l'impression d'un assemblage.

Nous avons repris toute l'interface pour lui donner une seule voix.

Trois fondations, et tout le reste en découle

Le travail visible tient à trois pièces techniques, écrites d'abord.

La première est typographique. Deux polices libres, une romaine à empattements pour les titres et une linéale humaniste pour tout ce qui se lit longtemps, avec une échelle de tailles nommée plutôt que des nombres posés au jugé dans chaque fichier. Un titre de fenêtre n'a plus à décider de sa taille : il demande le cran de l'échelle qui lui revient.

La deuxième est un peintre de dégradés. Les boutons, les barres et les ascenseurs ne sont plus des aplats mais des dégradés peints, découpés en 9-patch pour s'étirer sans se déformer. Une seule fonction les produit tous, donc un bouton d'un panneau récent et un bouton d'un vieux panneau sortent identiques.

La troisième est un cadre orné. Toutes les fenêtres partagent désormais la même bordure gravée, elle aussi en 9-patch, avec un repli sobre si la planche venait à manquer. C'est ce cadre qui fait que le dialogue d'un PNJ, la fiche d'un joueur et le panneau de quêtes appartiennent visiblement au même jeu, celui dont nous avions déjà donné le ton en refondant le Bourg de Valenya.

Le rond, cette difficulté

Deux éléments du HUD sont ronds, et c'est plus compliqué qu'il n'y paraît.

Le portrait du joueur montre le buste réel de votre personnage : son corps, sa tenue, ses cheveux, son équipement porté. Il est rendu dans une vue hors écran, découpé en cercle par un shader, puis serti dans un médaillon avec le niveau gravé en bas. Ce n'est pas une image figée choisie à la création : changez d'armure, le portrait change.

La minimap suit le même chemin, sertie sous une couronne gravée, avec la plaque du nom de zone posée dessous.

Ce sont ces deux pièces qui ont demandé le plus d'allers-retours. Un masque circulaire se cale au pixel près sur le rayon intérieur de son cadre : trop large, le buste déborde sur la gravure ; trop étroit, un anneau vide apparaît. Le chiffre juste, pour notre anneau, était 0,36 du rayon total. On ne le devine pas, on le mesure.

Les détails qu'on ne remarque qu'une fois corrigés

Le paper-doll d'équipement affichait le nom de l'emplacement en texte grisé dans les cases vides. « Tête », « Torse », « Main gauche ». Ça fonctionnait, et ça faisait fiche technique. Onze silhouettes plates remplacent ces libellés : un casque, un plastron, une botte. La case vide dit maintenant ce qu'elle attend sans avoir à l'écrire.

Les emplacements de la barre de sorts ont reçu un cadre acier et or par-dessus l'icône, et le rappel de raccourci est devenu une petite pastille au lieu d'un chiffre flottant. L'écran de mort, qui se contentait d'un fond noir, est devenu une vignette funèbre qui rappelle où vous allez réapparaître et vous laisse trois secondes.

Et le bouton d'ouverture du menu, longtemps posé sous la minimap au milieu des panneaux d'information, a rejoint la barre de boutons en bas à droite. Il y est séparé des autres par un écart, avec le panneau Compétences : ces deux-là n'ouvrent pas un contenu de jeu comme l'inventaire ou les quêtes. Son infobulle enseigne enfin le raccourci clavier, ce qu'elle ne faisait pas avant, alors que c'était précisément sa raison d'exister.

Ce qui a résisté

Deux choses ont refusé de coopérer, et les deux méritent d'être dites.

Les petites capitales de notre police de titres se déforment à l'affichage dans le moteur. Le rendu tordait les lettres au lieu de les réduire proprement. Nous avons basculé les titres de fenêtres en capitales pleines, ce qui donne d'ailleurs un résultat plus lisible aux petites tailles.

Et le portrait a été recadré trois fois. Le buste sortait trop bas, la tête flottait dans l'anneau, les épaules disparaissaient. Un cadrage de personnage ne se règle pas au calcul : il se règle en regardant, en corrigeant, en regardant encore.

La suite

L'interface n'est jamais finie, mais elle a maintenant une grammaire. Le prochain panneau que nous écrirons héritera du cadre, de l'échelle typographique et du peintre de dégradés sans que personne ait à y penser. C'était tout l'objet de l'exercice.

Le jeu n'a pas changé pendant ces journées. C'est le soin qu'on lui porte qui se voit.