diff --git a/public/site/templates/project.json.php b/public/site/templates/project.json.php
new file mode 100644
index 0000000..5629d2f
--- /dev/null
+++ b/public/site/templates/project.json.php
@@ -0,0 +1,13 @@
+<?php
+
+$project = [
+  'title' => $page->title()->value(),
+  'url' => $page->url(),
+  'modified' => $page->modified('Y-MM-d'),
+  'status' => $page->status(),
+  'logo' => $page->client()->toPage()->logo()->toFile()->url()
+];
+
+$data = array_merge($genericData, $project);
+
+echo json_encode($data);
\ No newline at end of file
diff --git a/public/site/templates/project.php b/public/site/templates/project.php
new file mode 100644
index 0000000..4ed6305
--- /dev/null
+++ b/public/site/templates/project.php
@@ -0,0 +1 @@
+<?php snippet('generic-template') ?>
\ No newline at end of file
diff --git a/src/views/Project.vue b/src/views/Project.vue
new file mode 100644
index 0000000..7e4cc1b
--- /dev/null
+++ b/src/views/Project.vue
@@ -0,0 +1,90 @@
+<template>
+  <main>
+    <header class="flex | bg-white | rounded-2xl | p-8">
+      <h1 class="font-serif | px-8">{{ data.content.title }}</h1>
+      <button class="btn | ml-auto">Demander un RDV</button>
+    </header>
+    <div class="flex-columns">
+      <section aria-labelledby="votre-brief-label" data-status="past">
+        <h2 id="votre-brief-label" data-icon="">Votre brief</h2>
+        <article class="card">
+          <hgroup class="order-last">
+           <h3 class="card__title | font-serif | text-lg">Votre Brief</h3>
+          </hgroup>
+          <div class="flex">
+            <time class="card__date | text-grey-700" datetime="2024-06-12">12 juin 2024</time>
+          </div>
+          <figure class="card__images" data-count="13">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/6ed93d6950-1725442486/d82f18573c439d6edd434ffca62471a7.png" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/a4222f5029-1725442486/22f8779f680ed826a2d0a1d2af6018c9.jpg" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/1bbe051c5a-1725442486/0c41d3266e9ce2872f30608cceb28239.png" alt="">
+          </figure>
+        </article>
+      </section>
+      <section aria-labelledby="offre-commerciale-label" data-status="past">
+        <h2 id="offre-commerciale-label" data-icon="">Offre Commerciale</h2>
+        <article class="card">
+          <hgroup class="order-last">
+           <h3 class="card__title | font-serif | text-lg">Offre - 2</h3>
+           <p class="text-primary | font-medium">4 commentaires</p>
+          </hgroup>
+          <div class="flex">
+            <time class="card__date | text-grey-700" datetime="2024-06-12">12 juin 2024</time>
+            <span class="text-primary | font-medium | ml-auto">Validé</span>
+          </div>
+          <figure class="card__images">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/6ed93d6950-1725442486/d82f18573c439d6edd434ffca62471a7.png" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/a4222f5029-1725442486/22f8779f680ed826a2d0a1d2af6018c9.jpg" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/1bbe051c5a-1725442486/0c41d3266e9ce2872f30608cceb28239.png" alt="">
+          </figure>
+        </article>
+      </section>
+      <section aria-labelledby="brief-enrichi-label" data-status="past">
+        <h2 id="brief-enrichi-label" data-icon="">Brief Enrichi</h2>
+        <article class="card">
+          <hgroup class="order-last">
+           <h3 class="card__title | font-serif | text-lg">Brief Enrichi</h3>
+          </hgroup>
+          <div class="flex">
+            <time class="card__date | text-grey-700" datetime="2024-06-12">12 juin 2024</time>
+            <span class="text-primary | font-medium | ml-auto">Validé</span>
+          </div>
+          <figure class="card__images" data-count="15">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/6ed93d6950-1725442486/d82f18573c439d6edd434ffca62471a7.png" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/a4222f5029-1725442486/22f8779f680ed826a2d0a1d2af6018c9.jpg" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/1bbe051c5a-1725442486/0c41d3266e9ce2872f30608cceb28239.png" alt="">
+          </figure>
+        </article>
+      </section>
+      <section aria-labelledby="echantillon-virtuel-label" data-status="current">
+        <h2 id="echantillon-virtuel-label" data-icon="">Échantillon Virtuel</h2>
+        <article class="card">
+          <hgroup class="order-last">
+           <h3 class="card__title | font-serif | text-lg">Rendu 360°</h3>
+          </hgroup>
+          <div class="flex">
+            <time class="card__date | text-grey-700" datetime="2024-06-12">12 juin 2024</time>
+          </div>
+          <figure class="card__images" data-count="13">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/6ed93d6950-1725442486/d82f18573c439d6edd434ffca62471a7.png" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/a4222f5029-1725442486/22f8779f680ed826a2d0a1d2af6018c9.jpg" alt="">
+            <img src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/1bbe051c5a-1725442486/0c41d3266e9ce2872f30608cceb28239.png" alt="">
+          </figure>
+        </article>
+      </section>
+    </div>
+  </main>
+</template>
+
+<script setup>
+import { usePageStore } from "../stores/page"
+import { useUserStore } from "../stores/user";
+import { ref, computed } from "vue";
+import { storeToRefs } from "pinia";
+
+const { page } = storeToRefs(usePageStore());
+const user = useUserStore().user;
+</script>
+
+<style scope>
+</style>
\ No newline at end of file