Cet écran arrive à une étape suivante du chantier. La navigation, elle, est en place : le rail, le repli mobile et le vocabulaire visuel sont posés une fois pour toute l'application.
Le vocabulaire visuel que partageront tous les écrans : les commandes, les champs, les filets, les états et le marqueur qui dit où l'on se trouve. Il est décidé une fois, ici, et ne se rediscute plus écran par écran.
Les commandes
Tout ce qui se commande porte l'anneau de focus au clavier : c'est le seul repère de qui navigue sans souris.
La saisie
Un champ ne porte aucun anneau de focus : c'est sa bordure qui change de teinte.
Les états, en un seul vocabulaire
Le même objet sert au statut d'un prospect, à l'état d'une étape, à l'état d'un livrable et à celui de la connexion LinkedIn. Le point ne porte jamais l'information seul : le texte à côté la porte aussi.
Le marqueur « vous êtes ici »
Un contour qui fait le tour, jamais un filet sur le côté gauche. Le rail l'emploie déjà, en vert clair parce que le vert forêt ne se voit pas sur l'encre.
Les trois états d'un écran
Chargement en cours.
Aucun élément à afficher
Un état vide dit ce qui manque, puis porte l'action qui démarre.
La connexion a échoué
Le réseau a coupé pendant le chargement. Rien n'est perdu : il suffit de réessayer.
Les trois se remplacent au même endroit, qui garde sa place : passer de l'un à l'autre ne déplace rien de ce qui suit. Ici, les deux actions ramènent au chargement, faute d'écran métier à ouvrir.