https://designnumerique.be/w/api.php?action=feedcontributions&feedformat=atom&user=Lou 2026-05-24T04:00:59Z Contributions MediaWiki 1.44.2 https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4473 2023-12-20T22:29:46Z

<p>Lou : /* Avancée */</p> <hr /> <div>Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Illustrator1.png|Template 1<br /> Illustrator2.png|Template 2<br /> Illustrator3.png|Template 3<br /> Illustrator4.png|Template 4<br /> Illustrator5.png|Template 5<br /> Illustrator6.png|Template 6<br /> Illustrator7.png|Template 7<br /> Illustrator8.png|Template 8<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> testweb01.png|Ensemble des tests<br /> testweb2.png|Tests 1<br /> Testweb3.png|Tests 2<br /> Testweb4.png|Tests 3<br /> Testweb5.png|Tests 4<br /> Testweb6.png|Tests 5<br /> Testweb7.png|Tests 6<br /> Testweb8.png|Tests 7<br /> Testweb9.png|Tests 8<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 &quot;voyage&quot; 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.<br /> 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.<br /> <br /> ==== Images manquantes ====<br /> <br /> 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.<br /> 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<br /> On place ce fichier dans le dossier de travail, lui même dans le dossier html du serveur Apache.<br /> 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. <br /> <br /> &lt;pre&gt;RewriteEngine On<br /> RewriteCond %{REQUEST_URI} \.(jpg|jpeg|gif|png|ico)$ [NC]<br /> RewriteCond %{REQUEST_FILENAME} !-f <br /> RewriteRule ^(.*)$ /work/erg/2023-2024/cadavre-exquis/victoria-delyo-lou-alice/img/0001.png [R]&lt;/pre&gt;<br /> <br /> 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) : <br /> <br /> &lt;pre&gt;<br /> &lt;Directory /var/www/html&gt;<br /> Options +Indexes +FollowSymLinks +MultiViews<br /> AllowOverride All<br /> Require all granted<br /> &lt;/Directory&gt;<br /> &lt;/pre&gt;<br /> <br /> <br /> 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.<br /> <br /> ==== Sources ====<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb9.png&diff=4472 2023-12-20T22:29:41Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb8.png&diff=4471 2023-12-20T22:29:20Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb7.png&diff=4469 2023-12-20T22:28:56Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb6.png&diff=4467 2023-12-20T22:28:34Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4466 2023-12-20T22:27:09Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Illustrator1.png|Template 1<br /> Illustrator2.png|Template 2<br /> Illustrator3.png|Template 3<br /> Illustrator4.png|Template 4<br /> Illustrator5.png|Template 5<br /> Illustrator6.png|Template 6<br /> Illustrator7.png|Template 7<br /> Illustrator8.png|Template 8<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> testweb01.png|Ensemble des tests<br /> testweb2.png|Tests 1<br /> Testweb3.png|Tests 2<br /> Testweb4.png|Tests 3<br /> Testweb5.png|Tests 4<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 &quot;voyage&quot; 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.<br /> 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.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> 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 une sorte de redirection. <br /> <br /> &lt;pre&gt;RewriteEngine On<br /> RewriteCond %{REQUEST_URI} \.(jpg|jpeg|gif|png|ico)$ [NC]<br /> RewriteCond %{REQUEST_FILENAME} !-f <br /> RewriteRule ^(.*)$ /work/erg/2023-2024/cadavre-exquis/victoria-delyo-lou-alice/img/0001.png [R]&lt;/pre&gt;<br /> <br /> 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) : <br /> <br /> &lt;pre&gt;<br /> &lt;Directory /var/www/html&gt;<br /> Options +Indexes +FollowSymLinks +MultiViews<br /> AllowOverride All<br /> Require all granted<br /> &lt;/Directory&gt;<br /> &lt;/pre&gt;<br /> <br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb5.png&diff=4465 2023-12-20T22:27:03Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4463 2023-12-20T22:25:50Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Illustrator1.png|Template 1<br /> Illustrator2.png|Template 2<br /> Illustrator3.png|Template 3<br /> Illustrator4.png|Template 4<br /> Illustrator5.png|Template 5<br /> Illustrator6.png|Template 6<br /> Illustrator7.png|Template 7<br /> Illustrator8.png|Template 8<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> testweb01.png|Ensemble des tests<br /> testweb2.png|Tests 1<br /> Testweb3.png|Tests 2<br /> Testweb4.png|Tests 3<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb4.png&diff=4461 2023-12-20T22:24:17Z

<p>Lou : </p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb3.png&diff=4459 2023-12-20T22:23:23Z

<p>Lou : Test mise en page</p> <hr /> <div>== Description ==<br /> Test mise en page</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4457 2023-12-20T22:22:01Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Illustrator1.png|Template 1<br /> Illustrator2.png|Template 2<br /> Illustrator3.png|Template 3<br /> Illustrator4.png|Template 4<br /> Illustrator5.png|Template 5<br /> Illustrator6.png|Template 6<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> testweb01.png|Test mise en page web<br /> testweb2.png|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb01.png&diff=4456 2023-12-20T22:21:46Z

<p>Lou : Mise en page web</p> <hr /> <div>== Description ==<br /> Mise en page web</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4454 2023-12-20T22:20:13Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Template_1.png|Template 1<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> testweb2.png|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Fichier:Testweb2.png&diff=4453 2023-12-20T22:20:02Z

<p>Lou : Test de mise en page web</p> <hr /> <div>== Description ==<br /> Test de mise en page web</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4452 2023-12-20T22:19:02Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Template_1.png|Template 1<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> 01.png|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4451 2023-12-20T22:18:18Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Template_1.png|Template 1<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> TestWeb01.png|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4449 2023-12-20T22:17:54Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Template_1.png|Template 1<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> TestWeb01|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Lou_Victoria_Alice_Delyo&diff=4447 2023-12-20T22:17:32Z

<p>Lou : /* Avancée */</p> <hr /> <div><br /> &lt;/gallery&gt;<br /> Histoire dont on est le héros.<br /> Cliquer sur premier fragment, choisir les réponses, change le cursus de l’histoire.<br /> Fin de l’histoire, imprimer l’histoire, seule trace de notre histoire = papier imprimé.<br /> Plusieurs histoires, pas toutes le même style.<br /> 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.<br /> Mettre des pages vides à la fin pour laisser les gens écrire les derniers fragments ?<br /> Typos, couleurs, différentes selon les fragments et les réponses ? <br /> Faire un récit avec des extraits d’articles ne peut pas marcher, donc quelle forme donner à la publication ? <br /> Essai, manifeste, journal, encyclopédie, corpus de textes.<br /> Ça peut venir en faisant des expériences.<br /> 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. —&gt; nécessité de mettre plus de fragments dans le pad.<br /> <br /> == Avancée ==<br /> <br /> Au cours des derniers ateliers, nous avons fait des décisions sur la forme que prendra le dispositif.<br /> <br /> Voici une première idée graphique de la page web, faite sur illustrator.<br /> &lt;gallery&gt;<br /> Template_1.png|Template 1<br /> &lt;/gallery&gt;<br /> <br /> D'autres tests réalisés sur illustrator pour la page web.<br /> &lt;gallery&gt;<br /> TestWebO1|Test mise en page web<br /> Exemple.jpg|Description 2<br /> &lt;/gallery&gt;<br /> <br /> Voici quelques tests de mise en page en CSS.<br /> &lt;gallery&gt;<br /> Capture d’écran 2023-12-14 à 18.16.45.png|Test1 de mise en page<br /> Test_mise_en_page_2.png|Test2 de mise en page<br /> Test_mise_en_page_3.png|Test3 de mise en page<br /> Test_mise_en_page_4.png|Test4 de mise en page<br /> Test_mise_en_page_5.png|Test5 de mise en page<br /> &lt;/gallery&gt;<br /> <br /> <br /> <br /> === Images ===<br /> <br /> 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 connaître le contenu textuel des réponses. L'association seule de l'image peut rendre le &quot;voyage&quot; 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.<br /> Pour choisir ou dessiner une image, on se fixe un protocole où l'on vient choisir un mot dans le fragment qu'on vient ensuite illustrer.<br /> <br /> Lorsque une image est manquante, on la remplace par une autre image en écrivant un fichier de configuration du serveur HTTP Apache = .htaccess<br /> Les quelques lignes qu'on y écrit servent à dire que<br /> <br /> 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.<br /> <br /> === Sources ===<br /> <br /> Voici les sources d'où proviennent les photos utilisées par Lou :<br /> SOURCES :<br /> <br /> * 0020 — Beaboss [https://www.beaboss.fr/Thematique/marketing-vente-1027/marketing-2048/reseaux-sociaux-3157/Breves/Les-reseaux-sociaux-medias-ere-algorithmes-344712.htm]<br /> * 0063 — Medium [https://medium.com/be-decent/when-social-media-becomes-a-tool-of-social-oppression-is-big-tech-accountable-fc6f3039ec62]<br /> * 0024 — Huffingtonpost [https://www.huffingtonpost.co.uk/entry/how-to-self-hug_uk_5fe49681c5b6acb534573e63]<br /> * 0040 — Jerel Rowan Baker - llusion d'optique et perception en peinture [http://le-blog-de-mcbalson-palys.over-blog.com/2019/11/illusion-d-optique-et-perception-en-peinture-jerel-rowan-baker-8.html]<br /> * 0030 — The Gothic Alice [https://thegothicalice.tumblr.com/post/115664204495/whitnasty77-sweet-babies]<br /> * 0025 — V&amp;A [https://collections.vam.ac.uk/item/O339482/fragment/]<br /> * 0023 — Sacyr [https://www.sacyr.com/en/-/las-mujeres-que-cambiaron-la-historia-de-la-informatica]<br /> * 0064 — Discipulospr [https://www.discipulospr.org/el-senor-es-nuestro-refugio-en-la-adversidad/170120143757-finding-jesus-bg-2-full-169/]<br /> * 0050 — Lauren Eldridge-Murray - Alphabet Poster [https://laureneldridgemurray.blogspot.com/2010/07/alphabet-poster.html]<br /> * 0052 — Les Noces de Cana: deux points de fuite [http://depar-21121303.blogspot.com/2012/09/les-noces-de-cana-deux-points-de-fuite.html]<br /> * 0002 — Just-Like-Neon [https://just-like-neon.blogspot.com/2021/08/guy-with-computer-working-vector.html]<br /> * 0034 — Demotivateur [https://www.demotivateur.fr/article/pourquoi-les-loups-hurlent-ils-25488]<br /> * 0039 — ferroviaire blog [https://blog.ferrovial.com/en/2017/08/humans-vs-machines-revolution/]<br /> * 0051 — Pxhere [https://pxhere.com/fr/photo/1390537]<br /> * 0077 — L’Express [https://www.lexpress.fr/societe/manifestation-du-11-fevrier-a-quoi-sattendre-pour-la-journee-de-samedi-MKCNHOLEGFDIHA4E4EF5T45XMQ/]<br /> * 0059 — Carte du Monde [http://www.carte-du-monde.net/208-carte-du-monde-3d.html]<br /> * 0066 — Réseau des CCTT [https://reseaucctt.ca/actualites/methode-recherche-scientifique]<br /> * 0058 — Freshmorningquotes [https://www.freshmorningquotes.com/i-am-sorry-quotes/]<br /> * 0016 — Décryptages [https://www.decryptages.net/2019/01/20/au-fait-c-est-quoi-exactement-l-intelligence-artificielle/]<br /> <br /> === (web to) Print ===<br /> <br /> 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.<br /> <br /> 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.<br /> <br /> === Code ===<br /> <br /> 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.<br /> <br /> 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.</div>

Lou https://designnumerique.be/w/index.php?title=Lou&diff=4345 2023-10-19T14:38:54Z

<p>Lou : </p> <hr /> <div>Salut</div>

Lou https://designnumerique.be/w/index.php?title=Lou&diff=4343 2023-10-19T14:37:13Z

<p>Lou : Page blanchie</p> <hr /> <div></div>

Lou https://designnumerique.be/w/index.php?title=DESIGN_NUMERIQUE&diff=4342 2023-10-19T14:36:45Z

<p>Lou : /* Description générale du cours */</p> <hr /> <div>= Description générale du cours =<br /> <br /> L’orientation « Design numérique » propose d’explorer<br /> les modes de création graphiques et de diffusion en milieux numériques en apprivoisant les<br /> outils de production digitaux en « les pratiquant » ou autrement dit en « faisant avec ». Il vise<br /> à mettre l’accent sur les formes éditoriales (au sens large) qui se frottent aux outils<br /> numériques et aux media, ces formes de publications pouvant avoir plusieurs statuts, non<br /> seulement celui de flux digitaux, de formes stables imprimées ou d’hybrides, elles peuvent<br /> s’inscrire dans un espace virtuel, ou dans des espaces physiques.<br /> Pour ce faire, le cours propose entre autres de développer des pratiques favorisant le<br /> détournement, le hacking et la poésie, la magie et les recettes, et parfois la lenteur et la<br /> maladresse. Enfin, il propose d'analyser dans les entrailles des objets et système digitaux leur<br /> enjeux politiques, économiques, anthropologiques et historiques — autrement dit, des enjeux<br /> de design.<br /> <br /> [[Nathan|Nathan]]<br /> <br /> [[Lou|Lou]]<br /> <br /> [[Victoria|la page de Victoria]]<br /> <br /> [[Delyo|Delyo]]<br /> <br /> [[Lou Ârose Victoria Alice|Lâva]]<br /> <br /> [[Natalia Louka Mondher]]<br /> <br /> [[Llona|Llona]]<br /> <br /> [[Hélène]]<br /> <br /> [[Titouan]]<br /> <br /> [[Utilisateur:Leïa|Leïa]]</div>

Lou https://designnumerique.be/w/index.php?title=Victoria&diff=4313 2023-09-28T16:51:01Z

<p>Lou : </p> <hr /> <div>Yo B-)<br /> ˈTHaNGk ˌyo͞o<br /> <br /> https://fr.wikipedia.org/wiki/Cannibalisme_animal</div>

Lou https://designnumerique.be/w/index.php?title=Victoria&diff=4312 2023-09-28T16:50:42Z

<p>Lou : </p> <hr /> <div>Yo B-)<br /> ˈTHaNGk ˌyo͞o<br /> <br /> cannibalisme</div>

Lou https://designnumerique.be/w/index.php?title=Lou&diff=4304 2023-09-28T16:43:39Z

<p>Lou : </p> <hr /> <div>Salutationsd͡ʑɸ<br /> ɚ</div>

Lou https://designnumerique.be/w/index.php?title=Lou&diff=4297 2023-09-28T16:41:07Z

<p>Lou : Page créée avec « Salutations »</p> <hr /> <div>Salutations</div>

Lou https://designnumerique.be/w/index.php?title=DESIGN_NUMERIQUE&diff=4296 2023-09-28T16:40:43Z

<p>Lou : /* Description générale du cours */</p> <hr /> <div>= Description générale du cours =<br /> <br /> L’orientation « Design numérique » propose d’explorer<br /> les modes de création graphiques et de diffusion en milieux numériques en apprivoisant les<br /> outils de production digitaux en « les pratiquant » ou autrement dit en « faisant avec ». Il vise<br /> à mettre l’accent sur les formes éditoriales (au sens large) qui se frottent aux outils<br /> numériques et aux media, ces formes de publications pouvant avoir plusieurs statuts, non<br /> seulement celui de flux digitaux, de formes stables imprimées ou d’hybrides, elles peuvent<br /> s’inscrire dans un espace virtuel, ou dans des espaces physiques.<br /> Pour ce faire, le cours propose entre autres de développer des pratiques favorisant le<br /> détournement, le hacking et la poésie, la magie et les recettes, et parfois la lenteur et la<br /> maladresse. Enfin, il propose d'analyser dans les entrailles des objets et système digitaux leur<br /> enjeux politiques, économiques, anthropologiques et historiques — autrement dit, des enjeux<br /> de design.<br /> <br /> [[nathan|la page de nathan]]<br /> <br /> [[Lou|La page de Lou]]</div>

Lou https://designnumerique.be/w/index.php?title=DESIGN_NUMERIQUE&diff=4295 2023-09-28T16:40:16Z

<p>Lou : </p> <hr /> <div>= Description générale du cours =<br /> <br /> L’orientation « Design numérique » propose d’explorer<br /> les modes de création graphiques et de diffusion en milieux numériques en apprivoisant les<br /> outils de production digitaux en « les pratiquant » ou autrement dit en « faisant avec ». Il vise<br /> à mettre l’accent sur les formes éditoriales (au sens large) qui se frottent aux outils<br /> numériques et aux media, ces formes de publications pouvant avoir plusieurs statuts, non<br /> seulement celui de flux digitaux, de formes stables imprimées ou d’hybrides, elles peuvent<br /> s’inscrire dans un espace virtuel, ou dans des espaces physiques.<br /> Pour ce faire, le cours propose entre autres de développer des pratiques favorisant le<br /> détournement, le hacking et la poésie, la magie et les recettes, et parfois la lenteur et la<br /> maladresse. Enfin, il propose d'analyser dans les entrailles des objets et système digitaux leur<br /> enjeux politiques, économiques, anthropologiques et historiques — autrement dit, des enjeux<br /> de design.<br /> <br /> [[nathan|la page de nathan]]<br /> <br /> [[Lou]La page de Lou]</div>

Lou