Livre augmenté

Grâce à Dominique Cunin j’ai pu, l’année passée, terminer un projet de livre papier couplé à de la réalité augmentée sur iPhone. Le récit était néanmoins très simple car il a été rédigé lors d’un workshop de 3 jours. Ce livre se contente de montrer les possibilités qu’offre cette technologie couplée à un livre.

Au lancement de la réalité augmentée, une caméra venait capturer un environnement et affichait le résultat augmenté sur un écran à côté. Une distance se créait alors et les projets perdaient souvent en crédibilité. En effet ce n’était pas vraiment une réalité augmentée mais plutôt une image d’une réalité, augmentée. Avec les écrans mobiles pourvus de caméras on s’approche d’une réalité augmentée à proprement parlé car la caméra est aussi l’écran, l’écran devient vraiment une fenêtre permettant de rajouter une couche à la réalité.
Je souhaite donc développer un projet de livre couplé à de la réalité augmentée plus réfléchis que le projet précédent.

(petite vidéo de présentation à venir)

– – – – – – – – – – – – – – – – –

Au début de la réalité augmenté, des marqueurs très particuliers graphiquement était utilisés.

hiro
Toujours en noir et blanc, des bordures noires épaisses puis une image au centre, un mot ou une suite de carrés blancs et noirs. La bordure noire permet de définir un plan dans l’espace et l’image au centre permet d’identifier le marqueur mais aussi de lui donner une orientation dans l’espace.

La technologie a ensuite évolué et permet d’utiliser des images en couleurs comme marqueur. Cela fonctionne d’autant mieux car même si l’image marqueur est partiellement masquée, l’augmentation fonctionne toujours. Chose impossible avec la technologie associée aux marqueurs précédents.

La réalité augmentée rend « possible la superposition d’un modèle virtuel 3D ou 2D à la perception que nous avons naturellement de la réalité et ceci en temps réel » selon wikipédia. Pour le moment cette superposition prend effet qu’à travers une image de la réalité mais dans certains cas cela fonctionne plutôt bien. Notamment dans les cas où la caméra est aussi un écran comme avec les smartphones ou les tablettes. Ces caméras/écrans deviennent des fenêtres virtuelles se calquant sur notre réalité.

J’essaye depuis depuis quelques mois de trouver un moyen intéressant d’utiliser cette technologie avec une édition papier.
Les premières idées vont naturellement vers l’envie de venir enrichir une page en venant projeter un nouveau contenu virtuel se calquant sur une page physique du livre et donnant l’illusion que la page du livre s’anime.

Je trouve ces deux propositions très belles graphiquement. Je reste toujours sceptique sur l’utilisation d’un écran dissocié de la caméra qui donne, selon moi, une distance entre le réel et l’augmentation. Je pense que l’illusion opère avec les caméras/écrans. Néanmoins cela reste assez contraignant de devoir tenir son mobile en face du marqueur pour avoir accès au contenu supplémentaire.

Le terme de réalité augmentée a aussi été utilisé pour « l’hyperlivre » sur « Le sens des choses » de Jacques Attali. Ce livre est issu d’un partenariat entre Orange et les éditions Robert Laffont en 2009.

Un QR Code permet d’augmenter un media en faisant le lien vers un contenu virtuel. Cette technologie est largement utilisée un peu partout aujourd’hui. On retrouve c’est QR Codes sur des affiches, des paquets de céréales, dans des magazines etc. Ce code est très pratique car il est normalisé et permet donc à toutes les personnes ayant un smartphone (ou du moins un appareil ayant un microprocesseur, un capteur photo et un écran) d’avoir accès à une multitude de service (naviguer vers un site internet, regarder une vidéo en ligne, déclencher un appel vers un numéro de téléphone ou envoyer un SMS, envoyer un email etc.). Le QR code ne servant ici uniquement de lien vers ces services. Néanmoins, graphiquement cela reste assez contraignant.

 

 

Comment conjuguer le meilleur de ces deux technologies dans une édition papier ?

Peut être en utilisant les images marqueurs, potentiellement invisibles , avec un soupçon de superposition aux pages physiques de l’édition et un accès vers des contenu ou des services numériques. Je pense faire un magazine papier classique avec des articles, des titrages, des images etc. Chaque partie du magazine sera un marqueur potentiel. Des balises discrètes orienteront le lecteur vers des contenus « augmentables » ou pas.

Possibilités d’interactions :

– l’utilisateur passe son smartphone sur une image, un play s’affiche alors sur son écran, mappé sur l’image. Si l’utilisateur appui sur le play une vidéo se lance en plein écran sur son smartphone (pas besoin de rester en face du marqueur). Une image peut donner accès à un diaporama, un son etc.

– l’utilisateur passe au dessus d’un article, il a la possibilité de la partager sur les réseaux sociaux, de le « liker », de le commenter etc.

 

– – – – – – – – – – – – – – – – –

 

La rubrique « sélection du web » du magazine étapes : numéro 210 est particulièrement adapté à ce projet. Les articles sont composés d’une ou deux images, d’un texte et d’un lien html. En passant un smartphone sur une double page, l’application viendrait mapper les différentes identités de chaque contenu « augmentable » sur eux même. Si l’utilisateur s’approche d’un contenu augmentable en particulier, l’application lance le média correspondant sans que l’utilisateur ai besoin de toucher l’écran.

Illustration en image :

Simulation-01

Simulation-02 Lorsque l’on passe sur une double page, l’application nappe les identités des contenus augmentables.

Simulation-03 (image à refaire) Si l’utilisateur s’attarde sur un média en particulier, le contenu multimédia se lance automatiquement. Ici l’utilisateur s’attarde sur un marqueur vidéo et une vidéo se lance en plein écran.

Simulation-06Les différents boutons du lecteur vidéo n’apparaissent à l’écran que si l’utilisateur touche l’écran.

Simulation-07
Un bouton pause apparait, ainsi qu’une timeline et un croix pour quitter la vidéo.

Simulation-08

Simulation-05 L’utilisateur vient ici s’attarder sur un diaporama.

Simulation-09 Il se lance alors automatiquement en plein écran avce une transition en fondu entre les images.

Simulation-10 Si l’utilisateur touche l’écran le diaporama se met en pause et les boutons play et quitter apparaissent. L’utilisateur peut faire défiler le diaporama en glissant son doigt sur l’écran.

Simulation-04 Ici il s’arrête sur un point qui symbolise l’article en entier et la possibilité de partager cette article.

Simulation-11 Il peut alors envoyer le lien de l’article au format html par mail, le partager sur facebook, le partager sur twitter et visiter le lien présent dans l’article sur safari mobile.