diff --git a/.changes/unreleased/UX-20251029-110804.yaml b/.changes/unreleased/UX-20251029-110804.yaml
new file mode 100644
index 000000000..5342d3a1e
--- /dev/null
+++ b/.changes/unreleased/UX-20251029-110804.yaml
@@ -0,0 +1,6 @@
+kind: UX
+body: Improve the ux for selecting whether user wants to be notified of the final step of a workflow or all steps
+time: 2025-10-29T11:08:04.077020411+01:00
+custom:
+    Issue: "542"
+    SchemaChange: No schema change
diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue
index 332849ef5..a9e5348ea 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue
@@ -1,40 +1,38 @@
 <template>
     <div class="d-grid gap-2 my-3">
         <button
-            class="btn btn-misc"
+            class="btn btn-outline-primary text-start d-flex align-items-center"
+            :class="{ active: subscriberFinal }"
             type="button"
-            v-if="!subscriberFinal"
-            @click="subscribeTo('subscribe', 'final')"
+            @click="
+                subscribeTo(
+                    subscriberFinal ? 'unsubscribe' : 'subscribe',
+                    'final',
+                )
+            "
         >
-            <i class="fa fa-check fa-fw"></i>
-            {{ trans(WORKFLOW_SUBSCRIBE_FINAL) }}
+            <i
+                class="fa fa-fw me-2"
+                :class="subscriberFinal ? 'fa-check-square-o' : 'fa-square-o'"
+            ></i>
+            <span>{{ trans(WORKFLOW_SUBSCRIBE_FINAL) }}</span>
         </button>
         <button
-            class="btn btn-misc"
+            class="btn btn-outline-primary text-start d-flex align-items-center"
+            :class="{ active: subscriberStep }"
             type="button"
-            v-if="subscriberFinal"
-            @click="subscribeTo('unsubscribe', 'final')"
+            @click="
+                subscribeTo(
+                    subscriberStep ? 'unsubscribe' : 'subscribe',
+                    'step',
+                )
+            "
         >
-            <i class="fa fa-times fa-fw"></i>
-            {{ trans(WORKFLOW_UNSUBSCRIBE_FINAL) }}
-        </button>
-        <button
-            class="btn btn-misc"
-            type="button"
-            v-if="!subscriberStep"
-            @click="subscribeTo('subscribe', 'step')"
-        >
-            <i class="fa fa-check fa-fw"></i>
-            {{ trans(WORKFLOW_SUBSCRIBE_ALL_STEPS) }}
-        </button>
-        <button
-            class="btn btn-misc"
-            type="button"
-            v-if="subscriberStep"
-            @click="subscribeTo('unsubscribe', 'step')"
-        >
-            <i class="fa fa-times fa-fw"></i>
-            {{ trans(WORKFLOW_UNSUBSCRIBE_ALL_STEPS) }}
+            <i
+                class="fa fa-fw me-2"
+                :class="subscriberStep ? 'fa-check-square-o' : 'fa-square-o'"
+            ></i>
+            <span>{{ trans(WORKFLOW_SUBSCRIBE_ALL_STEPS) }}</span>
         </button>
     </div>
 </template>
@@ -45,9 +43,7 @@ import { defineProps, defineEmits } from "vue";
 import {
     trans,
     WORKFLOW_SUBSCRIBE_FINAL,
-    WORKFLOW_UNSUBSCRIBE_FINAL,
     WORKFLOW_SUBSCRIBE_ALL_STEPS,
-    WORKFLOW_UNSUBSCRIBE_ALL_STEPS,
 } from "translator";
 
 // props