feat: humanized jumping-jacks hero + regenerated README GIFs

README.md

@@ -19,6 +19,11 @@ as a tiny human-readable language that renders to an animated 3D figure in the b
   <a href="https://github.com/posecode-dev/posecode/tree/main/packages/posecode-mcp"><img src="https://img.shields.io/badge/MCP-Compatible-orange.svg" alt="MCP Compatible"/></a>
 </p>
 
+<p align="center">
+  <img src="docs/media/jumping-jacks.gif" width="440" alt="Jumping jacks rendered live from a .posecode text document"/>
+</p>
+<p align="center"><sub>One <code>.posecode</code> document — <code>shoulders: abduct 160</code>, <code>hips: abduct 30</code>, <code>repeat 12</code> — rendered live in the browser.</sub></p>
+
 <table align="center">
   <tr>
     <td align="center"><img src="docs/media/deadlift.gif" width="230" alt="Deadlift rendered from .posecode text"/><br/><sub><code>pelvis: hinge</code>, deadlift</sub></td>

playground/index.html

@@ -173,20 +173,20 @@ <h1 class="headline">
         <div class="studio">
           <div class="studio-bar" aria-hidden="true">
             <span class="dots"></span>
-            <span class="studio-title">squat.posecode</span>
+            <span class="studio-title">jumping-jacks.posecode</span>
             <span class="studio-live"><i></i>live</span>
           </div>
           <canvas id="hero-canvas"></canvas>
-          <div class="studio-hud"><span id="hero-phase">Descend</span></div>
+          <div class="studio-hud"><span id="hero-phase">Out</span></div>
         </div>
 
         <!-- Overlapping code chip: the text that produces the motion -->
-        <pre class="code-chip" aria-hidden="true"><span class="t-kw">posecode</span> <span class="t-kind">exercise</span> <span class="t-str">"Body-weight squat"</span>
+        <pre class="code-chip" aria-hidden="true"><span class="t-kw">posecode</span> <span class="t-kind">exercise</span> <span class="t-str">"Jumping jacks"</span>
   <span class="t-kw">pose</span> start <span class="t-punct">=</span> <span class="t-atom">standing</span>
 
-  <span class="t-kw">step</span> <span class="t-str">"Descend"</span> <span class="t-num">1.6s</span> <span class="t-atom">ease-in-out</span><span class="t-punct">:</span>
-    <span class="t-joint">hips</span><span class="t-punct">:</span> <span class="t-act">flex</span> <span class="t-num">80</span>
-    <span class="t-joint">knees</span><span class="t-punct">:</span> <span class="t-act">flex</span> <span class="t-num">95</span>
+  <span class="t-kw">step</span> <span class="t-str">"Out"</span> <span class="t-num">0.5s</span> <span class="t-atom">ease-out</span><span class="t-punct">:</span>
+    <span class="t-joint">shoulders</span><span class="t-punct">:</span> <span class="t-act">abduct</span> <span class="t-num">160</span>
+    <span class="t-joint">hips</span><span class="t-punct">:</span> <span class="t-act">abduct</span> <span class="t-num">30</span>
     <span class="t-kw">ground-lock</span><span class="t-punct">:</span> <span class="t-atom">feet</span></pre>
       </div>
     </section>

playground/src/landing.ts

@@ -33,7 +33,10 @@ function initHero(): void {
     viewer.onPhase(({ phaseName }) => {
       if (phaseEl) phaseEl.textContent = phaseName === "reset" ? "" : phaseName;
     });
-    const { ir } = parse(PRESETS[0]!.source); // body-weight squat
+    // Hero movement: jumping jacks. Full-body, symmetric, and cyclical, so it
+    // reads instantly and loops seamlessly through the neutral standing pose.
+    const heroPreset = PRESETS.find((p) => p.id === "jumping-jacks") ?? PRESETS[0]!;
+    const { ir } = parse(heroPreset.source);
     if (ir) {
       viewer.load(ir);
       viewer.setLoop(true);