Lou Victoria Alice Delyo

Histoire dont on est le héros. Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire. Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé. Plusieurs histoires, pas toutes le même style. Afficher à la fin de l’histoire, les personnes qui ont choisi les fragments + les auteur.ices + une entrée où la personne qui a joué au jeu peut mettre son prénom. Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ? Typos, couleurs, différentes selon les fragments et les réponses ? Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? Essai, manifeste, journal, encyclopédie, corpus de textes. Ça peut venir en faisant des expériences. Problème : peut très vite épuiser le chemin, car un fragment a plusieurs réponses mais les réponses elles-mêmes n’ont pas forcément de réponses. —> nécessité de mettre plus de fragments dans le pad.

Avancée

Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.

Voici une première idée graphique de la page web, faite sur illustrator.

• 

  Template 1

• 

  Template 2

• 

  Template 3

• 

  Template 4

• 

  Template 5

• 

  Template 6

• 

  Template 7

• 

  Template 8

D'autres tests réalisés sur illustrator pour la page web.

• 

  Ensemble des tests

• 

  Tests 1

• 

  Tests 2

• 

  Tests 3

• 

  Tests 4

• 

  Tests 5

• 

  Tests 6

• 

  Tests 7

• 

  Tests 8

Voici quelques tests de mise en page en CSS.

• 

  Test1 de mise en page

• 

  Test2 de mise en page

• 

  Test3 de mise en page

• 

  Test4 de mise en page

• 

  Test5 de mise en page

Images

Nous avons choisi d'associer à chaque fragment une image spécifique. De cette façon, l'utilisateur·ice parcourt les fragments un par un sans conaître le contenu textuel des réponses. L'association seule de l'image peut rendre le "voyage" plus imprévu. Tout comme l'écriture de ces fragments dans le pad, leur lecture est aussi un cadavre exquis, et donc la formation de nouveaux sens donné au texte une fois réuni. Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient prélever un mot dans le fragment qu'on vient ensuite illustrer.

Images manquantes

Comme il est possible de rajouter des fragments et que nous ne pouvons pas dessiner en continu des images, il existe des fragments qui n'ont pas d'images. Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = le fichier .htaccess On place ce fichier dans le dossier de travail, lui même dans le dossier html du serveur Apache. On procède à une réécriture d'URL : les quelques lignes qu'on y écrit disent que si le chemin d'une image est manquant, on le remplace par un autre chemin. On effectue donc une redirection.

RewriteEngine On
RewriteCond %{REQUEST_URI} \.(jpg|jpeg|gif|png|ico)$ [NC]
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteRule ^(.*)$ /work/erg/2023-2024/cadavre-exquis/victoria-delyo-lou-alice/img/0001.png [R]

Si ça marche pas, cela peut provenir du fichier de configuration du serveur Apache (situé dans /etc/apache2/sites-available/000-default.conf), il faut vérifier que les lignes suivantes sont bien inscrites (dans le cas de l'utilisation d'un lien symbolique notamment) :

<Directory /var/www/html>
Options +Indexes +FollowSymLinks +MultiViews
AllowOverride All
Require all granted
</Directory>

Alice a fait en sorte que le fond, au début d'une couleur claire et vive, s'assombrisse au fur et à mesure pour illustrer la progression.

Sources

Voici les sources d'où proviennent les photos utilisées par Lou : SOURCES :

• 0020 — Beaboss [1]
• 0063 — Medium [2]
• 0024 — Huffingtonpost [3]
• 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [4]
• 0030 — The Gothic Alice [5]
• 0025 — V&A [6]
• 0023 — Sacyr [7]
• 0064 — Discipulospr [8]
• 0050 — Lauren Eldridge-Murray - Alphabet Poster [9]
• 0052 — Les Noces de Cana: deux points de fuite [10]
• 0002 — Just-Like-Neon [11]
• 0034 — Demotivateur [12]
• 0039 — ferroviaire blog [13]
• 0051 — Pxhere [14]
• 0077 — L’Express [15]
• 0059 — Carte du Monde [16]
• 0066 — Réseau des CCTT [17]
• 0058 — Freshmorningquotes [18]
• 0016 — Décryptages [19]

(web to) Print

La forme de l'édition imprimée générée est de 105 x 297 mm. Ceci permet d'imprimer et relier facilement chez soi. En plus, c'est un format plus rare (donc qui ressortirait du lot dans une rangée d'éditions). A l'impression, un fragment apparaît par page, avec son image associée.

Dans le colophon de la dernière page, on mentionne toustes les étudiant.e.s et enseignant.e.s de l'atelier comme colaborateurs, en y ajoutant les auteurs des textes dont sont extraits les fragments.

Code

Le saut de fragment en fragment se fait par un référencement des numéros identifiants. On évite de charger le contenu des réponses à un fragment. Une fois une image cliquée, on va chercher à quel ID elle est associée, on vide le conteneur 'main' et on remplace ses contenus par ceux trouvés grâce à l'ID. Ces derniers sont tous disponibles dans un grand tableau, dont la notation est faite comme celle d'un objet JS. Ceci facilite l'accès aux données.

Au long de la progression à travers les fragments, on compose une deuxième variable, un tableau qui reprend directement l'entièreté des données des fragments par lesquels on passe. Cet 'historique' est à l'origine du contenu qui sera ensuite pris en charge par Paged.JS.