Update app.py

app.py

@@ -6,16 +6,16 @@ import gradio as gr
 import traceback
 
 # -----------------------------
-# 1. YOLO model path
+# 1. YOLO model
 # -----------------------------
 YOLO_MODEL_PATH = "best.pt"
 yolo_model = YOLO(YOLO_MODEL_PATH)
 yolo_model.eval()
 
 # -----------------------------
-# 2. Reference alphabet image
+# 2. Reference alphabet image (WebP)
 # -----------------------------
-REFERENCE_IMAGE_PATH = "asl_alphabet.webp"  # Web-friendly format
+REFERENCE_IMAGE_PATH = "asl_alphabet.webp"
 reference_img = cv2.imread(REFERENCE_IMAGE_PATH)
 reference_img = cv2.cvtColor(reference_img, cv2.COLOR_BGR2RGB)
 
@@ -29,7 +29,6 @@ def predict_asl(image):
         
         img = image.copy()
 
-        # YOLO prediction
         results = yolo_model.predict(img, imgsz=320, verbose=False)[0]
         pred_idx = results.probs.top1
         pred_label = results.names[pred_idx]
@@ -47,10 +46,7 @@ def predict_asl(image):
             cv2.LINE_AA
         )
 
-        # Combine uploaded image and reference alphabet side by side
-        combined_img = np.hstack([cv2.cvtColor(img, cv2.COLOR_BGR2RGB), reference_img])
-
-        return combined_img, pred_label, round(confidence, 2)
+        return cv2.cvtColor(img, cv2.COLOR_BGR2RGB), pred_label, round(confidence, 2)
 
     except Exception as e:
         print("❌ Error in predict_asl:", e)
@@ -58,23 +54,29 @@ def predict_asl(image):
         return image, "Error", 0.0
 
 # -----------------------------
-# 4. Gradio Interface
+# 4. Gradio Layout
 # -----------------------------
-title = "🖐️ ASL Letter Classifier"
-description = "Upload a hand sign image and compare it with the full ASL alphabet."
+with gr.Blocks() as demo:
+    gr.Markdown("## 🖐️ ASL Letter Classifier")
+    gr.Markdown("Upload a hand sign image and see the predicted letter and confidence. The full ASL alphabet is always shown on the left as a reference.")
 
-iface = gr.Interface(
-    fn=predict_asl,
-    inputs=gr.Image(type="numpy", label="Upload your ASL Letter"),
-    outputs=[
-        gr.Image(type="numpy", label="Your Image with Prediction & Alphabet Reference"),
-        gr.Textbox(label="Predicted Letter"),
-        gr.Textbox(label="Confidence")
-    ],
-    title=title,
-    description=description,
-    allow_flagging="never"
-)
+    with gr.Row():
+        # Left column: reference alphabet
+        with gr.Column(scale=1):
+            gr.Image(value=reference_img, type="numpy", label="ASL Alphabet Reference")
+        
+        # Right column: upload & prediction
+        with gr.Column(scale=2):
+            input_image = gr.Image(type="numpy", label="Upload your ASL Letter")
+            output_image = gr.Image(type="numpy", label="Prediction")
+            pred_text = gr.Textbox(label="Predicted Letter")
+            confidence_text = gr.Textbox(label="Confidence")
+            
+            input_image.change(
+                fn=predict_asl,
+                inputs=input_image,
+                outputs=[output_image, pred_text, confidence_text]
+            )
 
 if __name__ == "__main__":
-    iface.launch(share=True)
+    demo.launch(share=True)