Bienvenue dans une nouvelle ère. Celle où les barrières pour accéder à du contenu multimédia s’ouvrent jusqu’à disparaitre totalement. Ordinateur, mobile, tablette, TV, autant de moyens pour regarder nos programmes préférés. Autant de moyens qui modifient le comportement des téléspectateurs.

Nous sommes passé d’une TV câblée traditionnelle, avec un programme diffusé en temps-réel, des pauses pubs, et un guide de programme électronique (EPG) ; à une experience TV augmentée grâce à un contenu plus riche, plus pertinent et surtout rendu totalement accessible (e.g. le nouveau modèle de vidéo à la demande, VoD, considéré comme une fonctionnalité basique).

Avec les nouvelles télévisions connectées, la génération zapping est peu à peu balayée par des utilisateurs voulant désormais passer moins temps à “chercher » et plus de temps à “regarder”. Dorénavant, les téléspectateurs veulent accéder au contenu qu’ils souhaitent, à n’importe quel moment et à l’endroit où ils le souhaitent.

Si l’on compare avec les ordinateurs ou même les téléphones portables, designer une interface TV reste nouveau et requiert un certain nombre de points qu’il est fondamental de prendre en compte. Voici donc une liste non-exhaustive de quelques insights, en espérant que cela puisse vous aider dans vos projets à l’avenir.

Par définition, PC, qui signifie “Personal Computer”, implique une utilisation personnelle. Située en règle général dans une pièce commune tel que le salon, la TV est au contraire un objet partagé. Et comme “tout le monde” peut accéder à cet objet, l’interface et les applications qu’une TV contient se doivent d’être approprié pour chaque user. Que ce soit regarder un film, montrer un diaporama de photos ou bien même jouer à des jeux videos, l’experience TV est une experience sociale partagée.

Une expérience partagée, et ce bien souvent en famille. De fait, la question de la “vie privée” est à prendre en compte. Differents comptes utilisateurs, mot de passe, contrôle parental … Il est bon de savoir que de nombreuses familles ont recourt aux contrôles parental afin de réguler l’accès aux contenus pour leurs enfants.

Assis confortablement dans leur canapé, les téléspectateurs sont dans un état “passif” et “relaxé” en regardant la TV. De fait, simplicité est le maitre mot. La recherche de nouveau contenu doit être facile. Le nombre de choix, réduit. Le paramètre par défaut accessible directement en un clic. Le nombre d’écran réduit à son minimum.

Toutes les interactions sur une TV sont faites à l’aide d’une télécommande (ou d’une manette de jeu dans le cas échéant) ; un challenge si l’on compare cela aux site web et aux écrans tactiles. En règle générale, les boutons de contrôles utilisés sont :

 Dû à la croix-directionnelle, la navigation est limitée aux simples mouvements haut, bas, gauche & droite. La diagonale n’existe pas et il n’est pas possible de sauter les éléments. Vous naviguez de un en un. Le focus est transmis d’un objet à l’autre, l’autre étant l’objet le plus proche dans la direction indiquée. De faite, la navigation sur une TV peut demander un temps d’apprentissage plus long. Elle n’est pas aussi intuitive qu’un écran tactile et il faut s’assurer que chaque élément reste accessible. Les axes de direction sont donc à prendre en compte dans la navigation. C’est pourquoi il peut être recommandé de dédier une fonction spécifique à chacun de ces axes. Par exemple, l’axe vertical permettrait de naviguer rapidement entre des sections tandis que l’axe horizontal permettrait de naviguer en détail dans une section spécifique.

Avec la généralisation de l’Ultra HD sur le marché, les TV tendent à être de plus en plus grandes. Contrairement à nos smartphones, une TV se regarde à une distance moyenne de 2 à 3m. Compte tenu de ce paramètre, l’interface visuelle se doit d’être simple, claire et surtout peu dense en matière d’information. De plus, chaque éléments doit être suffisant grand pour être vu et lu.

Avec la généralisation de l’Ultra HD sur le marché, les TV tendent à être de plus en plus grandes. Contrairement à nos smartphones, une TV se regarde à une distance moyenne de 2 à 3m. Compte tenu de ce paramètre, l’interface visuelle se doit d’être simple, claire et surtout peu dense en matière d’information. De plus, chaque éléments doit être suffisant grand pour être vu et lu.

Bien que les téléviseur 4K soient largement mis en avant dans les lieux de vente, de nombreux foyers possèdent encore une “simple” TV HD. Pour optimiser le rendu, il est plus que conseillé de produire pour du 1080p au minimum (1920x1080px). De plus, il existe désormais certains nombres de pattern pour la TV, au même titre qu’il existe des patterns de navigation et de mise en page pour les mobile. Ainsi, la largeur d’un écran TV et la navigation restreinte aux D-Pad a vu favoriser l’utilisations de colonnes et de la carousels. Les maitres mots ici sont cohérence, espacement, lisibilité.

Le hover est au site web ce que le focus est à l’interface TV. Pour assurer que l’utilisateur se repère correctement dans l’interface, il est important d’indiquer visuellement quel élément est sélectionné à l’instant-T. Un bonne interface TV repose pour beaucoup sur une bonne utilisation du focus. En effet, comme les gens usent de leur TV depuis une certaine distance, il est primordial de s’assurer qu’ils savent toujours ou se situe l’élément en focus. Les utilisateurs utilisent la télécommande pour déplacer le focus d’un élément à un autre sur l’écran jusqu’à atteindre l’élément souhaité, s’arrête et presse “ok” pour accéder au contenu ou déclencher une action.

Un élément (texte bouton, images …) focus est un élément sélectionné qui diffère des autres éléments de l’interface de part son échelle, son ombre portée et/ou bien son opacité. Le focus doit être apparent. Aussi, n’hésitez à donner un feedback (audio-)visuel lors de la transition focus / non-focus d’un élément.

Comme précisé plus haut, une TV, contrairement à un smartphone, se regarde depuis une certaine distance. Les textes doivent être lisibles depuis l’autre bout de la pièce. La taille minimum recommandée est de 18px. Bien entendu, cela dépend aussi de la typographie employée et de son dessin (empattement ou non, linéales, oeil ouvert, capitales, …). Sans compter l’effet d’entrelacement des écrans, je ne peux que vous recommander de tester vos premiers essai sur écrans pour vous aider dans vos décisions.

Evitez aussi d’avoir de très long et large paragraphes. Cela serait trop fatiguant pour l’oeil de lire correctement. Enfin privilégiez un interlignage assez espacé.

Pour cette aspect, je ne rentrerais pas dans trop de détails techniques. Sachez simplement que le gamut de couleur d’une TV HD est plus limité que celui d’un écran d’ordinateur. Pour éviter toute mauvaise surprise, il vous faut travailler avec le profil couleur ICC “Rec 709” en 8-bit. Tester, tester et re-tester afin d’ajuster au mieux la couleur.

– Un écran TV possède généralement un contraste élevé ; les couleurs apparaissant plus saturées, lumineuses et vibrantes.

– Les couleurs froides (bleu, violet, gris) sont plus fidèles que les couleurs chaudes (rouge, orange)

– Un texte blanc sur fond noir est plus lisible qu’un texte noir sur fond blanc.

– Dégradé et flou gaussien peuvent avoir un rendu visuel catastrophique.

J’espère que ce guide vous sera utile. En attendant,