diff --git a/index.html b/index.html
index 44452a1..195f569 100644
--- a/index.html
+++ b/index.html
@@ -483,6 +483,7 @@
       <video id="texture" autoplay muted loop src="./assets/video/close.webm" class="closedBackground"></video>
       <video id="texture" autoplay muted loop src="./assets/video/open.webm" class="openBackground"></video>
       <video id="background" autoplay muted loop src="./assets/video/background.webm" class="openBackground"></video>
+      <canvas></canvas>
     </main>
 
     <section class="floatingWindow" id="posterWindow">
diff --git a/js/cuteTexture.js b/js/cuteTexture.js
new file mode 100644
index 0000000..5a1c95e
--- /dev/null
+++ b/js/cuteTexture.js
@@ -0,0 +1,71 @@
+const target = document.querySelector('canvas');
+
+const ctx = target.getContext('2d');
+
+export let lolState = false;
+
+let scale = 0.7;
+
+function analogLikeNoise(){
+  let tH = target.height;
+  let tW = target.width;
+  //console.log('window dimensions :', tH, tW)
+  const img = ctx.createImageData(tW, tH);
+  let offset = 0;
+  let index = 0;
+  let brightness = 0;
+
+  for(let x = 0; x<tW; x++){
+    const sx = x * scale + offset
+    for(let y = 0; y<tH; y++){
+      let lum = Math.random()*161
+
+      //img.data[index++] = lum*150/255;
+      index++
+      img.data[index++] = lum;
+      img.data[index++] = lum;
+      img.data[index++] = 255;
+      }
+    }
+  ctx.putImageData(img, 0, 0);
+
+  offset ++;
+  if(offset>1024){
+    offset = 0;
+  }
+}
+
+let time = 0
+
+function scanlines(){
+  time += 0.05;
+  let tH = target.height;
+  let tW = target.width;
+  //console.log('window dimensions :', tH, tW)
+  const img = ctx.createImageData(tW, tH);
+  let index = 0;
+
+  for(let y = 0; y<tH; y++){
+    for(let x = 0; x<tW; x++){
+      let lum = (Math.sin(y*2 - time*3.1415) * 44) + 77;
+
+      //img.data[index++] = lum;
+      index++;
+      img.data[index++] = lum;
+      //img.data[index++] = lum + Math.random()*32;
+      index++
+      img.data[index++] = 255;
+      }
+    }
+  ctx.putImageData(img, 0, 0);
+}
+
+export function scanlinesAnimation(){
+    scanlines();
+    requestAnimationFrame(scanlinesAnimation);
+}
+
+export function noiseAnimation(){
+    analogLikeNoise();
+    requestAnimationFrame(noiseAnimation);
+}
diff --git a/js/main.js b/js/main.js
index ca42fe1..5ce4fa9 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,8 +1,28 @@
 import { loadEvents } from './events.js'
 import { loadStatus } from './status.js'
+import { scanlinesAnimation } from './cuteTexture.js'
+import { noiseAnimation } from './cuteTexture.js'
 
 loadEvents();
 loadStatus();
+/*
+// =================================== background texture
+ let textureVideo = document.querySelectorAll('main > #texture');
+
+for (let video of textureVideo){
+  video.style.visibility = 'collapse';
+}
+
+let textureCanvas = document.querySelector('main > canvas');
+textureCanvas.style.visibility = 'visible';
+
+console.log(textureCanvas);
+
+//console.log(textureVideo)
+
+scanlinesAnimation();
+// ======================================== stops here !
+*/
 
 let target = document.querySelector('#posterWindow');
 
diff --git a/readMe.MD b/readMe.MD
index d532ff6..2bf3fe5 100644
--- a/readMe.MD
+++ b/readMe.MD
@@ -13,3 +13,5 @@ Ce document sert à échanger et partager des idées et trucs à faire pour cont
 >(***) mise en place du statut sans le lien symbolique (devrait fonctionner si on l'ajoute mais jsep comment faire)
         modifier le lien vers le dossier au lieu de ''index.ouvert.html' dans la page principale
         changer le fetch dans status.js
+
+> problème de gestion des évènement tactiles, rien ne marche ...
diff --git a/style/main.css b/style/main.css
index 162c8a0..5e222d1 100644
--- a/style/main.css
+++ b/style/main.css
@@ -537,3 +537,14 @@ main{
   align-items: center;
   justify-content: space-around;
 }
+
+canvas{
+  visibility: collapse;
+  height: 110%;
+  width: auto;
+  position: absolute;
+  inset: 0;
+  z-index: -32;
+
+  opacity: 1;
+}