> For the complete documentation index, see [llms.txt](https://documentation.efalia.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://documentation.efalia.com/documentations/efalia-process/administration/administration-fonctionnelle/modelisation-designer.md).

# Modélisation dans le Designer

Le **Designer HTML** d'Efalia Process est l'outil central de l'administrateur fonctionnel. Il permet de concevoir visuellement les processus métier, les formulaires, les règles de gestion et les structures organisationnelles, puis de les déployer automatiquement sous forme d'applications web opérationnelles.

Ce guide couvre la création de tous les éléments constitutifs d'un projet Efalia Process.

***

## Accéder au Designer HTML

Le Designer HTML est accessible directement depuis votre navigateur web :

```
http://[adresse-serveur]:8080/workey/designer
```

{% hint style="info" %}
**Prérequis d'accès :** Votre compte doit disposer du profil **Workflow Manager**. Ce profil est attribué par un administrateur dans la console d'administration (`/workey/admin`).
{% endhint %}

📸 **CAPTURE : admin-fonct-designer-01-interface-accueil.png**

> Vue d'ensemble de l'interface du Designer HTML au démarrage : panneau gauche avec les types de graphes, zone de travail centrale, barre d'outils supérieure.

***

## Structure de l'interface

L'interface du Designer HTML se compose de trois zones principales :

| Zone                | Description                                                         |
| ------------------- | ------------------------------------------------------------------- |
| **Panneau gauche**  | Liste des types de graphes disponibles et navigation dans le projet |
| **Zone de travail** | Canvas de modélisation par onglets                                  |
| **Barre d'outils**  | Actions contextuelles (sauvegarder, vérifier, générer, déployer…)   |

***

## Créer un Projet

Le **Projet** est le conteneur principal de votre application métier. Il regroupe l'ensemble des processus, procédures, formulaires, domaines de valeur et ressources.

{% stepper %}
{% step %}

#### Étape 1 : Créer un nouveau projet

Dans le menu **Projet**, cliquez sur **Nouveau**.

Le système crée automatiquement un projet intitulé "Sans Nom" et l'ouvre dans la zone de travail.

📸 **CAPTURE : admin-fonct-designer-02-nouveau-projet.png**

> Menu Projet > Nouveau avec le nouveau projet "Sans Nom" créé
> {% endstep %}

{% step %}

#### Étape 2 : Configurer les propriétés du projet

Renseignez les propriétés du projet dans le panneau de droite :

| Propriété       | Description                                | Exemple                                         |
| --------------- | ------------------------------------------ | ----------------------------------------------- |
| **Libellé**     | Nom visible dans l'interface               | `Gestion des Commandes`                         |
| **Nom interne** | Identifiant technique unique (auto-généré) | `gestion_commandes`                             |
| **Description** | Description fonctionnelle du projet        | `Processus de traitement des commandes clients` |
| **Aide**        | Texte d'aide affiché aux utilisateurs      | `Application de gestion du circuit commandes`   |

{% hint style="info" %}
💡 **Astuce** : Le **Nom interne calculé automatiquement** garantit l'unicité de l'identifiant. Il est recommandé de laisser cette option activée pour éviter les conflits entre projets.
{% endhint %}

📸 **CAPTURE : admin-fonct-designer-03-proprietes-projet.png**

> Panneau des propriétés d'un projet avec les champs renseignés
> {% endstep %}

{% step %}

#### Étape 3 : Sauvegarder le projet

Utilisez **Projet > Enregistrer** (ou `Ctrl+S`) pour sauvegarder votre projet.

**Résultat :** Le projet est enregistré sur le serveur Efalia Process et apparaît dans la liste des projets disponibles.
{% endstep %}
{% endstepper %}

***

## Créer un Processus

Un **Processus** définit le cycle de vie complet d'un type de document (dossier, demande, contrat…). Il décrit les états successifs et les acteurs responsables.

{% stepper %}
{% step %}

#### Étape 1 : Ouvrir le type de graphe Processus

Dans le panneau gauche du Designer, double-cliquez sur **Processus** pour créer un nouveau graphe de processus.

📸 **CAPTURE : admin-fonct-designer-04-creation-processus.png**

> Double-clic sur "Processus" dans le panneau gauche, nouveau graphe vierge créé
> {% endstep %}

{% step %}

#### Étape 2 : Configurer les propriétés du processus

Renseignez les propriétés :

| Propriété       | Description                          |
| --------------- | ------------------------------------ |
| **Libellé**     | Nom visible (ex : `Demande d'Achat`) |
| **Nom interne** | Identifiant unique dans le projet    |
| **Description** | Explication fonctionnelle            |
| **Aide**        | Texte d'aide utilisateur             |
| {% endstep %}   |                                      |

{% step %}

#### Étape 3 : Ajouter les éléments du processus

Depuis le panneau **Composants**, faites glisser les éléments sur le canvas :

| Composant          | Usage                                        |
| ------------------ | -------------------------------------------- |
| **Document**       | Type de document géré par ce processus       |
| **Procédure**      | Appel d'un sous-workflow                     |
| **Ressource**      | Flux d'information (matériel ou immatériel)  |
| **Entité Externe** | Acteur ou système externe pour la lisibilité |
| {% endstep %}      |                                              |

{% step %}

#### Étape 4 : Modéliser le cycle de vie du document

Pour chaque **Document**, définissez ses états et ses rôles :

**Ajouter un Rôle :**

1. Sélectionnez un Document sur le canvas
2. Faites glisser un **Rôle** depuis le panneau
3. Configurez le rôle (Public / Privé, acteurs habilités)

**Ajouter des Opérations :**

1. Sélectionnez un Rôle
2. Faites glisser une **Opération** depuis le panneau
3. Nommez l'opération (ex : `Valider`, `Rejeter`, `Clôturer`)

📸 **CAPTURE : admin-fonct-designer-05-cycle-vie-document.png**

> Exemple de cycle de vie d'un document avec états, rôles et opérations connectés
> {% endstep %}

{% step %}

#### Étape 5 : Définir les transitions

Connectez les éléments entre eux en dessinant des **liens** :

{% tabs %}
{% tab title="Lien Standard (noir)" %}
Relie un document à une opération. Indique qu'une opération **modifie** ou **produit** un document.

* Faire glisser depuis un document vers une opération (ou inversement)
  {% endtab %}

{% tab title="Lien de Synchronisation (rouge)" %}
Indique qu'une opération **nécessite** un document en entrée avant de pouvoir s'exécuter.

* Utilisé pour les pré-conditions
  {% endtab %}

{% tab title="Lien de Dérivation (bleu)" %}
Crée un **sous-document** qui suivra un cycle de vie indépendant.

* Ex : une demande principale génère plusieurs bons de commande
  {% endtab %}

{% tab title="Lien de Délai (vert tirets)" %}
Définit une **échéance** avec seuil d'alerte en cas de dépassement.

* Ex : traitement obligatoire sous 48h
  {% endtab %}
  {% endtabs %}
  {% endstep %}
  {% endstepper %}

***

## Créer une Procédure

Une **Procédure** est un sous-workflow encapsulé, réutilisable dans plusieurs processus. Elle modélise le **détail d'une activité** (la séquence exacte des tâches effectuées par les rôles).

{% tabs %}
{% tab title="Depuis le panneau Procédures" %}

1. Dans le panneau gauche, double-cliquez sur **Procédures**
2. Un nouveau graphe de procédure s'ouvre
3. Configurez les propriétés (Libellé, Nom interne, Description)
4. Ajoutez les composants (Documents, Rôles, Opérations, Ressources, Outils)
   {% endtab %}

{% tab title="Depuis un graphe Processus" %}

1. Dans votre graphe Processus, faites glisser un composant **Procédure**
2. Sélectionnez-le, puis faites **Ctrl + double-clic** pour créer et ouvrir son graphe détaillé
3. La procédure est automatiquement liée au processus parent
   {% endtab %}
   {% endtabs %}

### Composants d'une Procédure

| Composant                 | Description                                                         |
| ------------------------- | ------------------------------------------------------------------- |
| **Documents**             | Flux documentaires entrant et sortant (état par défaut : `Nouveau`) |
| **Rôles**                 | Qui effectue les tâches (Public ou Privé)                           |
| **Opérations**            | Actions unitaires effectuées par chaque rôle                        |
| **Opérations Parallèles** | Plusieurs rôles travaillant simultanément                           |
| **Ressources**            | Informations nécessaires à l'activité                               |
| **Outils**                | Applications externes ou logiciels bureautiques utilisés            |

{% hint style="info" %}
💡 Une procédure peut avoir plusieurs **origines** et **destinations** de liens, permettant des structures non-arborescentes complexes.
{% endhint %}

***

## Gérer les Domaines de Valeur

Les **Domaines de valeur** définissent des listes prédéfinies utilisées dans les formulaires (équivalent des listes déroulantes). Ils sont définis au niveau du projet et réutilisables partout.

### Accéder aux Domaines

Dans le menu **Outils**, sélectionnez **Domaines**.

📸 **CAPTURE : admin-fonct-designer-06-domaines-valeur.png**

> Interface de gestion des domaines avec la liste des domaines existants

### Types de sources de données

{% tabs %}
{% tab title="Liste manuelle" %}
Saisie directe des valeurs :

| Clé        | Libellé    |
| ---------- | ---------- |
| `PENDING`  | En attente |
| `APPROVED` | Approuvé   |
| `REJECTED` | Rejeté     |

Idéal pour des listes stables et limitées.
{% endtab %}

{% tab title="Requête SQL" %}
Alimentation dynamique depuis la base de données :

```sql
SELECT id, label FROM ma_table WHERE actif = 1 ORDER BY label
```

La liste est mise à jour en temps réel à chaque affichage du formulaire.
{% endtab %}

{% tab title="Plage numérique" %}
Définit un intervalle de valeurs numériques :

* **Minimum** : valeur plancher
* **Maximum** : valeur plafond
* **Format** : format d'affichage (ex : `#,##0.00`)
  {% endtab %}

{% tab title="Acteurs" %}
Liste dynamique alimentée depuis l'**organigramme** Efalia Process.

Permet de sélectionner des unités organisationnelles, postes ou acteurs directement dans un formulaire.
{% endtab %}
{% endtabs %}

### Valeur par défaut

Trois comportements possibles pour la valeur par défaut :

* **Aucune** : la première valeur du domaine est sélectionnée
* **Valeur du domaine** : une valeur spécifique est présélectionnée
* **Valeur externe** : valeur hors domaine — combinée à un champ obligatoire, force l'utilisateur à faire un choix explicite

***

## Gérer les Organigrammes

L'**Organigramme** représente la structure hiérarchique de votre organisation. Il est utilisé par Efalia Process pour l'attribution des rôles, la gestion des remplacements et les délégations.

{% stepper %}
{% step %}

#### Étape 1 : Créer un graphe Organigramme

Dans le panneau gauche, double-cliquez sur **Organigrammes** pour créer un nouveau graphe.
{% endstep %}

{% step %}

#### Étape 2 : Ajouter des Unités Organisationnelles

Faites glisser des composants **Unité** et **Poste** sur le canvas :

| Composant                   | Description               | Exemple                                  |
| --------------------------- | ------------------------- | ---------------------------------------- |
| **Unité Organisationnelle** | Groupement d'acteurs      | `Direction Achats`, `Équipe Support`     |
| **Poste**                   | Fonction dans l'organisme | `Chef de Service`, `Directeur Financier` |

📸 **CAPTURE : admin-fonct-designer-07-organigramme.png**

> Exemple d'organigramme avec unités et postes reliés hiérarchiquement
> {% endstep %}

{% step %}

#### Étape 3 : Définir les liens hiérarchiques

Connectez les unités entre elles :

* **Liens hiérarchiques** : dépendance directe entre unités (A dépend de B)
* **Liens sémantiques** : relations hors arborescence, avec libellé optionnel

{% hint style="warning" %}
⚠️ **Règles de cohérence du graphe :**

* Le graphe doit être **acyclique** (pas de boucles)
* Le graphe doit être **non-redondant** (pas de dépendances transitives inutiles)
* Plusieurs sous-graphes indépendants sont acceptés (graphe non-connexe)
  {% endhint %}
  {% endstep %}
  {% endstepper %}

***

## Vérification de Cohérence

Avant de déployer un processus, Efalia Process offre deux niveaux de vérification.

### Vérifications continues (en temps réel)

Le Designer applique automatiquement certaines règles pendant la modélisation. Il est par exemple **impossible** de :

* Créer un lien directement vers un Rôle
* Lier deux Documents entre eux directement
* Connecter une opération avec pré-condition sans passer par la pré-condition

### Vérification finale

{% stepper %}
{% step %}

#### Lancer la vérification

Dans le menu **Outils**, cliquez sur **Vérifier**.

Le système analyse l'ensemble du projet et génère un rapport.
{% endstep %}

{% step %}

#### Analyser le rapport

Le rapport liste toutes les erreurs et avertissements détectés.

**Double-cliquez sur une erreur** pour positionner automatiquement l'éditeur sur l'objet concerné.

📸 **CAPTURE : admin-fonct-designer-08-rapport-coherence.png**

> Rapport de vérification de cohérence avec liste d'erreurs cliquables
> {% endstep %}

{% step %}

#### Corriger les erreurs

Corrigez chaque erreur signalée avant de procéder au déploiement.

{% hint style="info" %}
💡 **Astuce** : Utilisez toujours le bouton **CHOIX** pour sélectionner les noms d'objets plutôt que de les saisir manuellement. Cela évite les erreurs de nommage liées aux accents ou à la casse.
{% endhint %}
{% endstep %}
{% endstepper %}

{% hint style="warning" %}
⚠️ La vérification de cohérence est **automatiquement exécutée** avant toute génération de workflow. Un projet contenant des erreurs ne peut pas être déployé.
{% endhint %}

***

## Déployer un Processus

Une fois votre processus modélisé et vérifié, le déploiement génère automatiquement l'application web correspondante.

{% stepper %}
{% step %}

#### Étape 1 : Vérifier la cohérence

Lancez **Outils > Vérifier** et assurez-vous qu'il n'y a aucune erreur.
{% endstep %}

{% step %}

#### Étape 2 : Générer le workflow

Cliquez sur **Déployer** (ou **Outils > Générer**).

Efalia Process compile l'ensemble de la modélisation et génère l'application web.
{% endstep %}

{% step %}

#### Étape 3 : Vérifier le déploiement

Accédez à l'interface utilisateur (`/workey`) pour vérifier que le nouveau processus est bien disponible.

**Résultat :** Le processus est immédiatement accessible aux utilisateurs habilités. Aucun redémarrage serveur n'est nécessaire.

📸 **CAPTURE : admin-fonct-designer-09-processus-deploye.png**

> Le nouveau processus apparaît dans le Panorama utilisateur
> {% endstep %}
> {% endstepper %}

***

## Bonnes Pratiques de Modélisation

{% hint style="success" %}
**✅ À faire :**

* Vérifier la cohérence régulièrement pendant la modélisation (pas seulement à la fin)
* Utiliser des **noms internes explicites** et cohérents (sans espaces, en minuscules avec underscores)
* **Décrire** chaque processus, procédure et rôle dans le champ Description
* Utiliser des **procédures** pour les séquences réutilisées dans plusieurs processus
* Tester sur un environnement de recette avant de déployer en production
* Documenter les changements (versions, raisons de modification)
  {% endhint %}

{% hint style="danger" %}
**❌ À éviter :**

* Saisir manuellement les noms d'objets (risque de doublon par typo) → utiliser le bouton **CHOIX**
* Créer des processus sans états finaux définis
* Modifier un processus en production sans test préalable
* Ignorer les avertissements (en orange) dans le rapport de cohérence
  {% endhint %}

***

## Questions Fréquentes

<details>

<summary>Comment renommer un objet (processus, rôle, opération) sans casser les liens ?</summary>

Dans le Designer HTML, vous pouvez renommer un objet directement depuis ses **propriétés** sans casser les liens existants. Le système maintient les références internes par identifiant unique, indépendamment du libellé affiché.

Cependant, si vous modifiez le **Nom interne** (identifiant technique), les références dans les formulaires et connecteurs utilisant cet identifiant devront être mises à jour manuellement.

</details>

<details>

<summary>Peut-on avoir plusieurs versions d'un même processus en production simultanément ?</summary>

Oui. Efalia Process gère le **versionnage** des processus. Lorsqu'une nouvelle version est déployée :

* Les documents **en cours** continuent sur l'ancienne version jusqu'à leur clôture
* Les **nouveaux** documents utilisent automatiquement la nouvelle version

Vous pouvez consulter et gérer les versions déployées depuis la console d'administration (`/workey/admin`).

</details>

<details>

<summary>Quelle est la limite du nombre de processus dans un projet ?</summary>

Il n'y a pas de limite théorique au nombre de processus dans un projet. En pratique, pour des raisons de maintenabilité, il est conseillé de ne pas dépasser **20 à 30 processus** par projet et de regrouper par domaine fonctionnel.

</details>

<details>

<summary>Comment partager des domaines de valeur entre plusieurs projets ?</summary>

Les domaines de valeur sont définis au niveau du **projet** et ne sont pas partagés nativement entre projets. Pour réutiliser un domaine dans un autre projet, vous devez le recréer ou utiliser une **requête SQL** pointant vers une table commune en base de données.

</details>

<details>

<summary>Est-il possible d'importer un projet depuis un autre environnement ?</summary>

Oui. Le Designer HTML permet d'**exporter** un projet sous forme d'archive compressée. Cette archive peut ensuite être **importée** dans un autre serveur Efalia Process (recette → production, par exemple).

Cette fonctionnalité est disponible dans le menu **Projet > Exporter / Importer**.

</details>

<details>

<summary>Que se passe-t-il si je supprime un rôle utilisé dans un formulaire déployé ?</summary>

La suppression d'un rôle dans le Designer crée une incohérence détectée par la vérification de cohérence. Le projet ne pourra pas être redéployé tant que cette incohérence n'est pas corrigée.

Attention : la suppression d'un rôle ne supprime pas les données des documents existants en production. Ces données restent accessibles mais le rôle n'est plus fonctionnel.

</details>

<details>

<summary>Comment modéliser un processus avec des étapes en parallèle ?</summary>

Utilisez les **Opérations Parallèles** dans le Designer. Ce composant permet de définir plusieurs rôles travaillant simultanément sur un même document. Le processus attend que tous les rôles parallèles aient effectué leurs opérations avant de continuer.

Glissez un composant **Opérations Parallèles** sur votre graphe et ajoutez-y les rôles concernés.

</details>

<details>

<summary>Comment générer automatiquement la documentation d'un processus ?</summary>

Le Designer HTML intègre un générateur de documentation. Depuis le menu **Outils > Documentation**, vous pouvez générer un document décrivant l'ensemble de votre projet (processus, procédures, formulaires, organigrammes).

Cette documentation est utile pour les revues de processus et la formation des utilisateurs.

</details>

***

**Votre première modélisation est prête.** Pour aller plus loin dans les fonctionnalités avancées du Designer HTML (formulaires, connecteurs, déploiement), consultez l'article suivant.

Pour aller plus loin :

* [Designer HTML – Fonctionnalités Avancées](/documentations/efalia-process/administration/administration-fonctionnelle/designer-html.md)
* [Paramétrage du Front Office](/documentations/efalia-process/administration/administration-fonctionnelle/parametrage-front-office.md)
* [Langages de Processus (STalk, WKYJS)](/documentations/efalia-process/administration/administration-fonctionnelle/langages-process.md)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://documentation.efalia.com/documentations/efalia-process/administration/administration-fonctionnelle/modelisation-designer.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
