Pourquoi des écrans et des interfaces transparents ? Pour le spectacle et la contextualisation de l’information !

Pourquoi utiliser des écrans transparents ? Pourquoi créer des interfaces transparentes ? J’ai consacré de nombreux articles récents à expliquer que nous ressentions une fascination pour ce type d’écrans qui nous plongeaient dans certaines capacités fascinantes de maîtrise de notre environnement. J’aimerai compléter cette explication en identifiant aujourd’hui ce qui apparaît selon moi comme les deux grands bénéfices de ces écrans et interfaces en termes d’usage : l’aspect spectaculaire d’un côté et la contextualisation de l’information de l’autre.

Le premier point qui me paraît intéressant, c’est que les écrans transparents sont de formidables vecteurs de spectacle. Quelqu’un qui utilise un écran transparent, surtout quand il est tactile, c’est tout de suite un spectacle !

La parfaite illustration de cette caractéristique, c’est l’usage qu’en font les fabricants de tables de mixage de DJ.

Prenez la description de la console transparente QNQ sur son site internet :

QNQ est une console multitouch de 47 pouces qui modifie profondément la relation entre le DJ et son public. L’apparence visuelle époustouflante de QNQ attire le regard du public et permet au DJ de partager avec son audience l’expérience d ‘”être un DJ” . Elle crée un spectacle intime et interactif, où le public arrive à regarder et sentir tout ce que touche le DJ.

L’appareil peut également être un moyen amusant et interactif pour les marques de faire connaître leurs produits et de toucher directement un public engagé.

Le site QNQ possède d’ailleurs des photos qui restituent bien cette capacité de la console à créer une expérience spectaculaire. Sur l’une d’elle on peut d’ailleurs lire “Looks matter”.

La console tactile transparente QNQ

La console tactile transparente QNQ

La console en action :

Même argumentaire exalté sur le site de Smithson Martin à propos de leur console transparente Emulator Dual View Screen :

C’est l’expérience la plus révolutionnaire de ces 30 dernières années pour les artistes de scène ! DVS Emulator est le premier système de contrôle MIDI réellement multitouch qui permet à la foule, grâce à un écran tactile transparent géant, de voir exactement ce que fait l’artiste.

L’art du DJ intègre désormais les jeux de lumières des clubs, c’est un nouveau niveau de performance !

Emulator peut également être utilisé comme un pupitre multitouch ou un outil de présentation pour des réunions ou des conférences. Il rend les événements d’entreprise plus interactifs car le pupitre est transparent ce qui permet au public de voir à travers tout en regardant le présentateur. L’attention du public est accrue et les présentateurs se sentent soutenus par cette nouvelle technologie !

Je crois que ça se passe de commentaires !!! Par contre, si vous voulez des images, on en trouve sur le site de l’agence d’événementiel A-BLOK, qui organise des soirées avec ce type de matériel :

Vous trouverez une multitudes d’autres vidéos sur YouTube si vous le souhaitez.

Avec ces pupitres interactifs transarents, A-BLOK organise aussi des performances de digital live painting :

Là aussi, si ça vous intéresse, d’autres vidéos de digital live painting sont visionnables sur YouTube.

Enfin, elle propose également ce matériel pour des séminaires et conférences :

A-BLOK_Pupitre_Interactif_Ormes2-809x539

Le pupitre transparent utilisé lors d’une conférence

Une autre illustration flagrante du côté spectaculaire des écrans transparents, c’est la fameuse démo d’un dispositif multitouch par Jeff Han lors d’un TED talks en 2006. Le pupitre était transparent, ce qui accentuait l’aspect spectaculaire de la démo :

Passons maintenant des écrans aux interfaces transparentes. Même sans écran, ces dernières ont elles aussi des capacités surprenantes à créer du spectacle. L’une des meilleurs illustrations de cette caractéristique me paraît être la fameuse vidéo de Hans Rosling où il explique en 4mn le progrès des différents pays du monde au cours des 200 dernières années :

Dans cette vidéo, le dispositif de transparence (appelez ça réalité augmentée, motion design ou ce que vous voulez, peu importe…) n’apporte rien à l’information en soi. Hans Rosling aurait tout aussi bien pu faire la même démonstration avec un dispositif plus classique, comme il l’a fait par exemple lors d’un TED Talks. Par contre, cela donne une dimension éminemment spectaculaire à la vidéo et à la démonstration. Et je ne veux pas seulement parler de l’effet Whaouh que peut déclencher, la première fois qu’on le voit, ce qui peut apparaître ici comme une innovation et qu’on ne ressent plus quelque temps après. Je veux parler de la fascination que crée la superposition du speaker et des données, l’aspect lumineux des signes graphiques que l’on retrouve souvent dans les interfaces transparentes et finalement la danse que composent ensemble l’animation des données et les mouvements du speaker !

Pour être précis, je n’oublie pas que le succès de cette vidéo tient autant au fond qu’à la forme, c’est-à-dire à la performance de l’analyse des données et à leur explication aussi synthétique et pédagogique en 4 mn !

Quoi qu’il en soit, cette dimension spectaculaire des interfaces et des écrans transparents me semble être également une explication au succès de l’utilisation des (pseudo-)hologrammes dans les spectacles et les défilés de mode, dont j’ai déjà eu l’occasion de parler dans un précédent article.

Enfin, puisque j’en suis à évoquer des sujets que j’ai déjà abordés, cette capacité à créer du spectacle est également, selon moi, ce qui fait que les publicités et les films de science fiction raffolent autant des écrans et des interfaces transparentes. Certes, il y a la fascination pour la transparence en soi et ce qu’elle signifie, comme je l’ai déjà expliqué dans ces précédents articles, mais s’ajoute aussi à cela selon moi le côté spectaculaire des images ainsi créées, comme je l’ai d’ailleurs déjà souligné à la fin de ce même article. C’est particulièrement vrai selon moi dans le film Iron Man, notamment dans la scène où il manipule un plan de ville sur une interface hologrammique :

Dans cet extrait, comme pour la vidéo de Hans Rosling, on est fasciné par la danse que composent à l’écran les mouvements de l’interface et ceux de l’acteur, accentués par les mouvements de caméras. C’est une vraie chorégraphie des corps et des signes rendue possible par la transparence !

Voilà pour la capacité des écrans et interfaces transparentes à créer du spectacle.

L’autre point que je voulais aborder est leur capacité à contextualiser l’information.

Le premier exemple auquel je pense est la réalité augmentée. Son principe même repose sur la superposition des signes à une image de la réalité. Qu’on soit donc dans une transparence réelle ou simulée, la réalité augmentée n’est possible que par la transparence. Or, à quoi sert ici la transparence ? A superposer l’information à ce que l’on voit en un lieu donné et dans une direction donnée. Et dans cette situation, “ce que l’on voit en un lieu donné et dans une direction donnée” nous est donné par le contexte, nous le subissons, nous l’explorons, tandis que l’information nous est fournie par un appareil et un système d’information, qui disposent de caractéristiques qui mettent en relation cette information avec l’environnement réel, qui relient donc le virtuel au réel, le sémiotique au réel.

réalité_augmentée

La transparence est une caractéristique clé de la réalité augmentée

Dans le cas des réfrigérateurs à porte transparente dont j’ai déjà parlé, l’intérêt de la transparence est notamment de pouvoir mettre l’information en contexte avec ce qui se trouve à l’intérieur du réfrigérateur, comme on peut le voir sur cette vidéo :

Mais la transparence n’agit pas seulement dans la mise en relation de l’information issue d’un appareil avec l’environnement de cet appareil et de son utilisateur : elle peut aussi être utilisée pour contextualiser l’information au sein d’une interface, sur un même écran, comme l’explique cet article de Mashable, à propos de l’interface graphique d’iOS 7, le nouvel OS de l’iPhone :

Le nouveau design plat, qui abandonne la vieille esthétique skeuomorphique d’iOS, est une véritable merveille. Jony Ive s’est surpassé en créant des couches de conception translucides de telle sorte que lorsque votre clavier s’affiche à l’écran, vous pouvez toujours avoir une idée de ce qu’il y a en dessous

D’ailleurs, on peut lire le même argument sur le site d’Apple :

Des couches fonctionnelles distinctes contribuent à donner de la profondeur et à instaurer de l’ordre et de la hiérarchie. L’effet de transparence permet d’avoir une meilleure perception du contexte.

A défaut d’avoir encore le nouvel iOS sur votre iPhone, vous pouvez avoir un aperçu de ce que ça donne sur cette page d’Apple qui propose des animations de certaines fonctionnalités de l’OS.

Un aperçu d'iOS7

Un aperçu d’iOS7 où les couches inférieures apparaissent de manière floue à travers la couche supérieure

Plutôt que de transparence, il s’agit en fait d’un aspect translucide des différents calques : la transparence est très floutée. On voit cet aspect à l’oeuvre sur les menus du bas lors du défilement des contenus ou lors de l’affichage du clavier, par exemple pour l’app Messages.

Il existe également sur certaines apps des effets de transparence légèrement différents, voire inattendus, mais diablement intéressants. C’est le cas notamment de l’app Météo, qu’Apple a délibérément mise en avant dans sa communication autour du nouveau design de l’OS. Dans cette app, des animations se jouent en image de fond, sous les textes d’information, qui sont donc sur une couche totalement transparente en dehors de la présence graphique des signes.

Une animation est présente sur cette page du site d’Apple qui permet de visionner cet effet.

Les différents effets graphiques de l'app Météo d'iOS7

Les différents effets graphiques de l’app Météo d’iOS7

Ici, l’information n’est pas vraiment mise en contexte, elle est illustrée. Une image (un signe visuel cherchant à ressembler à une réalité tangible) s’ajoute à des signes linguistiques (textes) et iconiques (symboles graphiques liés par une ressemblance à ce qu’ils représentent). Cette illustration n’apporte aucune information supplémentaire, si ce n’est montrer ce qu’est de la pluie à quelqu’un qui n’en aurait jamais vu !! En fait, elle est totalement redondante par rapport au texte et aux symboles. Elle se contente juste d’ajouter de l’immersion à l’information.

Apple va cependant plus loin dans son interprétation de cette animation. Sur la même page que celle citée tout à l’heure on peut lire :

Les interactions sont dynamiques, les animations cinématographiques, et l’ensemble prend vie de façon inattendue, quoique parfaitement naturelle. Ouvrez, par exemple, l’app Météo et vous comprendrez tout de suite. La grêle s’abat sur le texte, tandis que la brume le recouvre partiellement. Les orages s’annoncent par des nuages et des éclairs. Maintenant, consulter la météo en ligne, c’est un peu comme regarder par la fenêtre. (c’est moi qui souligne) (source)

Cette dernière phrase mérite le détour : pour Apple, en proposant des animations en fond d’écran, l’app Météo permet de voir sur son écran ce que l’on peut voir au même moment autour de soi. C’est donc une sorte de transparence par métaphore ! “C’est un peu comme regarder par la fenêtre !”

Il est quand même étonnant, alors qu’Apple revendique l’abandon du skeuomorphisme dans iOS7, qu’il mette ainsi en avant dans une app du même OS des signes qui fonctionnent eux aussi par ressemblance avec la réalité matérielle. Chassez le naturel, il revient au galop !

Voilà en tous cas qui clôt cet article. Je terminerai juste en rappelant que dans un article récent, j’avais proposé une méthode d’analyse des plans des interfaces. Je trouve que le propos de la seconde partie de cet article sur la contextualisation de l’information par la transparence se prête particulièrement bien à une analyse par couches des interfaces concernées. J’aurai donc l’occasion d’y revenir dans de prochains articles. Alors à bientôt !

Publicités

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s