entretien erg + iyo-bisseck retouche

assets/css/entretiens.css

@@ -5,6 +5,7 @@
   padding-right: calc(var(--unit)*0.75);
   position: relative;
   top: -4px;
+
 }
 
 .description-before {
@@ -53,43 +54,62 @@
   top: -3px;
 }
 
+.description-after::after{
+  content: "/ /";
+  display: block;
+  text-align: center;
+  max-width: 1ch;
+  margin-inline: auto;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
 
-h5 {
+
+h5, h6 {
   font-size: var(--sign-size);
   color: var(--sign-color);
   font-weight: normal;
+
+  text-indent: calc(var(--unit) * 0.75);
+  position: relative;
+  font-family: var(--sign-family);
+
+    margin-top: calc(var(--baseline)*1);
+      margin-bottom: calc(var(--baseline)*0);
+      break-after: avoid;
+
 }
 
-h5::before, h6::before{
+
+h5::after, 
+h6::after{
+  content: "----";
+  left: -68px;
+  top: 0px;
+}
+
+h5::before, 
+h6::before{
+  content: "@";
+  left: -84px;
+  top: 0px;
+}
+
+h5::after, 
+h6::after,
+h5::before, 
+h6::before{
   font-size: var(--sign-size);
   color: var(--sign-color);
   letter-spacing: var(--sign-spacing);
   font-family: var(--sign-family);
   line-height: var(--sign-baseline);
+  display: block;
+  position: absolute;
 }
 
-.pagedjs_right_page h5::before{
-    content: "//////"
-}
 
-.pagedjs_left_page h5{
-    left: -49px;
-}
-
-.pagedjs_left_page h5::before{
-    content: "//////"
-}
-
-h6 {
-  font-size: var(--sign-size);
-  color: var(--sign-color);
-}
-
-h6::before {
-  content: "//";
-}
-
-.decor-h6 {
+/* .decor-h6 {
   font-size: var(--sign-size);
   color: var(--sign-color);
   letter-spacing: var(--sign-spacing);
@@ -103,4 +123,4 @@ h6::before {
 .pagedjs_right_page .decor-h6 {
     left: -80px;
     top: calc(var(--baseline)*-4.5 + 11px);
-}
+} */

assets/css/figures.css

@@ -5,23 +5,30 @@ figure{
 }
 
 figcaption{
-  margin-top: calc(var(--baseline)*0.25);
+  margin-top: calc(var(--baseline)*0.5);
 }
 
 figcaption::before{
-  content: "/";
+  content: "*";
    font-family: var(--sign-family);
-   display: block;
-   text-align: center;
+     font-size: var(--sign-size);
+  color: var(--sign-color);
+  letter-spacing: var(--sign-spacing);
+  font-family: var(--sign-family);
+  line-height: var(--sign-baseline);
+  position: absolute;
+  left: 0;
 }
 
 figcaption p{
 	margin: 0;
   text-indent: 0!important;
-    text-align: center!important;
-        font-size: var(--fs-notes);
+  text-align: left!important;
+    /* text-align: center!important; */
+      font-size: var(--fs-notes);
     line-height: 14px;
     font-weight: 500;
+    padding-left: calc(var(--unit) * 0.5);
 }
 
 figcaption p::before{

assets/css/portfolio.css

@@ -107,6 +107,37 @@
 
 
 
+/* Stephane & Gwenola -------------------------------------------- */
+
+
+
+#fig-stephane-degoutin-et-gwenola-wagon-2 img{
+ object-fit: contain;
+  width: 80%;
+  object-position: calc(var(--margin) + var(--bleed-images)) calc(var(--pagedjs-margin-top) + var(--bleed-images));
+  
+
+}
+
+
+#fig-stephane-degoutin-et-gwenola-wagon-3{
+  break-before: left;
+
+}
+
+#fig-stephane-degoutin-et-gwenola-wagon-3 figure{
+   break-before: right;
+}
+
+#fig-stephane-degoutin-et-gwenola-wagon-5{
+   break-before: left;
+}
+
+#fig-stephane-degoutin-et-gwenola-wagon-6{
+   break-before: right;
+}
+
+
 
 
 /* IYO BISSECK -------------------------------------------- */
@@ -115,38 +146,45 @@
 #fig-iyo-bisseck-1{
 break-before: right;
 }
-#fig-iyo-bisseck-3{
+/* #fig-iyo-bisseck-3{
   break-before: page;
-}
+} */
 
 
-#fig-iyo-bisseck-4 img{
+#fig-iyo-bisseck-3 img{
   object-fit: contain;
   width: 80%;
   object-position: calc(var(--margin) + var(--bleed-images)) calc(var(--pagedjs-margin-top) + var(--bleed-images));
 
 }
 
+#fig-iyo-bisseck-4{
+  break-before: left;
+}
 
-/* #fig-iyo-bisseck-5 img{
+#fig-iyo-bisseck-5{
+  break-before: right;
+}
+
+#fig-iyo-bisseck-6 img{
   position: relative;
-  width: 80%;
-  left: calc(20% - var(--bleed-images));
+  width: 60%;
+  left: calc(40% - var(--bleed-images));
  object-fit: contain;
   object-position: 0px calc(var(--pagedjs-margin-top) + var(--bleed-images));
-} */
+}
 
-#fig-iyo-bisseck-5 img{
+/* #fig-iyo-bisseck-6 img{
     object-fit: contain;
   width: 80%;
   position: relative;
   left: calc(10% - var(--bleed-images));
 
-}
+} */
 
-#fig-iyo-bisseck-6, #fig-iyo-bisseck-7{
+/* #fig-iyo-bisseck-6, #fig-iyo-bisseck-7{
   break-before: page;
-}
+} */
 
 
 

assets/css/text.css

@@ -40,14 +40,18 @@ p::before {
 .chapter p.first-p,
 .chapter p.following-title,
 .chapter p.following-h3,
-.chapter p.following-h4{
+.chapter p.following-h4,
+.chapter p.following-h5,
+.chapter p.following-h6{
     text-indent: 0;
 }
 
 .first-p::before,
 .following-title::before,
 .following-h3::before,
-.following-h4::before {
+.following-h4::before,
+.following-h5::before,
+.following-h6::before {
     content: none;
 }
 

assets/js/plugins/decor-subtitles.js

@@ -102,23 +102,21 @@ class subtitlesDecor extends Paged.Handler {
 
     beforeParsed(content){
       content.querySelectorAll("h3, h4").forEach(subtitle => {
-        const block = subtitle.closest('.block'); 
+        const block = subtitle.closest('.block');
         const nextBlock = block?.nextElementSibling;
-
         if (!nextBlock) return;
-
         const firstP = nextBlock.querySelector('p');
-
         if (!firstP) return;
-
-        if (subtitle.tagName === "H3") {
-          firstP.classList.add("following-h3");
-        }
-
-        if (subtitle.tagName === "H4") {
-          firstP.classList.add("following-h4");
-        }
+        if (subtitle.tagName === "H3") firstP.classList.add("following-h3");
+        if (subtitle.tagName === "H4") firstP.classList.add("following-h4");
       });
+
+      // content.querySelectorAll("h5, h6").forEach(subtitle => {
+      //   const nextSibling = subtitle.nextElementSibling;
+      //   if (!nextSibling || nextSibling.tagName !== "P") return;
+      //   if (subtitle.tagName === "H5") nextSibling.classList.add("following-h5");
+      //   if (subtitle.tagName === "H6") nextSibling.classList.add("following-h6");
+      // });
       content.querySelectorAll(".chapter-content").forEach(chapter => {
            let pfirst = chapter.querySelector('p');
            pfirst.classList.add("first-p");
@@ -144,20 +142,20 @@ class subtitlesDecor extends Paged.Handler {
       //   container.appendChild(subtitle);
       // });
 
-      pageElement.querySelectorAll("h6").forEach(h6 => {
-        if (h6.closest(".h6_container")) return;
-        const smallSizes = [1, 2, 3, 2, 1];
-        const bigSizes   = [1, 2, 3, 4, 5, 4, 3, 2, 1];
-        const firstDecor = isLeft
-          ? this.createDecor(symbol, smallSizes, "decor-h6_small", "decor-h6")
-          : this.createDecor(symbol, bigSizes,   "decor-h6_big",   "decor-h6");
-        const container = document.createElement("div");
-        container.className = "h6_container " + h6.className;
-        h6.className = "";
-        h6.parentNode.insertBefore(container, h6);
-        container.appendChild(firstDecor);
-        container.appendChild(h6);
-      });
+      // pageElement.querySelectorAll("h6").forEach(h6 => {
+      //   if (h6.closest(".h6_container")) return;
+      //   const smallSizes = [1, 2, 3, 2, 1];
+      //   const bigSizes   = [1, 2, 3, 4, 5, 4, 3, 2, 1];
+      //   const firstDecor = isLeft
+      //     ? this.createDecor(symbol, smallSizes, "decor-h6_small", "decor-h6")
+      //     : this.createDecor(symbol, bigSizes,   "decor-h6_big",   "decor-h6");
+      //   const container = document.createElement("div");
+      //   container.className = "h6_container " + h6.className;
+      //   h6.className = "";
+      //   h6.parentNode.insertBefore(container, h6);
+      //   container.appendChild(firstDecor);
+      //   container.appendChild(h6);
+      // });
     }
 
      

content/2_iyo-bisseck/chapitre.txt

@@ -30,7 +30,7 @@ Bio:
 
 ----
 
-Text: [{"content":{"text":"<p><em>Wilderness Garden</em> est un jeu vidéo narratif qui explore les histoires entremêlées des technologies contemporaines et des héritages coloniaux. À travers une série d’espaces interconnectés, le·la joueur·euse traverse des lieux où se dévoilent les infrastructures visibles et invisibles du pouvoir&nbsp;: une salle d’archives, un bureau administratif, les profondeurs d’Internet ou encore des souvenirs familiaux fragmentés. Le projet interroge les dynamiques d’accès aux ressources, aux territoires et aux espaces numériques, et examine comment les technologies actuelles peuvent prolonger, transformer ou dissimuler des logiques de domination.</p><p>Le titre du jeu fait écho à la métaphore controversée formulée par Josep Borrell, qui décrivait l’Europe comme un «&nbsp;jardin&nbsp;» à protéger du reste du monde. En reprenant cette image, <em>Wilderness Garden </em>questionne les récits qui naturalisent les frontières et les hiérarchies entre peuples, territoires et formes de vie.</p><p>L’expérience commence dans un espace inspiré du sac amniotique, où la voix et l’avatar d’Iyo invitent les joueur·eusess à prendre conscience de leur propre corps et de leurs histoires transgénérationnelles. Ce point de départ suggère que la mémoire et la présence peuvent devenir des formes de résistance face à l’effacement produit par le neurocapitalisme et les récits coloniaux.</p><p>Au fil du parcours, les joueur·euses rencontrent un jardin clos où la surveillance rappelle les mécanismes du «&nbsp;contrat racial&nbsp;», une salle d’archives où la conférence de Berlin, l’exploitation minière au Congo et la construction de la ligne Congo-Océan révèlent la logistique coloniale qui a redessiné territoires et vies. Sous les océans, les câbles d’Internet réactivent d’anciennes routes impériales, révélant comment l’infrastructure numérique s’inscrit dans des géographies façonnées par l’expansion coloniale.</p><p>Un espace administratif, inspiré des bureaux de la Caf, met en scène un système algorithmique qui envoie des lettres recommandées et produit des formes contemporaines de tri, de profilage et de contrôle des populations vulnérables.</p><p>Entre ces lieux surgissent aussi des moments plus intimes&nbsp;: une cérémonie de mémoire au cœur des infrastructures numériques ou un espace poétique évoquant les ancêtres disparus et les fractures familiales.&nbsp;</p><p>À travers ce voyage non linéaire, <em>Wilderness Garden</em> invite les joueur·euses à dépasser les lignes droites des frontières et des récits dominants, pour imaginer des formes de vie plus vastes, capables de reconnaître les graines enfouies dans l’histoire et les possibles retours qu’elles portent.</p>"},"id":"84b8861c-0e6f-4767-ad55-523766865d95","isHidden":false,"type":"text"},{"content":[],"id":"de1021ac-030f-46be-8673-b48556f62b1f","isHidden":false,"type":"break"},{"content":{"image":["file://36fsvvwod97nz1ga"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-full-page"},"id":"b9b6bc49-ccef-4600-a790-7e89038dfcb5","isHidden":false,"type":"image"},{"content":{"image":["file://czj4n0r93jw8ofsb"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"3c909f8b-7039-4534-887a-d3e3503bc0dd","isHidden":false,"type":"image"},{"content":{"image":["file://coa5h7f71hdru7mj"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"3f146491-fb30-44c7-9efa-d06d46f24b2c","isHidden":false,"type":"image"},{"content":{"image":["file://ujynt8nqvk8r2qie"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-spread"},"id":"f844e22d-3270-4fcd-98e6-5b7fe6a20b7f","isHidden":false,"type":"image"},{"content":{"image":["file://shprtv8wmmlccuma"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-spread"},"id":"98e0f3bf-571c-45f7-bc08-59ea5b4aa4cb","isHidden":false,"type":"image"},{"content":{"image":["file://1doh2xvgznjyh1b5"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"96a2ee17-2755-4791-a4fd-89216171636b","isHidden":false,"type":"image"},{"content":{"image":["file://rkfkgfwvwaoqqqkb"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"f6f02f7e-0006-4b92-8831-e611a8f07cde","isHidden":false,"type":"image"}]
+Text: [{"content":{"text":"<p><em>Wilderness Garden</em> est un jeu vidéo narratif qui explore les histoires entremêlées des technologies contemporaines et des héritages coloniaux. À travers une série d’espaces interconnectés, le·la joueur·euse traverse des lieux où se dévoilent les infrastructures visibles et invisibles du pouvoir&nbsp;: une salle d’archives, un bureau administratif, les profondeurs d’Internet ou encore des souvenirs familiaux fragmentés. Le projet interroge les dynamiques d’accès aux ressources, aux territoires et aux espaces numériques, et examine comment les technologies actuelles peuvent prolonger, transformer ou dissimuler des logiques de domination.</p><p>Le titre du jeu fait écho à la métaphore controversée formulée par Josep Borrell, qui décrivait l’Europe comme un «&nbsp;jardin&nbsp;» à protéger du reste du monde. En reprenant cette image, <em>Wilderness Garden </em>questionne les récits qui naturalisent les frontières et les hiérarchies entre peuples, territoires et formes de vie.</p><p>L’expérience commence dans un espace inspiré du sac amniotique, où la voix et l’avatar d’Iyo invitent les joueur·eusess à prendre conscience de leur propre corps et de leurs histoires transgénérationnelles. Ce point de départ suggère que la mémoire et la présence peuvent devenir des formes de résistance face à l’effacement produit par le neurocapitalisme et les récits coloniaux.</p><p>Au fil du parcours, les joueur·euses rencontrent un jardin clos où la surveillance rappelle les mécanismes du «&nbsp;contrat racial&nbsp;», une salle d’archives où la conférence de Berlin, l’exploitation minière au Congo et la construction de la ligne Congo-Océan révèlent la logistique coloniale qui a redessiné territoires et vies. Sous les océans, les câbles d’Internet réactivent d’anciennes routes impériales, révélant comment l’infrastructure numérique s’inscrit dans des géographies façonnées par l’expansion coloniale.</p><p>Un espace administratif, inspiré des bureaux de la Caf, met en scène un système algorithmique qui envoie des lettres recommandées et produit des formes contemporaines de tri, de profilage et de contrôle des populations vulnérables.</p><p>Entre ces lieux surgissent aussi des moments plus intimes&nbsp;: une cérémonie de mémoire au cœur des infrastructures numériques ou un espace poétique évoquant les ancêtres disparus et les fractures familiales.&nbsp;</p><p>À travers ce voyage non linéaire, <em>Wilderness Garden</em> invite les joueur·euses à dépasser les lignes droites des frontières et des récits dominants, pour imaginer des formes de vie plus vastes, capables de reconnaître les graines enfouies dans l’histoire et les possibles retours qu’elles portent.</p>"},"id":"84b8861c-0e6f-4767-ad55-523766865d95","isHidden":false,"type":"text"},{"content":[],"id":"de1021ac-030f-46be-8673-b48556f62b1f","isHidden":false,"type":"break"},{"content":{"image":["file://36fsvvwod97nz1ga"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"b9b6bc49-ccef-4600-a790-7e89038dfcb5","isHidden":false,"type":"image"},{"content":{"image":["file://1doh2xvgznjyh1b5"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"96a2ee17-2755-4791-a4fd-89216171636b","isHidden":false,"type":"image"},{"content":{"image":["file://ujynt8nqvk8r2qie"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-spread"},"id":"f844e22d-3270-4fcd-98e6-5b7fe6a20b7f","isHidden":false,"type":"image"},{"content":{"image":["file://coa5h7f71hdru7mj"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"3f146491-fb30-44c7-9efa-d06d46f24b2c","isHidden":false,"type":"image"},{"content":{"image":["file://czj4n0r93jw8ofsb"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-simple-paysage"},"id":"3c909f8b-7039-4534-887a-d3e3503bc0dd","isHidden":false,"type":"image"},{"content":{"image":["file://rkfkgfwvwaoqqqkb"],"imagered":[],"imagegreen":[],"imageblue":[],"alt":"","caption":"","taille":"","classes":"portfolio-spread"},"id":"f6f02f7e-0006-4b92-8831-e611a8f07cde","isHidden":false,"type":"image"}]
 
 ----
 

content/7_everything-is-real/chapitre.txt

@@ -1,60 +0,0 @@
-Title: Everything is Real
-
-----
-
-Id: everything-is-real
-
-----
-
-Author: Stéphane Degoutin et Gwenola Wagon
-
-----
-
-Typeof: portfolio
-
-----
-
-Cover: 
-
-----
-
-Bio: 
-
-----
-
-Text: [{"content":{"text":"<p><em>Everything is Real </em>plonge dans les biais et les archétypes des images générées par IA. Le site est visible à cette adresse : <a href=\"http://everythingisreal.net/\">everythingisreal.net</a></p><p>Nous ne voulions ni rester extérieurs aux IA, ni leur résister frontalement. Nous avons choisi une autre voie : plonger à l’intérieur, suivre leur propre logique, jusqu’à ce que celle-ci s’épuise ou se retourne contre elle-même. Nous naviguons à l’intérieur même de la matière des images des IA génératives, en adoptant une posture d’observation participante.</p><p>Dans les années 1970, l'architecte britannique Reyner Banham, pour comprendre Los Angeles, écrivait : « Comme les générations précédentes d’intellectuels anglais qui ont appris l’italien pour lire Dante dans le texte, j’ai appris à conduire pour lire Los Angeles dans le texte ».</p><p>Nous poussons les IA dans leurs retranchements, jusqu’à la saturation de leurs stéréotypes. Le film <em>Everything is Real </em>met en scène l’automatisation, la répétition et l’amplification algorithmique.</p><p>Nous avions constitué un corpus des tropes les plus répandus des images de stock. Nous avons ensuite reproduit chacune de ces images en utilisant les générateurs les plus répandus. Nous tirons parti de l’archéologie des images de stock pour retourner les IA génératives sur leurs propres sources, leurs propres biais, en fouillant dans les strates de leurs stéréotypes, de leurs récits implicites, de leurs imaginaires figés.</p><p>Ainsi, <em>Everything is Real </em>montre les pommes les plus rouges, les call centers les plus verts, les salles de serveurs les plus câblées, les bénévoles les plus efficaces, les montagnes de déchets les plus massives.</p><p>Mais en faisant tourner les stéréotypes en boucle, les images versent insensiblement dans l’extrême. La pomme rouge, seule sur fond blanc, apparaît dans les mains d’employés qui sourient un peu trop, puis se gavent jusqu’à sombrer dans leur jus.</p><p>Stéphane Degoutin et Gwenola Wagon</p><p>Nos films et nos installations sont visibles sur le site <a href=\"http://d-w.fr/\">d-w.fr</a></p><p>Nos projets explorent les fantasmes d’un monde d’hyper efficience dont la figure archétypale serait le data center : une infrastructure automatisée servant à la fois au stockage des produits, du vivant et des données.</p><p>Le film-essai <em>Cyborgs dans la brume </em>(2011) dessine le portrait d’une société en poudre, à travers les processus d’atomisation incarnés par le béton armé, la farine animale, les data centers et les églises évangélistes.</p><p>Le film-essai <em>World Brain </em>(2015) est « un labyrinthe, dont l'idée de cerveau mondial serait le centre virtuel » (Andreas Rauth)</p><p>L’installation <em>Le monde comme entrepôt de livraison </em>(2017) montre les réalités cachées de l’automatisation du monde et révèle le déploiement d’un monde habité par des machines et des algorithmes.</p><p>La série de films <em>Erewhon </em>(2019) raconte des fables sur la vie des habitants d’un monde où l’automatisation a été fantasmée jusqu’à ses extrêmes.</p><p><em>L’Atlas du nuage </em>(2021) « dévoile l’invisible matrice de travail humain, de consommation énergétique et d’extraction de ressources qui sous-tend les réseaux numériques et l’intelligence artificielle. » (Marie Lechner)</p><p>Le film <em>La maison qui vous veut du bien </em>(2023) parle d’un objet très banal – une sonnette connectée équipée d’une caméra – à partir duquel se déploie tout un système de surveillance et de contrôle.</p>"},"id":"a0cc0bfa-2c4f-4b58-b5db-b4cefd8047b2","isHidden":false,"type":"text"},{"content":[],"id":"c6a5c9b1-b88a-4350-8ee3-e28cc2625970","isHidden":false,"type":"break"}]
-
-----
-
-Portfolio:
-
-- 
-  spread:
-    - file://rpp5npgikc1p4bkp
-  imageontop:
-    - file://go5mej2mbgah9bgv
-  position: bottomright
-  largeur: 10
-- 
-  spread:
-    - file://xtjc1ga0gcsuehyg
-  imageontop:
-    - file://gkzt6a0uqfei06ii
-  position: topleft
-  largeur: 20
-- 
-  spread:
-    - file://6lymgrtmatdlmg6b
-  imageontop: [ ]
-  position: ""
-  largeur: ""
-- 
-  spread:
-    - file://u7tafpgzvgblnekd
-  imageontop: [ ]
-  position: ""
-  largeur: ""
-
-----
-
-Uuid: wgtxadoooaifwu1x