Si vous avez visité la page d'accueil d'iTutor ce mois-ci, vous avez peut-être remarqué quelque chose : elle ne ressemble plus à ce qu'elle était. L'indigo vif et le cyan ont disparu. À leur place, du papier chaud, une encre nette, et un trait d'émeraude assuré. Ce n'est pas un coup de peinture. C'est un nouveau langage de design, et il se propage.
Les refontes sont généralement annoncées à coups d'adjectifs. Nous préférons vous montrer les décisions concrètes, car le raisonnement est la partie intéressante. Aux côtés du nouveau Plan d'étude et du mode vocal, ceci est le troisième pilier de notre mise à jour de juillet.
Papier et Émeraude
Nous appelons ce nouveau système Papier et Émeraude. Le fond de chaque page adopte une teinte papier chaude plutôt qu'un blanc éclatant, parce que vous y passez des heures et que le papier repose davantage les yeux que l'éblouissement. C'est l'encre qui parle. Et il n'existe qu'une seule couleur d'accent, un vert émeraude, réservée à ce qui compte vraiment : l'action à entreprendre, la session à ouvrir, le mot en train d'être prononcé.
La typographie suit la même discipline. Une grotesque assurée pour les titres, un cheval de trait discret pour le texte courant, et une petite voix à chasse fixe pour les labels, horodatages et faits. Trois rôles, utilisés avec constance, pour que votre œil sache toujours quel type de contenu il est en train de lire.
Le surligneur raconte l'histoire
Tout langage de design a besoin d'un geste signature, et le nôtre est le surligneur. Sur la nouvelle page d'accueil, les notes manuscrites d'un étudiant reposent sur la page, un surligneur émeraude balaie une ligne, et cette ligne précise se détache et devient une flashcard, un quiz, une question d'examen, un plan d'étude. Au fil du défilement, la séquence se joue sur de vraies matières et de vraies écritures, y compris l'arabe, écrit de droite à gauche.
Nous ne l'avons pas choisi parce que c'est joli. C'est toute la promesse du produit dessinée en une image : iTutor travaille à partir de votre contenu. Les mots sur la flashcard sont les mots de votre page. Aucun autre motif testé ne le disait aussi honnêtement.
Moins de bruit, plus vite pour trouver les choses
L'ancien design était ludique, et nous l'aimions, mais il se faisait concurrence à lui-même. Cinq couleurs d'accent signifiaient cinq choses réclamant votre attention sur chaque écran. Le nouveau langage fait un échange simple : moins de voix, une hiérarchie plus claire. Des titres plus grands, plus calmes. Un seul bouton vert par écran, qui est de toute évidence la prochaine étape. Des labels de navigation plus courts, plus sobres.
Le bénéfice concret, c'est la vitesse. Pas la vitesse de chargement des pages (même si nous y tenons aussi), mais la vitesse à laquelle on trouve les choses : le bouton que vous cherchez est le vert, le label que vous scannez du regard est là où vous l'attendez, et rien de décoratif ne feint d'être important.
Où vous le verrez ensuite
La page d'accueil arbore déjà le nouveau langage aujourd'hui, y compris la grande section surligneur pilotée par le défilement, et elle s'adapte aux douze langues d'iTutor avec un support complet de l'écriture de droite à gauche. Le reste du site suit page par page, et ce blog a déjà commencé à s'habiller pour l'occasion : chaque visuel de cet article, et du reste de la série de juillet, est dessiné dans le style Papier et Émeraude.
Tout ce qu'il y a en dessous reste inchangé : vos matières, vos contenus, vos plans et votre progression sont exactement là où vous les avez laissés. Seuls les habits sont neufs.