Enhance SSIM and overall quality plots with dynamic y-axis scaling to emphasize differences. Add area fills for better visualization and update hover templates for improved data presentation. Introduce quality variation indicators in overall quality assessment. Refactor layout for improved user experience and add comprehensive usage guide.

app.py

@@ -1421,6 +1421,7 @@ def create_app():
     with gr.Blocks(
         title="Frame Arena - Video Frame Comparator",
         # theme=gr.themes.Soft(),
+        fill_width=True,
         css="""
         /* Ensure plots adapt to theme */
         .plotly .main-svg {

data.json

@@ -2,20 +2,14 @@
     "comparisons": [
         {
             "videos": [
-                "examples/dog/1.mp4",
-                "examples/dog/2.mp4"
+                "examples/cat_i2v_original.mp4",
+                "examples/cat_i2v_juiced.mp4"
             ]
         },
         {
             "videos": [
-                "examples/dog/2.mp4",
-                "examples/dog/3.mp4"
-            ]
-        },
-        {
-            "videos": [
-                "examples/dog/1.mp4",
-                "examples/dog/3.mp4"
+                "examples/venice_i2v_original.mp4",
+                "examples/venice_i2v_cached.mp4"
             ]
         }
     ]