diff --git a/README.adoc b/README.adoc
index cb979eb..5085995 100644
--- a/README.adoc
+++ b/README.adoc
@@ -7,7 +7,8 @@ image::PepperScreenshot.png[Pepper]
Pepper is a web application based on (https://www.eclipse.org/sirius/sirius-web.html[Eclipse Sirius-Web]).
It allows to create data related to your project and represents the data with Gantt, Form and boards like Daily, Kanban or OKR.
-Follow the link for more details link:#functionalities[the functionalities].
+Follow the link for https://github.com/ObeoNetwork/pepper/blob/main/doc/user.adoc[User documentation].
+
This repository is a mono repo containing both frontend and backend components.
diff --git a/backend/deeplab-frontend/pom.xml b/backend/deeplab-frontend/pom.xml
index a61886d..91e49ad 100644
--- a/backend/deeplab-frontend/pom.xml
+++ b/backend/deeplab-frontend/pom.xml
@@ -64,6 +64,70 @@
+
+ io.github.git-commit-id
+ git-commit-id-maven-plugin
+
+
+ get-the-git-infos
+
+ revision
+
+ initialize
+
+
+
+ false
+ true
+ full
+
+ ^git.commit.id.(abbrev|full)$
+
+
+
+
+ org.asciidoctor
+ asciidoctor-maven-plugin
+ 2.2.4
+
+
+ convert-to-html
+ generate-resources
+
+ process-asciidoc
+
+
+ ${project.basedir}/../../doc/
+ ${project.basedir}/src/main/resources/static/doc/
+ true
+
+ left
+ font
+ coderay
+ ./images
+ ${project.version}
+ ${git.commit.id.abbrev}
+
+
+
+
+ ../../doc/images
+
+ images
+
+
+ **/*.png
+ **/*.svg
+
+
+
+
+
+
+
diff --git a/doc/images/concepts.png b/doc/images/concepts.png
new file mode 100644
index 0000000..2abd6af
Binary files /dev/null and b/doc/images/concepts.png differ
diff --git a/doc/images/create-model-button.png b/doc/images/create-model-button.png
new file mode 100644
index 0000000..0e1a5ed
Binary files /dev/null and b/doc/images/create-model-button.png differ
diff --git a/doc/images/create-model-dialog.png b/doc/images/create-model-dialog.png
new file mode 100644
index 0000000..9dbe088
Binary files /dev/null and b/doc/images/create-model-dialog.png differ
diff --git a/doc/images/create-projectmgmt-project.png b/doc/images/create-projectmgmt-project.png
new file mode 100644
index 0000000..988f7cb
Binary files /dev/null and b/doc/images/create-projectmgmt-project.png differ
diff --git a/doc/images/create-representation.png b/doc/images/create-representation.png
new file mode 100644
index 0000000..e4a88b2
Binary files /dev/null and b/doc/images/create-representation.png differ
diff --git a/doc/images/representation-daily.png b/doc/images/representation-daily.png
new file mode 100644
index 0000000..da16e93
Binary files /dev/null and b/doc/images/representation-daily.png differ
diff --git a/doc/images/representation-form.png b/doc/images/representation-form.png
new file mode 100644
index 0000000..9a7991a
Binary files /dev/null and b/doc/images/representation-form.png differ
diff --git a/doc/images/representation-gantt.png b/doc/images/representation-gantt.png
new file mode 100644
index 0000000..c1cba2e
Binary files /dev/null and b/doc/images/representation-gantt.png differ
diff --git a/doc/images/representation-kanban.png b/doc/images/representation-kanban.png
new file mode 100644
index 0000000..3979443
Binary files /dev/null and b/doc/images/representation-kanban.png differ
diff --git a/doc/images/representation-okr.png b/doc/images/representation-okr.png
new file mode 100644
index 0000000..e776285
Binary files /dev/null and b/doc/images/representation-okr.png differ
diff --git a/doc/user.adoc b/doc/user.adoc
new file mode 100644
index 0000000..5bdc14d
--- /dev/null
+++ b/doc/user.adoc
@@ -0,0 +1,108 @@
+ifndef::imagesdir[:imagesdir: images]
+
+= User documentation
+
+:toc:
+
+Pepper is a project management tool.
+
+It allows creating data related to your project and represents the data with Gantt, Form and boards like Daily, Kanban or OKR.
+
+As `Pepper` is based on Sirius Web application, please refer to the https://www.eclipse.org/sirius/sirius-web.html[Sirius Web documentation] for more details.
+
+== Concepts
+
+The core concept is the `Project`.
+It contains:
+
+* many attributes to describe the `Project` such as planning, cost or stakeholder information.
+* a list of `Workpackages`
+* a list of `Risks`
+A `Risk` is associated to one or many `Workpackages`
+* a list of `Objectives`
+
+A `Workpackage` contains
+
+* a list of `WorkpackageArtefact`
+* a list of `Tasks`.
+`Tasks` is a fine-grained concept to describe the `Workpackage`
+
+At root level, you can create `Organizations` that own the `Projects` and `ResourceFolders` which contain `Persons`, `Teams`, `InternalStakeholders` and `ExternalStakeholders`.
+
+image::concepts.png[Concepts]
+
+== Starter
+
+To start the user need to create a Sirius project that will contain a model containing the concepts.
+By default, a blank model is created.
+You can add a new model by adding a blank or a sample model.
+The sample model is useful to see the concepts that are possible to create.
+
+image::create-projectmgmt-project.png[Create Project]
+
+image::create-model-button.png[Create Model Button]
+
+image::create-model-dialog.png[Create Model Dialog]
+
+== Representations
+
+Once you have created the model, you can create representations of your model.
+Representation is the core feature that will help display and edit your data.
+
+You can create a representation using the contextual menu on the object.
+
+image::create-representation.png[Create Model Dialog]
+
+=== Form on Project
+
+Project is the key concept.
+A `Form` representation can be created from a `Project`.
+It contains many tabs that display project information.
+
+image::representation-form.png[Form]
+
+
+=== Gantt on Project and Workpackage
+
+A `Gantt` representation can be created from a `Project` or a `Workpackage`
+
+image::representation-gantt.png[Gantt]
+
+In `Gantt` on `Project`, the Gantt tasks represent the `Workpackage` of the `Project`.
+
+In `Gantt` on `Workpackage`, the Gantt tasks represent the `Tasks` and sub `Tasks` of the `Workpackage`.
+
+You can
+
+* create new tasks
+* change the dates of the task by moving the task or changing in `Details` panel
+* reorder existing tasks or change the parent of a task
+
+=== Deck on Project and Workpackage
+
+A `Deck` representation is a representation which have columns and card inside columns.
+The cards can be moved from a column to another.
+
+==== OKR
+
+The `OKR` representation can be created from a `Project` or a `Workpackage`.
+The columns represent the `Objectives` contained in the Project or Workpackage and the cards represent the `KeyResult`.
+
+image::representation-okr.png[OKR]
+
+==== Daily
+
+The `Daily` representation can be created from a `Workpackage`.
+
+image::representation-daily.png[Daily]
+
+The columns represent the `TaskTags` (with _daily_ prefix) contained in the `TagFolder` and the cards represent the `Tasks` that have a reference to the corresponding `TaskTag`.
+
+
+==== Kanban
+
+The `Kanban` representation can be created from a `Workpackage`.
+
+image::representation-kanban.png[Daily]
+
+The columns represent the `TaskTags` (with _kanban_ prefix) contained in the `TagFolder` and the cards represent the `Tasks` that have a reference to the corresponding `TaskTag`.
diff --git a/frontend/deeplab-web/src/core/Help.tsx b/frontend/deeplab-web/src/core/Help.tsx
index 3d62f54..99753db 100644
--- a/frontend/deeplab-web/src/core/Help.tsx
+++ b/frontend/deeplab-web/src/core/Help.tsx
@@ -15,6 +15,7 @@ import Link from '@mui/material/Link';
import { emphasize } from '@mui/material/styles';
import { makeStyles } from 'tss-react/mui';
import HelpIcon from '@mui/icons-material/Help';
+import { httpOrigin } from '../core/URL';
const useHelpStyle = makeStyles()((theme) => ({
onDarkBackground: {
@@ -28,7 +29,7 @@ export const Help = () => {
const { classes } = useHelpStyle();
return (