diff --git a/src/Bundle/ChillPersonBundle/Resources/public/modules/accompanying_course_work_list/index.scss b/src/Bundle/ChillPersonBundle/Resources/public/modules/accompanying_course_work_list/index.scss
index 9fe4b99f5..433f291b5 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/modules/accompanying_course_work_list/index.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/modules/accompanying_course_work_list/index.scss
@@ -2,16 +2,19 @@
 #accompanying_course_work_list {
 
   .item {
+    margin-bottom: 1.5rem;
+    padding: 1rem;
+    border: 1px solid gray;
 
     .title_label {
       display: block;
       margin: 0;
 
-      font-size: 0.8rem;
-    }
+      font-variant-caps: small-caps;
 
-    h2.action_title {
-      margin-top: 0;
+      + * {
+        margin-top: 0;
+      }
     }
 
     .objective_results {
@@ -19,8 +22,10 @@
       grid-template-areas:
         "obj res"
         ;
-      grid-columns: 50%;
+      grid-template-columns: 50%;
       column-gap: 1rem;
+      
+      padding: 0.3rem;
 
       .obj {
         grid-area: obj;
@@ -28,8 +33,64 @@
 
       .res {
         grid-area: res;
+
+        ul.result_list {
+          list-style-type: none;
+          padding: 0;
+        }
       }
     }
+
+    .objective_results:nth-child(2n+2) {
+      background-color: var(--chill-llight-gray);
+    }
   }
 
+  .updatedBy {
+    margin-top: 1rem;
+    text-align: right;
+    font-size: 0.8rem;
+    font-style: italic;
+  }
+}
+
+ul.timeline {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  list-style-type: none;
+
+  > li {
+    min-width: 210px;
+
+    div.date {
+      margin-bottom: 20px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+    }
+    div.label {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      padding: 0 40px;
+      border-top: 2px solid var(--chill-green);
+
+      &:before {
+        content: '';
+        display: inline-block;
+        position: relative;
+        width: 25px;
+        height: 25px;
+        
+        background-color: white;
+        border-radius: 25px;
+        border: 1px solid #ddd;
+        
+        top: -15px;
+      }
+    }
+  }
 }
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_by_accompanying_period.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_by_accompanying_period.html.twig
index ec5279759..28626f7c2 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_by_accompanying_period.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_by_accompanying_period.html.twig
@@ -17,23 +17,45 @@
         </div>
 
         <div class="timeline">
-          <ul>
-            <li>
-              <span class="label">{{ 'accompanying_course_work.create_date'|trans }}</span>
+          <ul class="timeline">
+            <li class="completed">
+              <div class="date">
+                <span>{{ w.createdAt|format_date('long') }}</span>
+              </div>
+              <div class="label">
+                <span>{{ 'accompanying_course_work.create_date'|trans }}</span>
+              </div>
+            </li>
+            <li class="completed">
+              <div class="date">
+                <span>{{ w.startDate|format_date('long') }}</span>
+              </div>
+              <div class="label">
+                <span>{{ 'accompanying_course_work.start_date'|trans }}</span>
+              </div>
+            </li>
+            <li class="{%if date(w.endDate) < date('now') %}completed{% endif %}">
+              <div class="date">
+                <span>{{ w.endDate|format_date('long') }}</span>
+              </div>
+              <div class="label">
+                <span>{{ 'accompanying_course_work.end_date'|trans }}</span>
+              </div>
             </li>
           </ul>
         </div>
 
         {% if w.results|length > 0 %}
-          <div class="objective_results objective_results--without-objectives">
+          <div class="objective_results objective_results__without-objectives">
             <div class="obj without_objective">
-              {{ 'accompanying_course_work.results without objective'|trans }}
+              <p class="title_label">{{ 'accompanying_course_work.goal'|trans }}</p>
+              <p class="chill-no-data-statement">{{ 'accompanying_course_work.results without objective'|trans }}</p>
             </div>
             <div class="res results">
-              <p class="title_label">{{ 'accompanying_course_work.goal'|trans }}</p>
-              <ul>
+              <p class="title_label">{{ 'accompanying_course_work.results'|trans }}</p>
+              <ul class="result_list">
                 {% for r in w.results %}
-                  <li>{{ r.title|localize_translatable_string }}</li>
+                  <li class="badge badge-primary">{{ r.title|localize_translatable_string }}</li>
                 {% endfor %}
               </ul>
             </div>
@@ -41,35 +63,40 @@
         {% endif %}
 
         {% if w.goals|length > 0 %}
-          <div class="objective_results objective_results--with-objectives">
-            {% for g in w.goals %}
-              <div class="objective">
+          {% for g in w.goals %}
+            <div class="objective_results objective_results--with-objectives">
+              <div class="objective obj">
                 <p class="title_label">{{ 'accompanying_course_work.goal'|trans }}</p>
-                <h3>{{ g.goal.title|localize_translatable_string }}</h3>
+                <h3 class="goal_title">{{ g.goal.title|localize_translatable_string }}</h3>
               </div>
-              <div class="results">
+              <div class="results res">
                 {% if g.results|length == 0 %}
+                  <p class="title_label">{{ 'accompanying_course_work.results'|trans }}</p>
                   <p class="chill-no-data-statement">{{ 'accompanying_course_work.no_results'|trans }}</p>
                 {% else %}
-                <p class="title_label">{{ 'accompanying_course_work.result'|trans }}</p>
-                  <ul>
+                  <p class="title_label">{{ 'accompanying_course_work.results'|trans }}</p>
+                  <ul class="result_list">
                     {% for r in g.results %}
-                      <li>{{ r.title|localize_translatable_string }}</li>
+                      <li class="badge badge-primary">{{ r.title|localize_translatable_string }}</li>
                     {% endfor %}
                   </ul>
                 {% endif %}
               </div>
-            {% endfor %}
-          </div>
+            </div>
+          {% endfor %}
         {% endif %}
 
+        <div class="updatedBy">
+          {{ 'Last updated by'|trans}}: {{ w.updatedBy|chill_entity_render_box }}, {{ w.updatedAt|format_datetime('long', 'short') }}
+        </div>
+
 
         <div class="actions">
           <ul class="record_actions">
             <li>
-              <a href="{{ chill_path_add_return_path('chill_person_accompanying_period_work_edit', { 'id': w.id }) }}">
-                Work with id {{ w.id }}
-              </a>
+              <a 
+                class="sc-button bt-edit"
+                href="{{ chill_path_add_return_path('chill_person_accompanying_period_work_edit', { 'id': w.id }) }}">{{ 'Update'|trans }}</a>
             </li>
           </ul>
         </div>
diff --git a/src/Bundle/ChillPersonBundle/translations/messages.fr.yml b/src/Bundle/ChillPersonBundle/translations/messages.fr.yml
index d34bd76b7..8397c3fa7 100644
--- a/src/Bundle/ChillPersonBundle/translations/messages.fr.yml
+++ b/src/Bundle/ChillPersonBundle/translations/messages.fr.yml
@@ -339,7 +339,9 @@ accompanying_course_work:
     action: Action
     create_date: Date de création
     start_date: Date de début
-    results without objective: Résultats - orientation sans objectifs - motifs - dispositifs
-    no_result: Aucun résultat - orientation
-    result: Résultat - orientation
-    goal: Objectifs - motifs - dispositifs
+    end_date: Date de fin
+    results without objective: Aucun objectif - motif -  dispositif
+    no_results: Aucun résultat - orientation
+    results: Résultats - orientations
+    goal: Objectif - motif - dispositif
+