Update app.py

app.py

@@ -36,111 +36,132 @@ def apply_passion(raw: dict, passion: float) -> dict:
 # ------------------------------------------------------------
 # Valence–Arousal Visualization (2D Projection)
 # ------------------------------------------------------------
-def generate_scatter(raw, amplified, cinematic, label, passion, drama):
+def generate_scatter(raw, amplified, cinematic, target, target_name, passion, drama):
 
-    fig, ax = plt.subplots(figsize=(6, 6))
+    fig, ax = plt.subplots(figsize=(6, 7))  # slightly taller
+    plt.subplots_adjust(right=0.75)  # leave room for legend
 
-    base_color = "#2C3E50"  # neutral deep tone
-
-    # Plot cinematic anchors faintly
-    for _, preset in EMOTION_PRESETS.items():
+    # ----------------------------------
+    # Background Anchors
+    # ----------------------------------
+    for name, preset in EMOTION_PRESETS.items():
         t = preset["target"]
-        ax.scatter(t["V"], t["A"], alpha=0.1, s=90, color="#BBBBBB")
+        ax.scatter(t["V"], t["A"], alpha=0.06, s=90, color="#DDDDDD")
+
+    # ----------------------------------
+    # Trajectory Points (Styled)
+    # ----------------------------------
 
-    # Natural
+    # 1️⃣ Natural — light grey thin border
     ax.scatter(
         raw["V"], raw["A"],
         s=180,
-        facecolor=base_color,
-        alpha=0.5,
-        label="Natural (Extraction)"
+        facecolor="#F0F0F0",
+        edgecolor="#CCCCCC",
+        linewidth=1,
+        label="Natural"
     )
 
-    # After Passion
+    # 2️⃣ After Passion — medium grey
     ax.scatter(
         amplified["V"], amplified["A"],
         s=180,
-        facecolors="none",
-        edgecolors=base_color,
-        linewidth=2,
-        label="After Passion (Radial Gain)"
+        facecolor="#9E9E9E",
+        edgecolor="#666666",
+        linewidth=1.5,
+        label="After Passion"
     )
 
-    # After Drama
+    # 3️⃣ After Drama — dark grey thin border
     ax.scatter(
         cinematic["V"], cinematic["A"],
         s=220,
-        facecolor=base_color,
+        facecolor="#2F2F2F",
         edgecolor="black",
-        linewidth=1.5,
-        alpha=0.9,
-        label="After Drama (Cinematic Alignment)"
+        linewidth=1,
+        label="After Drama"
     )
 
-    # Arrow 1 — Raw → Amplified
-    ax.arrow(
-        raw["V"],
-        raw["A"],
-        amplified["V"] - raw["V"],
-        amplified["A"] - raw["A"],
-        head_width=0.02,
-        length_includes_head=True,
-        color=base_color,
-        linestyle="--",
-        linewidth=2,
-        alpha=0.6
-    )
-
-    # Arrow 2 — Amplified → Cinematic
-    ax.arrow(
-        amplified["V"],
-        amplified["A"],
-        cinematic["V"] - amplified["V"],
-        cinematic["A"] - amplified["A"],
-        head_width=0.02,
-        length_includes_head=True,
-        color=base_color,
-        linestyle="-",
-        linewidth=2,
-        alpha=0.9
+    # Cinematic Anchor
+    ax.scatter(
+        target["V"],
+        target["A"],
+        s=180,
+        marker="X",
+        color="#E74C3C",
+        edgecolor="black",
+        linewidth=1.2,
+        label=f"Anchor ({target_name})"
     )
 
     # ----------------------------------
-    # Dynamic Zoom (Centered + 20% Padding)
+    # Dynamic Zoom (20% padded)
     # ----------------------------------
-    xs = [raw["V"], amplified["V"], cinematic["V"]]
-    ys = [raw["A"], amplified["A"], cinematic["A"]]
+    xs = [raw["V"], amplified["V"], cinematic["V"], target["V"]]
+    ys = [raw["A"], amplified["A"], cinematic["A"], target["A"]]
 
     min_x, max_x = min(xs), max(xs)
     min_y, max_y = min(ys), max(ys)
 
     span_x = max_x - min_x
     span_y = max_y - min_y
-
-    # Use the larger span to keep square framing
     span = max(span_x, span_y)
-
-    # Avoid zero-span collapse
     span = max(span, 0.05)
 
-    padding = span * 0.20  # 20% larger
-
+    padding = span * 0.20
     center_x = (min_x + max_x) / 2
     center_y = (min_y + max_y) / 2
 
+    # shift center slightly upward
+    center_y += span * 0.10
+
     half_range = (span / 2) + padding
 
     ax.set_xlim(center_x - half_range, center_x + half_range)
     ax.set_ylim(center_y - half_range, center_y + half_range)
 
     ax.set_aspect('equal', adjustable='box')
-    
+
+    # ----------------------------------
+    # Proportional Arrows
+    # ----------------------------------
+    arrow_head = span * 0.035
+
+    ax.arrow(
+        raw["V"], raw["A"],
+        amplified["V"] - raw["V"],
+        amplified["A"] - raw["A"],
+        head_width=arrow_head,
+        length_includes_head=True,
+        color="#888888",
+        linestyle="--",
+        linewidth=1.8,
+        alpha=0.7
+    )
+
+    ax.arrow(
+        amplified["V"], amplified["A"],
+        cinematic["V"] - amplified["V"],
+        cinematic["A"] - amplified["A"],
+        head_width=arrow_head,
+        length_includes_head=True,
+        color="#444444",
+        linestyle="-",
+        linewidth=2,
+        alpha=0.9
+    )
+
+    # ----------------------------------
+    # Labels & Legend
+    # ----------------------------------
     ax.set_xlabel("Valence")
     ax.set_ylabel("Arousal")
-    ax.set_title(f"{label}\nPassion={round(passion,2)} | Drama={round(drama,2)}")
+    ax.set_title(f"{target_name}\nPassion={round(passion,2)} | Drama={round(drama,2)}")
 
-    ax.legend(loc="lower right")
-    ax.grid(alpha=0.15)
+    ax.grid(alpha=0.12)
+
+    # Move legend outside plot
+    ax.legend(loc="center left", bbox_to_anchor=(1.02, 0.5), frameon=False)
 
     plt.tight_layout()
     return fig
@@ -163,7 +184,15 @@ def run_pipeline(preset_name, passion, drama):
     color_params = infer_color(cinematic)
     color_block = render_color(color_params)
 
-    fig = generate_scatter(natural, amplified, cinematic, preset_name, passion, drama)
+    fig = generate_scatter(
+        natural,
+        amplified,
+        cinematic,
+        target,
+        preset_name,
+        passion,
+        drama
+    )
 
     return (
         text,
@@ -184,9 +213,6 @@ with gr.Blocks(title="Affection 👁️ — Edge Emotional Intelligence") as dem
     gr.Markdown("# Affection 👁️")
     gr.Markdown("## Simulation Layer for an Edge AI Emotional Robotics System")
 
-    # ---------------------------
-    # Robot Speech
-    # ---------------------------
     gr.Markdown("### 🗣 Robot Speech")
 
     preset_selector = gr.Radio(
@@ -199,87 +225,24 @@ with gr.Blocks(title="Affection 👁️ — Edge Emotional Intelligence") as dem
 
     gr.Markdown("---")
 
-    # ---------------------------
-    # Edge Affect Processing
-    # ---------------------------
-    gr.Markdown("### ⚡ Edge Affect Processing — NVIDIA Jetson Orin Nano")
-
-    gr.Markdown(
-        """
-This section provides a simplified visualization of a more complex on-device architecture.
-
-In hardware deployment, the NVIDIA Jetson Orin Nano performs all of the following:  
-
-• Robot hardware daemon service  
-• Interactive conversational application  
-• Real-time transcript ingestion   
-• VAD extraction (NRC-VAD lexicon)   
-• Structural language metrics (Complexity + Coherence)   
-• Radial emotional amplification (Passion)  
-• Cinematic nearest-exemplar alignment (Drama)  
-• Dual-timescale blending (fast burst + slow baseline via Nemotron/Ollama)  
-• Continuous emotional state streaming for display on an expression module  
-
-This demo isolates a single loop transformation for clarity.
-
-Our NVIDIA edge device is capable of running this loop 200x per second.
-        """
-    )
+    gr.Markdown("### ⚡ Edge Affect Processing")
 
     with gr.Row():
-        passion = gr.Slider(
-            minimum=0.0,
-            maximum=3.0,
-            value=2.25,
-            step=0.1,
-            label="Passion (Radial Emotional Amplification)"
-        )
-
-        drama = gr.Slider(
-            minimum=0.0,
-            maximum=1.5,
-            value=0.65,
-            step=0.05,
-            label="Drama (Cinematic Alignment)"
-        )
+        passion = gr.Slider(0.0, 3.0, value=2.25, step=0.1, label="Passion")
+        drama = gr.Slider(0.0, 1.5, value=0.65, step=0.05, label="Drama")
 
     with gr.Row():
-        natural_output = gr.JSON(label="Natural VAD+CC")
+        natural_output = gr.JSON(label="Natural")
         amplified_output = gr.JSON(label="After Passion")
         cinematic_output = gr.JSON(label="After Drama")
 
     scatter_output = gr.Plot(label="Valence–Arousal Projection")
 
-    gr.Markdown(
-        """
-**Note:**  
-This plot shows a 2D Valence–Arousal projection for visualization only, but results are from the actual model.  
-Actual transformation and color inference are more complex and operate on the full 5D VAD+CC vector.
-        """
-    )
-
     gr.Markdown("---")
 
-    # ---------------------------
-    # Emotional Expression
-    # ---------------------------
     gr.Markdown("### 💡 Emotional Expression")
 
-    gr.Markdown(
-        """
-The finalized VAD+CC vector is transmitted to an expressive display module. In this example, we are converting to colors to be used for eyes.
-
-The module does not compute emotion.  
-It receives the 5D emotional state and runs a trained neural model to convert it into expressive color.
-
-Model used here (same as deployment):  
-https://huggingface.co/danielritchie/vibe-color-model
-
-VAD+CC (Affect Engine) → Embedded Model → Color Rendering (Expression)
-        """
-    )
-
-    rgb_output = gr.JSON(label="Model Output (RGB + Expressive Parameters)")
+    rgb_output = gr.JSON(label="Model Output")
     color_display = gr.HTML(label="Rendered Expression")
 
     outputs = [
@@ -298,4 +261,4 @@ VAD+CC (Affect Engine) → Embedded Model → Color Rendering (Expression)
 
     demo.load(fn=run_pipeline, inputs=[preset_selector, passion, drama], outputs=outputs)
 
-demo.launch(server_name="0.0.0.0", server_port=7860)
+demo.launch(server_name="0.0.0.0", server_port=7860)