diff --git a/src/pages/account/account.ts b/src/pages/account/account.ts
index ca58d43..89d4ebd 100755
--- a/src/pages/account/account.ts
+++ b/src/pages/account/account.ts
@@ -26,6 +26,7 @@ declare global {
         handleLogout: () => void;
         initializeEventListeners: () => void;
         showProcess: () => void;
+        showProcessCreation: () => void;
         updateNavbarName: (name: string) => void;
         updateNavbarLastName: (lastName: string) => void;
         showAlert: (title: string, text?: string, icon?: string) => void;
@@ -47,6 +48,7 @@ import { addressToEmoji } from '../../utils/sp-address.utils';
 import { getCorrectDOM } from '../../utils/document.utils';
 import accountStyle from '../../../public/style/account.css?inline';
 import Services from '../../services/service';
+import { getProcessCreation } from './process-creation';
 
 let isAddingRow = false;
 let currentRow: HTMLTableRowElement | null = null;
@@ -173,6 +175,7 @@ class AccountElement extends HTMLElement {
             <ul class="parameter-list-ul" onclick="window.showPairing()">Pairing 🔗</ul>
             <!-- <ul class="parameter-list-ul" onclick="window.showWallet()">Wallet 👛</ul> -->
             <ul class="parameter-list-ul" onclick="window.showProcess()">Process ⚙️</ul>
+            <ul class="parameter-list-ul" onclick="window.showProcessCreation()">Process Creation</ul>
             <!-- <ul class="parameter-list-ul" onclick="window.showData()">Data 💾</ul> -->
         </div>
 
@@ -182,6 +185,7 @@ class AccountElement extends HTMLElement {
                 <div id="pairing-content"></div>
                 <!-- <div id="wallet-content"></div> -->
                 <div id="process-content"></div>    
+                <div id="process-creation-content"></div>    
                 <!-- <div id="data-content"></div> -->
             </div>
         </div>
@@ -192,6 +196,7 @@ class AccountElement extends HTMLElement {
         window.showPairing = () => this.showPairing();
         window.showWallet = () => this.showWallet();
         window.showProcess = () => this.showProcess();
+        window.showProcessCreation = () => this.showProcessCreation();
         window.showData = () => this.showData();
         window.addWalletRow = () => this.addWalletRow();
         window.confirmWalletRow = () => this.confirmWalletRow();
@@ -822,6 +827,13 @@ private handleAvatarUpload(event: Event): void {
     }
 }
 
+private async showProcessCreation(): Promise<void> {
+    this.hideAllContent();
+    const container = this.shadowRoot?.getElementById('process-creation-content');
+    if (container) {
+        getProcessCreation(container);
+    }
+}
 
 private async showProcess(): Promise<void> {
     currentMode = 'process';
@@ -1020,7 +1032,7 @@ private showContractPopup(contractId: string, event?: Event) {
 
 // Fonction utilitaire pour cacher tous les contenus
 private hideAllContent(): void {
-    const contents = ['pairing-content', 'wallet-content', 'process-content', 'data-content'];
+    const contents = ['pairing-content', 'wallet-content', 'process-content', 'process-creation-content', 'data-content', 'document-validation-content'];
     contents.forEach(id => {
         const element = this.shadowRoot?.getElementById(id);
         if (element) {