update

Author: han20192019

index.html

@@ -255,10 +255,13 @@ <h2 class="title is-3">Real world experiment - Tool usage</h2>
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Sort by color" autoplay controls muted playsinline>
+          <video id="realworld-tool-usage" title="Real-world tool usage: scene graph-based skill composition" aria-label="Real-world tool usage experiment video" autoplay controls muted playsinline>
             <source src="./static/videos/tool_realworld.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Real-world robot manipulation: tool-usage task executed via scene graph-based atomic skills and skill composition for long-horizon generalization.
+          </p>
         </div>
       </div>
     </div>
@@ -278,13 +281,12 @@ <h2 class="title is-3">Real world experiment - Vegetable picking</h2>
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Cube out and in" autoplay controls muted playsinline>
+          <video id="realworld-vegetable-picking" title="Real-world vegetable picking: skill composition for manipulation" aria-label="Real-world vegetable picking experiment video" autoplay controls muted playsinline>
             <source src="./static/videos/veg_realworld.mp4"
                     type="video/mp4">
           </video>
-          <p>
-          Real-world tool usage experiment demonstrating scene graph-based skill composition 
-          for long-horizon manipulation tasks.
+          <p class="video-caption">
+            Real-world robot vegetable picking demonstrating compositional generalization: scene graph representations focus on task-relevant objects and relations for robust execution.
           </p>
         </div>
       </div>
@@ -307,54 +309,69 @@ <h2 class="title is-3">Simulation experiments</h2>
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Cube out and in" autoplay controls muted playsinline>
+          <video id="sim-cube-out-and-in" title="Simulation: cube out-and-in task" aria-label="Simulation cube out-and-in task video" autoplay controls muted playsinline>
             <source src="./static/videos/sim1.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Simulation: cube out-and-in manipulation task showing scene graph-based atomic skills composed into a multi-step long-horizon policy.
+          </p>
         </div>
       </div>
     </div>
 
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Sort by color" autoplay controls muted playsinline>
+          <video id="sim-sort-by-color" title="Simulation: sort by color" aria-label="Simulation sort-by-color task video" autoplay controls muted playsinline>
             <source src="./static/videos/sim2.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Simulation: sort-by-color task highlighting skill composition under distribution shift, with object-relation reasoning in a scene graph.
+          </p>
         </div>
       </div>
     </div>
 
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Blocks stacking game" autoplay controls muted playsinline>
+          <video id="sim-blocks-stacking" title="Simulation: blocks stacking game" aria-label="Simulation blocks stacking task video" autoplay controls muted playsinline>
             <source src="./static/videos/sim3.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Simulation: block stacking (long-horizon) demonstrating compositional robot learning with diffusion-based imitation learning and graph neural networks.
+          </p>
         </div>
       </div>
     </div>
 
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Tools usage" autoplay controls muted playsinline>
+          <video id="sim-tools-usage" title="Simulation: tools usage" aria-label="Simulation tools usage task video" autoplay controls muted playsinline>
             <source src="./static/videos/sim4.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Simulation: tools-usage task illustrating scene graph-based skill learning and reliable execution when composing multiple atomic manipulation skills.
+          </p>
         </div>
       </div>    
     </div>  
 
     <div class="columns">
       <div class="column is-centered">
         <div class="content has-text-centered">
-          <video id="Obstacle Avoidance" autoplay controls muted playsinline>
+          <video id="sim-obstacle-avoidance" title="Simulation: obstacle avoidance" aria-label="Simulation obstacle avoidance task video" autoplay controls muted playsinline>
             <source src="./static/videos/sim5.mp4"
                     type="video/mp4">
           </video>
+          <p class="video-caption">
+            Simulation: obstacle avoidance with focused scene graphs, improving robustness and compositional generalization for robotic manipulation.
+          </p>
         </div>
       </div>    
     </div>

static/css/index.css

@@ -2,6 +2,11 @@ body {
   font-family: 'Noto Sans', sans-serif;
 }
 
+.video-caption {
+  margin-top: 0.6rem;
+  margin-bottom: 0;
+}
+
 
 .footer .icon-link {
     font-size: 25px;