Hyperhéro / supertexte

Le web est un élément central d’une révolution numérique qui a profondément transformé notre vie sociale, politique ou intellectuelle en reconfigurant notre relation à l’information et à la communication, brouillant les frontières entre émetteur et récepteur, auteur et public. Les designers y ont trouvé un espace d’action privilégié, en y expérimentant de nouvelles formes, défrichant des territoires en évolution constante, participant à la naissance de nouveaux usages, redéfinissant les modalités de la circulation des informations. De nouvelles écritures s’inventent dans ce creuset bouillonnant, où les expérimentations les plus improbables côtoient les pratiques professionnelles les plus précises.

L’axe écritures numériques développé dans le Pôle Nouveaux médias de l’ÉSAD Pyrénées aborde les questions de publication en ligne dans la spécificité de leur rapport à leur médium (hypertextualité, interactivité, non linéarité, dimensions multimédia ou transmédia…).

La notion d’écriture est à envisager sous son acception la plus globale, en tant que manière de produire un sens et d’en dessiner les formes à travers un geste. Au delà d’un système technique de représentation, la notion d’écriture en tant qu’action prend ici un sens similaire à ceux des champs chorégraphique ou cinématographique. Il s’agit d’appliquer cette notion au contexte spécifique du design et de la création dans le champs des médias numériques.

Cette introduction s’appuie sur le contexte culturel évoqué dans le projet Hypertext Superhéro et se propose de parcourir quelques précédents historiques et quelques approches contemporaines des écritures hypertextuelles.

Bifurcations contextuelles

La bibliothèque est illimitée et périodique. Si il y avait un voyageur éternel pour la traverser dans un sens quelconque, les siècles finiraient par lui apprendre que les mêmes volumes se répètent toujours, dans le même désordre qui répété deviendrait un ordre : l’Ordre. Ma solitude de se console à cette élégant espoir.¹

Le jardin aux sentiers qui bifurquent est une image incomplete, mais non fausse, de l'univers tel que le concevait Ts'ui Pên. A la différence de Newton et de Schopenhauer, votre ancêtre ne croyait pas à un temps uniforme, absolu. Il croyait à des séries infinies de temps, à un réseau croissant et vertigineux de temps divergents, convergents et parallèles². Cette trame de temps qui s'approchent, bifurquent, se coupent ou s'ignorent pendant des siècles, embrasse toutes les possibilités. Nous n’existons pas dans la majorité de ces temps ; dans quelques-uns vous existez et moi pas ; dans d'autres, moi, et pas vous ; dans d'autres, tous les deux. Dans celui-ci, que m'accorde un hasard favorable, vous êtes arrivé chez moi; dans un autre, en traversant le jardin, vous m'avez trouvé mort ; dans un autre, je dis ces mêmes paroles, mais je suis une erreur, un fantôme.

— Jorge-Luis Borges, Le jardin aux sentiers qui bifurquent, 1941

Hypertextualités, interactivité

Imaginons un appareil de l’avenir à usage individuel, une sorte de classeur et de bibliothèque personnels et mécaniques. […] Un memex, c’est un appareil dans lequel une personne stocke tous ses livres, ses archives et sa correspondance, et qui est mécanisé de façon à permettre la consultation à une vitesse énorme et avec une grande souplesse. Il s’agit d’un supplément agrandi et intime de sa mémoire.

— Vannevar Bush, « As we may think », 1945

Le memex est un ordinateur analogique fictif décrit par le scientifique Vannevar Bush dans l'article As We May Think publié en 1945 dans la revue The Atlantic Monthly. Le nom est la contraction de memory extender (« gonfleur de mémoire »). Dans son article³, Bush décrit un appareil électronique relié à une bibliothèque capable d'afficher des livres et de projeter des films. Cet outil est aussi capable de créer automatiquement des références entre les différents médias. Cette vision a directement influencé des pionniers de l'informatique moderne tels que Douglas Engelbart et a posé les fondations de l'hypertexte créé par Ted Nelson, à l'origine du World Wide Web.

— https://fr.wikipedia.org/wiki/Memex

Ingénieur états-unien, inventeur et pionnier de l'informatique, Douglas Engelbart est célèbre pour avoir inventé la souris, pour ses travaux sur le développement de l'interface homme-machine et pour avoir développé l’hypertexte, les réseaux informatiques et les premières interfaces graphiques (GUI). Dans sa Mother of All Demos, en 1968, il donne une visio-conférence dans laquelle il annonce et montre pour la première fois ce qui allait devenir le paradigme de nos ordinateurs contemporains : un système multimédia doté d’un clavier, d’une souris et d’une interface graphique à fenêtres, accessible et contrôlable à distance.

Theodor Nelson est un sociologue américain, pionnier de l'histoire des technologies de l'information. Il est considéré comme l'inventeur du terme hypertexte en 1965. Développant les hypothèses élaborées par Vanevar Bush ou Paul Otlet⁴, il imagina le projet Xanadu, système d'information permettant le partage instantané et universel de données informatiques. Ce système, jamais complètement développé, fut rattrapé et dépassé par le Web, mais en fut un précurseur et un inspirateur.

Écritures hypertextuelles

Les écritures hypertextuelles visent un dépassement des contraintes de la linéarité du texte écrit. Notions clés : non-linéarité, serendipité, bifurcations, fragments, liens, associations…

Nous désignerons par littérature numérique toute forme narrative poétique qui utilise le dispositif informatique comme médium et met en œuvre une ou plusieurs propriétés spécifiques à ce médium. — Philippe Bootz, Leonardo/Olats

Désordre, site écrit, conçu et réalisé par Philippe De Jonckheere⁵, « dans lequel la question des grandes théories de l'information ne sera pas abordée, pas davantage celle de savoir si la photographie est un art à part entière au même titre que la peinture. Il y est parfois question de sexe, de sodomie, de fellation, de gros seins, de pubis et autres joyeusetés, qui font beaucoup de bien aux statistiques du site que nous ne consultons jamais. En revanche nous sommes au regret de vous dire que pas plus que vous nous ne connaissons la recette de l'omelette norvégienne. Le moteur de recherche a un fonctionnement parfaitement erratique et ne vous aidera en rien, au contraire. »

L’attracteur de Lorenz est une structure fractale correspondant au comportement à long terme de l'oscillateur de Lorenz. L'attracteur montre comment les différentes variables du système dynamique évoluent dans le temps en une trajectoire non périodique⁶.

L' « effet papillon » est une expression qui résume une métaphore concernant le phénomène fondamental de sensibilité aux conditions initiales de la théorie du chaos. La formulation exacte qui en est à l'origine fut exprimée par Edward Lorenz lors d'une conférence scientifique en 1972, dont le titre était : « Le battement d'ailes d'un papillon au Brésil peut-il provoquer une tornade au Texas ?⁷ »

À sa façon, ce livre est plusieurs livres mais en particulier deux livres. Le lecteur est invité à choisir entre les deux possibilités suivantes : Le premier livre se lit comme se lisent les livres d'habitude et il finit au chapitre 56, là où trois jolies petites étoiles équivalent au mot fin. Après quoi, le lecteur peut laisser tomber sans remords ce qui suit. Le deuxième livre se lit en commençant au chapitre 73 et en continuant la lecture dans l'ordre indiqué à la fin de chaque chapitre. En cas d'incertitude ou d’oubli il suffira de consulter la liste ci-dessous. — Julio Cortazar, Marelle

Désirez-vous connaître l’histoire des trois alertes petits pois ?
– Raymond Queneau, Conte à votre façon

Écritures numériques

Fondateur d’UbuWeb, Kenneth Goldsmith expérimente, à la fois en tant qu’écrivain, enseignant, poète et artiste, les mutations imposées au texte par le numérique⁸.

« Recopiez-moi cinq pages »
« Theorize your digital existence. »
« Where technology leads, literature follows. »
« I used to be an artist ; then I became a poet ; then a writer. Now when asked, I simply refer to myself as a word processor. »
« A contemporary poet is someone who doesn’t write poems⁹. »

À propos de Théorie de Kenneth Goldsmith, écouter François Bon

Le webdocumentaire

Apparu au milieu des années 2000, le webdocumentaire s’est construit sur la volonté de journalistes et de producteurs audiovisuels de dépasser les formats traditionnels de la diffusion télévisuelle ou de la presse écrite pour investir le net en exploitant au mieux ses possibilités et ses caractéristiques.

La création de ces objets coïncidait également avec une période de crise des médias traditionnels – en particulier la presse écrite –, amenant naturellement des auteurs et journalistes à investir les nouveaux espaces de publication qu’ouvrait le web.

Dans les années 2000, la démocratisation de l’accès à internet a également fait émerger une possibilité de réponse à la convergence des médias (complémentarité, multi-écran).

Le web des années 2000/2005 (web 2.0) est également marqué par l’émergence de l’auteur individuel (blogs, youtube).

Quelques projets (La Cité des mortes, Voyage au bout du charbon, Gaza Sderot. La vie malgré tout ou Prison Valley. L’industrie de la prison ont acquis un statut d’œuvres pionnières sur lesquelles le regard rétrospectif est parfois délicat. Certains objets ont vieilli ; du fait de l’obsolescence technique (fin du support de Flash) mais aussi de par leurs approches expérimentales affirmées – et parfois hasardeuses du point de vue de l’expérience utilisateur ou de l’accessibilité.

Quelques sociétés de production ou chaines de télévision ont développé des approches singulières et ambitieuses dans ce champ : arte.tv, l’Office national du film du Canada, parmi les plus notables.

L’apparent déclin de ces formes expérimentales doit davantage être vu comme une accession du genre à la maturité. Les navigations mobiles, les expériences interactives plus circonscrites et tenant mieux compte des enjeux d’accessibilité, les nouvelles productions vidéo ou audio (web-séries, podcasts), ont suppplanté les projets audiovisuels flash, renouvelant les preuves que le web est un espace qui gagne en pertinence et en maturité, à la fois sur les plans techniques et formels.

Dans les médias

En 2012, Snow Fall fut un évènement marquant dans le paysage médiatique en ligne. Si les principes de narrattion et de storytelling multimédia étaient déjà à l’œuvre sur le web depuis longtemps, les grands médias traditionnels ne s’étaient pas encore appropriés ce type d’expérience de lecture.

Moins d'une semaine après sa publication en ligne, l'article, divisé en six chapitres et comprenant plus de 15 000 mots, des interviews vidéo, des graphiques interactifs et des animations 3D, a été consulté par plus de 3,5 millions de personnes. The Wire l'a qualifié de « moment charnière du journalisme¹⁰ ».

De nombreux exemples suivront les pas de Snow fall. Récemment, le dossier sur la mort de Twitter publié par The Verge ou les expériences narratives de pudding.cool.

→ accéder au pad

Références

Webdocs, vidéo et animation

• Sérotonine, un film d’animation interactif où une jeune fille diffuse son activité cérébrale en ligne.
• Do Not Track, voius êtes suivi⋅es, webdocumentaire de Brett Gaylor, upian + arte + ONF/NFB
• République, un film interactif sur mobile de Simon Bouisson
• Wei or die, un autre film interactif de Simon Bouisson
• Pour d’autres références, parcourir le panthéon personnel de Benjamin Hoguet.

Narration hypertextuelle

• Karrik – the Game, une narration non-linéaire éditée par Velvetyne Type Foundry
• Phallaina, une bande defilée (linéaire…)
• L’infiltré, de David Dufresne, un jeu/enquête de docu/fiction politique en temps réel
• The Wilderness downtown, un film interatif basé sur "We Used To Wait" du groupe Arcade Fire
• Un thread Twitter de @FibreTigre sur le “narrative design”, l’écriture à non linéaire et à choix multiples dans le champ du jeu (vidéo, de rôle, etc.)

Expérimentations hypertextuelles graphiques, artistiques et conceptuelles

• La librairie de Babel en vrai (ou presque).
• wwwwwwwww.jodi.org, le site de Jodi, pour une plongée en apnée visuelle et hypertextuelle
• My Boyfriend Came Back from the War, un projet de Net art d’Olia Lialina (1996)
• Déprise, un récit interactif de Serge Bouchardon et Vincent Volckaert, 2010
• Jusqu’ici, une déambulation interactive et poétique de Vincent Morrisset

Miscellanées, écritures numériques singulières

• Le Désordre ! Un projet d’écriture, de photographie, d’images et de sens mené par Philippe de Jonckherre.
• Magasin général, compagnon webdocumentaire du livre de David Dufresne, avec Antonin Lhôte + upian
• Les antilivres d’abrüpt
• otherti.me, un projet de Raphaël Bastide

Jeux — scène aternative & itch.io

• Fiction interactive, concours 2023.
• Everest Pipkin.
• A Desktop Love Story, jeu basé sur le système de fichiers de votre ordinateur, une histoire d’amour entre deux fichiers. Voir aussi Foldscape.
• A fine night, une fiction interactive racontée à l’intérieur de Twitter. Voir aussi @wnd_go, sur Twitter toujours, construit grâce à de multiples comptes.
• TimeTossed, un des nombreux jeux/fictions interactives de Popertine, construit à partir de formulaires Google
• Toujours de Popertine, Howling dogs à la structure narrative fractale (en anglais)
• Anxiety, un des nombreux jeux interactifs qu’on peut trouver sur itch.io

Écritures sociales

• Motto
• Otherly, un compte Instagram qui présente 7 documentaires courts sur des parcours de femme, personnes non-binaires et queer.
• Sur Twitter, une histoire dont tu es le héros/l'héroïne par Mårābøüt.
• 3ème droite, un thriller sur Twitter, par @F_descraques.
• 60 secondes, une série produite par Arte. 73 vidéos d’une minute diffusées sur Facebook en 2011, racontant la vie mouvementée de Fantille.

Critique, resources, festivals

• Benjamin Hoguet, invité en workshop à l’école en 2016 a publié sur son site quelques articles introductifs à ces questions, notamment Qu’est-ce que la narration interactive ?, Le mobile dans les nouvelles écritures, La richesse de la fiction interactive, etc. Abonnez-vous à sa newsletter !
• Le site Fiction-interactive.fr se consacre, sans surprise à la fiction interactive.
• Le Blog Documentaire
• MIT Open Doc Lab
• IDFA

Studios et boites de prod’

• Upian
• AATOA
• PixelHunt
• ONF / NFB
• arte.tv

Exemples

La section exemples du site propose de nombreux éléments liés aux logiques hypertextuelles et interactives. Si la plupart des propositions impliquent du code JavaScript, cela n’est pas du tout indispensable à la réalisation de ce projet.

• Un conte à votre façon réinterprète le texte à choix multiples de Raymond Queneau.
• Dialogue interactif à choix multiples est un exemple minimal basé sur une logique de choix multiples pour l’utilisateurs qui induisent le développement d’une branche (ou l’autre) d’un récit.
• Navigation javascript asynchrone offre la possibilité de changer d’écran sans changer de page, permettant notamment de ne pas couper un son, ou d’exécuter du javascript au chargement de la nouvelle page/écran.
• Navigation javascript est une version plus simple de l’hypothèse ci-dessus.
• Accumulation d’arrière-plans permet à une page de réagir aux choix successifs du visiteur en superposant des images d’arrière-plan.
• Image suivante au click, permet d’afficher un élément (présent dans la page mais masqué) quand l’utilisateur clique.
• Deux exemples de dialogue : un interactif (au clic) et l’autre automatique (sans clic) ; tous deux linéaires.
• Navigation aléatoire contrôlée par cookie permet de parcourir aléatoirement un ensemble de pages HTML sans jamais revisiter la même.

Outils

• Twine est un outil open-source pour raconter des histoires interactives et non linéaires. Voir les tutos vidéos produits par le studio Tourmaline.
• txti.es ou telegra.ph sont des espaces de publication anonyme en ligne sans inscription
• Tumblr, un des nombreux services qui permettent de publier textes, images, sons, vidéos “gratuitement” tout en maîtrisant complètement l’aspect visuel du site
• Ink, un langage de balisage pour créer des histoires interactives ou des jeux (principalement) textuels (un peu complexe…)
• Inklewriter, tout comme Ink, mais sans le code !
• Yarn Spinner permet d’écrire des dialogues pour des moteurs de jeu de type Unity ou Godot.
• Flicksy est un outil pour générer des jeux (lo-res) graphiques et hypertextuels.
• Ravel, ultra lo-tech html game engine.
• Moult autres outils sur fiction-interactive.fr et sur tinytools.directory…

Arborescences hypertextuelles

Onebook, many readings, une analyse sous la forme de visualisation de données de « livres dont vous êtes le héros » (Choose Your Own Adventure).

Extraits de Standard Patterns in Choice-Based Games