diff --git a/src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue b/src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue
index 5e3b0f0db..c09efda8a 100644
--- a/src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue
+++ b/src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue
@@ -229,7 +229,7 @@ async function downloadAndOpen(): Promise<Blob> {
 const initPdf = () => {
   const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
   canvas.addEventListener("pointerup", canvasClick, false);
-  setTimeout(() => addZones(page.value), 800);
+  setTimeout(() => drawAllZones(page.value), 800);
 };
 
 const scaleXToCanvas = (x: number, canvasWidth: number, PDFWidth: number) =>
@@ -259,11 +259,11 @@ const selectZone = (z: SignatureZone, canvas: HTMLCanvasElement) => {
   const ctx = canvas.getContext("2d");
   if (ctx) {
     setPage(page.value);
-    setTimeout(() => drawZone(z, ctx, canvas.width, canvas.height), 200);
+    setTimeout(() => drawAllZones(page.value), 200);
   }
 };
 
-const selectZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) =>
+const selectZoneEvent = (e: PointerEvent, canvas: HTMLCanvasElement) =>
   signature.zones
     .filter((z) => z.PDFPage.index + 1 === page.value)
     .map((z) => {
@@ -283,15 +283,15 @@ const selectZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) =>
 const canvasClick = (e: PointerEvent) => {
   const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
   canvasEvent.value === "select"
-    ? selectZoneOnCanvas(e, canvas)
-    : addZoneOnCanvas(e, canvas);
+    ? selectZoneEvent(e, canvas)
+    : addZoneEvent(e, canvas);
 };
 
 const turnPage = async (upOrDown: number) => {
-  userSignatureZone.value = null;
+  //userSignatureZone.value = null; // desactivate the reset of the zone when turning page
   page.value = page.value + upOrDown;
   await setPage(page.value);
-  setTimeout(() => addZones(page.value), 200);
+  setTimeout(() => drawAllZones(page.value), 200);
 };
 
 const turnSignature = async (upOrDown: number) => {
@@ -351,19 +351,24 @@ const drawZone = (
     ctx.fillStyle = unselectedBlue;
     ctx.fillText("Choisir cette", xText, yText - 12);
     ctx.fillText("zone de signature", xText, yText + 12);
-    // ctx.strokeStyle = "#c6c6c6"; // halo
-    // ctx.strokeText("Choisir cette", xText, yText - 12);
-    // ctx.strokeText("zone de signature", xText, yText + 12);
   }
 };
 
-const addZones = (page: number) => {
+const drawAllZones = (page: number) => {
   const canvas = document.querySelectorAll("canvas")[0];
   const ctx = canvas.getContext("2d");
   if (ctx) {
     signature.zones
       .filter((z) => z.PDFPage.index + 1 === page)
-      .map((z) => drawZone(z, ctx, canvas.width, canvas.height));
+      .map((z) => {
+        if (userSignatureZone.value) {
+          if (userSignatureZone.value?.index === z.index) {
+            drawZone(z, ctx, canvas.width, canvas.height);
+          }
+        } else {
+          drawZone(z, ctx, canvas.width, canvas.height);
+        }
+      });
   }
 };
 
@@ -447,7 +452,7 @@ const confirmSign = () => {
 const undoSign = async () => {
   signature.zones = signature.zones.filter((z) => z.index !== null);
   await setPage(page.value);
-  setTimeout(() => addZones(page.value), 200);
+  setTimeout(() => drawAllZones(page.value), 200);
   userSignatureZone.value = null;
   adding.value = false;
 };
@@ -458,7 +463,8 @@ const toggleAddZone = () => {
     : (canvasEvent.value = "select");
 };
 
-const addZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) => {
+const addZoneEvent = async (e: PointerEvent, canvas: HTMLCanvasElement) => {
+  userSignatureZone.value = null;
   const BOX_WIDTH = 180;
   const BOX_HEIGHT = 90;
   const PDFPageHeight = canvas.height;
@@ -485,7 +491,8 @@ const addZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) => {
   };
   signature.zones.push(newZone);
 
-  setTimeout(() => addZones(page.value), 200);
+  await setPage(page.value);
+  setTimeout(() => drawAllZones(page.value), 200);
   canvasEvent.value = "select";
   adding.value = true;
 };
@@ -494,7 +501,7 @@ const removeNewZone = async () => {
   signature.zones = signature.zones.filter((z) => z.index !== null);
   userSignatureZone.value = null;
   await setPage(page.value);
-  setTimeout(() => addZones(page.value), 200);
+  setTimeout(() => drawAllZones(page.value), 200);
   canvasEvent.value = "select";
   adding.value = false;
 };