Deploy professional garment segmentation app with custom UI

.gitattributes

@@ -1,35 +1,8 @@
-*.7z filter=lfs diff=lfs merge=lfs -text
-*.arrow filter=lfs diff=lfs merge=lfs -text
-*.bin filter=lfs diff=lfs merge=lfs -text
-*.bz2 filter=lfs diff=lfs merge=lfs -text
-*.ckpt filter=lfs diff=lfs merge=lfs -text
-*.ftz filter=lfs diff=lfs merge=lfs -text
-*.gz filter=lfs diff=lfs merge=lfs -text
-*.h5 filter=lfs diff=lfs merge=lfs -text
-*.joblib filter=lfs diff=lfs merge=lfs -text
-*.lfs.* filter=lfs diff=lfs merge=lfs -text
-*.mlmodel filter=lfs diff=lfs merge=lfs -text
-*.model filter=lfs diff=lfs merge=lfs -text
-*.msgpack filter=lfs diff=lfs merge=lfs -text
-*.npy filter=lfs diff=lfs merge=lfs -text
-*.npz filter=lfs diff=lfs merge=lfs -text
-*.onnx filter=lfs diff=lfs merge=lfs -text
-*.ot filter=lfs diff=lfs merge=lfs -text
-*.parquet filter=lfs diff=lfs merge=lfs -text
-*.pb filter=lfs diff=lfs merge=lfs -text
-*.pickle filter=lfs diff=lfs merge=lfs -text
-*.pkl filter=lfs diff=lfs merge=lfs -text
-*.pt filter=lfs diff=lfs merge=lfs -text
-*.pth filter=lfs diff=lfs merge=lfs -text
-*.rar filter=lfs diff=lfs merge=lfs -text
+*.jpg filter=lfs diff=lfs merge=lfs -text
+*.jpeg filter=lfs diff=lfs merge=lfs -text
+*.png filter=lfs diff=lfs merge=lfs -text
+*.gif filter=lfs diff=lfs merge=lfs -text
+*.bmp filter=lfs diff=lfs merge=lfs -text
+*.tiff filter=lfs diff=lfs merge=lfs -text
 *.safetensors filter=lfs diff=lfs merge=lfs -text
-saved_model/**/* filter=lfs diff=lfs merge=lfs -text
-*.tar.* filter=lfs diff=lfs merge=lfs -text
-*.tar filter=lfs diff=lfs merge=lfs -text
-*.tflite filter=lfs diff=lfs merge=lfs -text
-*.tgz filter=lfs diff=lfs merge=lfs -text
-*.wasm filter=lfs diff=lfs merge=lfs -text
-*.xz filter=lfs diff=lfs merge=lfs -text
-*.zip filter=lfs diff=lfs merge=lfs -text
-*.zst filter=lfs diff=lfs merge=lfs -text
-*tfevents* filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text

README.md

@@ -1,14 +1,121 @@
 ---
 title: Garment Segmentation
-emoji: ⚡
-colorFrom: yellow
-colorTo: yellow
+emoji: 👗
+colorFrom: purple
+colorTo: pink
 sdk: gradio
-sdk_version: 6.3.0
+sdk_version: 4.0.0
 app_file: app.py
 pinned: false
 license: apache-2.0
-short_description: Garment segmentation model demostration
+tags:
+  - computer-vision
+  - image-segmentation
+  - fashion
+  - virtual-try-on
+  - deepfashion2
+  - pytorch
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# 👗 Garment Segmentation
+
+An AI-powered application for **precise garment extraction** from fashion images, built with a custom U-Net model trained on the DeepFashion2 dataset.
+
+## 🎯 What Does This Do?
+
+This application automatically segments and extracts clothing items (especially upper-body garments) from images. It's perfect for:
+
+- 🛍️ **E-commerce**: Isolate product images from backgrounds
+- 👔 **Virtual Try-On**: Extract garments for AR/VR applications
+- 🎨 **Fashion Design**: Quick garment isolation for mood boards
+- 📊 **Dataset Preprocessing**: Prepare fashion datasets for ML tasks
+- ✂️ **Background Removal**: Clean product photos automatically
+
+## 🚀 Features
+
+- **High Accuracy**: 89.64% validation IoU on DeepFashion2
+- **Fast Inference**: Real-time segmentation with GPU support
+- **Multiple Outputs**: Overlay, extracted garment, and binary mask
+- **Adjustable Threshold**: Fine-tune segmentation sensitivity
+- **Easy to Use**: Drag-and-drop interface powered by Gradio
+
+## 🔧 How It Works
+
+1. **Upload** a fashion image (preferably with visible upper-body clothing)
+2. **Adjust** the confidence threshold if needed (default: 0.5)
+3. **Get** three outputs:
+   - 🎨 **Overlay**: Original image with highlighted garment area
+   - ✂️ **Extracted**: Isolated garment on black background
+   - 🎭 **Mask**: Binary segmentation mask
+
+## 🧠 Model Details
+
+- **Architecture**: U-Net with ResNet50 encoder
+- **Custom Decoder**: (256, 128, 64, 32, 16) channels
+- **Input Size**: 768 × 768 pixels
+- **Training Dataset**: DeepFashion2
+- **Framework**: PyTorch Lightning + segmentation_models_pytorch
+- **Performance**: 89.64% validation IoU @ epoch 45
+
+### Model Repository
+🤗 [zyuzuguldu/garment-segmentation-unet-resnet50](https://huggingface.co/zyuzuguldu/garment-segmentation-unet-resnet50)
+
+## 📊 Performance
+
+| Metric | Value |
+|--------|-------|
+| Validation IoU | **89.64%** |
+| Inference Time (GPU) | ~50-100ms |
+| Input Resolution | 768×768 |
+
+## 💡 Tips for Best Results
+
+- Use clear, well-lit photos with visible garments
+- Works best with **upper-body clothing** (shirts, dresses, jackets, etc.)
+- For tight/loose masks, adjust the confidence threshold:
+  - **Lower threshold** (0.3-0.4): More inclusive, captures more area
+  - **Higher threshold** (0.6-0.7): More conservative, tighter mask
+- Front-facing or slightly angled photos work best
+
+## 🛠️ Technical Stack
+
+- **Framework**: [Gradio](https://gradio.app) 4.0
+- **Deep Learning**: PyTorch 2.0+
+- **Segmentation Library**: [segmentation_models_pytorch](https://github.com/qubvel/segmentation_models.pytorch)
+- **Model Format**: SafeTensors for efficient loading
+- **Deployment**: Hugging Face Spaces
+
+## 📝 Use Cases
+
+### 1. E-commerce Product Editing
+Remove backgrounds from product photos automatically for cleaner catalog images.
+
+### 2. Virtual Try-On Applications
+Extract garment masks for AR/VR try-on experiences.
+
+### 3. Fashion Dataset Curation
+Preprocess and clean fashion datasets for machine learning projects.
+
+### 4. Creative Design Tools
+Quickly isolate clothing items for fashion mood boards and design workflows.
+
+## 🔗 Links
+
+- 📦 **Model Repository**: [HuggingFace Model Hub](https://huggingface.co/zyuzuguldu/garment-segmentation-unet-resnet50)
+- 🐙 **GitHub**: [zyuzuguldu](https://github.com/zyuzuguldu)
+- 🎓 **Training Dataset**: [DeepFashion2](https://github.com/switchablenorms/DeepFashion2)
+
+## 📄 License
+
+This project is licensed under the **Apache 2.0 License** - see the LICENSE file for details.
+
+## 🙏 Acknowledgments
+
+- DeepFashion2 dataset creators
+- segmentation_models_pytorch library
+- Hugging Face for hosting infrastructure
+- Gradio for the amazing UI framework
+
+---
+
+**Made with ❤️ for the fashion-tech community**

SETUP_INSTRUCTIONS.md

@@ -0,0 +1,173 @@
+# 🚀 Setup Instructions for Hugging Face Space
+
+Follow these steps to deploy your Garment Segmentation app to Hugging Face Spaces.
+
+## 📋 Prerequisites
+
+1. Hugging Face account
+2. Git installed locally
+3. Git LFS installed (for large files)
+4. Your model uploaded to HuggingFace Hub
+
+## 🔧 Step-by-Step Deployment
+
+### 1. Clone Your Space Repository
+
+```bash
+cd /home/sylar/PycharmProjects/Virtual-Try-On
+git clone https://huggingface.co/spaces/zyuzuguldu/garment-segmentation
+cd garment-segmentation
+```
+
+### 2. Copy Application Files
+
+```bash
+# Copy all files from gradio_app directory
+cp ../gradio_app/app.py .
+cp ../gradio_app/requirements.txt .
+cp ../gradio_app/README.md .
+cp ../gradio_app/.gitattributes .
+```
+
+### 3. Add Example Images (Optional but Recommended)
+
+```bash
+# Create examples directory
+mkdir -p examples
+
+# Copy 3-5 good example images from your dataset or test set
+# Recommended: clear photos with visible garments, different angles/styles
+cp /path/to/your/example1.jpg examples/fashion1.jpg
+cp /path/to/your/example2.jpg examples/fashion2.jpg
+cp /path/to/your/example3.jpg examples/fashion3.jpg
+```
+
+**Tips for example images:**
+- Choose diverse garment types (shirts, dresses, jackets)
+- Include different colors and patterns
+- Use high-quality, well-lit photos
+- Size: Keep under 2MB each for fast loading
+
+### 4. Initialize Git LFS (for image files)
+
+```bash
+git lfs install
+```
+
+### 5. Add and Commit Files
+
+```bash
+# Add all files
+git add .
+
+# Commit with descriptive message
+git commit -m "Initial deployment: Garment segmentation Gradio app"
+```
+
+### 6. Push to Hugging Face
+
+```bash
+# Push to the space
+git push
+```
+
+### 7. Wait for Build
+
+- Go to https://huggingface.co/spaces/zyuzuguldu/garment-segmentation
+- The Space will automatically build and deploy (takes 2-5 minutes)
+- Watch the build logs for any errors
+
+## 🎨 Customization Options
+
+### Update Model Repository
+Edit `app.py` line 14:
+```python
+MODEL_REPO_ID = "your-username/your-model-name"
+```
+
+### Change Theme
+Edit `app.py` line 192:
+```python
+with gr.Blocks(css=custom_css, theme=gr.themes.Soft()):  # Try: Monochrome, Glass, etc.
+```
+
+### Adjust Input Size
+Edit `app.py` line 13:
+```python
+INPUT_SIZE = 768  # Change to 512, 1024, etc.
+```
+
+### Modify CSS Styling
+Edit the `custom_css` variable in `app.py` (lines 95-130) to customize colors, fonts, and layout.
+
+## 🐛 Troubleshooting
+
+### Build Fails
+- Check `requirements.txt` for correct package versions
+- Ensure your model repository exists and is public
+- Check Space build logs for specific errors
+
+### Out of Memory
+- Reduce `INPUT_SIZE` to 512 or 384
+- Request a Space upgrade (Settings → Hardware)
+
+### Examples Not Working
+- Ensure example images are in `examples/` folder
+- Update paths in `app.py` line 243 to match your image names
+- Set `cache_examples=False` if images are large
+
+### Slow Loading
+- Optimize example images (compress to <500KB)
+- Consider using GPU hardware (Settings → Hardware → T4 small)
+
+## 📦 Alternative: Quick Deploy Script
+
+```bash
+#!/bin/bash
+# quick_deploy.sh
+
+cd /home/sylar/PycharmProjects/Virtual-Try-On
+
+# Clone space
+git clone https://huggingface.co/spaces/zyuzuguldu/garment-segmentation
+cd garment-segmentation
+
+# Copy files
+cp ../gradio_app/{app.py,requirements.txt,README.md,.gitattributes} .
+
+# Create examples directory
+mkdir -p examples
+
+# TODO: Add your example images here
+# cp /path/to/example1.jpg examples/fashion1.jpg
+# cp /path/to/example2.jpg examples/fashion2.jpg
+# cp /path/to/example3.jpg examples/fashion3.jpg
+
+# Git setup
+git lfs install
+git add .
+git commit -m "Deploy garment segmentation app"
+git push
+
+echo "✅ Deployment complete! Check your Space in 2-5 minutes."
+```
+
+Save this as `quick_deploy.sh`, make it executable with `chmod +x quick_deploy.sh`, and run it.
+
+## 🎉 Post-Deployment
+
+1. **Test Your App**: Try uploading different images
+2. **Share Your Space**: Get the public URL from the Space page
+3. **Monitor Usage**: Check Space analytics and logs
+4. **Iterate**: Update files and push again to redeploy
+
+## 🔗 Useful Links
+
+- [Gradio Docs](https://www.gradio.app/docs)
+- [HF Spaces Docs](https://huggingface.co/docs/hub/spaces)
+- [Your Space](https://huggingface.co/spaces/zyuzuguldu/garment-segmentation)
+- [Your Model](https://huggingface.co/zyuzuguldu/garment-segmentation-unet-resnet50)
+
+---
+
+Need help? Open an issue or reach out on the Hugging Face forums!

app.py

@@ -0,0 +1,304 @@
+import gradio as gr
+import torch
+import cv2
+import numpy as np
+import segmentation_models_pytorch as smp
+from safetensors.torch import load_file
+from huggingface_hub import hf_hub_download
+from PIL import Image
+import matplotlib.pyplot as plt
+
+# Configuration
+MODEL_REPO_ID = "zyuzuguldu/garment-segmentation-unet-resnet50"
+INPUT_SIZE = 768
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+
+# Cache the model globally
+model = None
+
+def load_model():
+    """Load the segmentation model from HuggingFace Hub."""
+    global model
+    if model is None:
+        print("📥 Downloading model from HuggingFace Hub...")
+        model_path = hf_hub_download(
+            repo_id=MODEL_REPO_ID,
+            filename="model.safetensors"
+        )
+
+        print("🔨 Building model architecture...")
+        model = smp.Unet(
+            encoder_name="resnet50",
+            classes=1,
+            activation=None,
+            decoder_channels=(256, 128, 64, 32, 16)
+        )
+
+        print("⚡ Loading weights...")
+        state_dict = load_file(model_path)
+        model.load_state_dict(state_dict)
+        model.to(DEVICE)
+        model.eval()
+        print("✅ Model loaded successfully!")
+
+    return model
+
+def preprocess_image(image):
+    """Preprocess image for model inference."""
+    # Convert PIL to numpy
+    if isinstance(image, Image.Image):
+        image = np.array(image)
+
+    # Ensure RGB
+    if len(image.shape) == 2:
+        image = cv2.cvtColor(image, cv2.COLOR_GRAY2RGB)
+    elif image.shape[2] == 4:
+        image = cv2.cvtColor(image, cv2.COLOR_RGBA2RGB)
+
+    # Store original size
+    original_size = image.shape[:2]
+
+    # Resize to model input size
+    image_resized = cv2.resize(image, (INPUT_SIZE, INPUT_SIZE))
+
+    # Normalize (ImageNet stats)
+    mean = np.array([0.485, 0.456, 0.406])
+    std = np.array([0.229, 0.224, 0.225])
+    image_normalized = (image_resized / 255.0 - mean) / std
+
+    # Convert to tensor: (H, W, C) -> (1, C, H, W)
+    image_tensor = torch.from_numpy(image_normalized).float().permute(2, 0, 1).unsqueeze(0)
+
+    return image_tensor, original_size, image
+
+def postprocess_mask(mask_logits, original_size, threshold=0.5):
+    """Postprocess model output to binary mask."""
+    # Apply sigmoid and threshold
+    mask_prob = torch.sigmoid(mask_logits).squeeze().cpu().numpy()
+    mask_binary = (mask_prob > threshold).astype(np.uint8)
+
+    # Resize back to original size
+    mask_resized = cv2.resize(mask_binary, (original_size[1], original_size[0]),
+                              interpolation=cv2.INTER_NEAREST)
+
+    return mask_resized, mask_prob
+
+def create_overlay(image, mask, alpha=0.6):
+    """Create an overlay visualization of mask on image."""
+    # Create colored mask (cyan/turquoise color)
+    colored_mask = np.zeros_like(image)
+    colored_mask[:, :, 0] = mask * 0      # Red channel
+    colored_mask[:, :, 1] = mask * 255    # Green channel
+    colored_mask[:, :, 2] = mask * 255    # Blue channel
+
+    # Blend with original image
+    overlay = cv2.addWeighted(image, 1, colored_mask, alpha, 0)
+
+    return overlay
+
+def extract_garment(image, mask):
+    """Extract garment using the mask (black background)."""
+    # Ensure mask is 3-channel
+    mask_3ch = np.stack([mask] * 3, axis=-1)
+
+    # Apply mask to image
+    extracted = image * mask_3ch
+
+    return extracted
+
+def segment_garment(image, threshold=0.5, show_overlay=True):
+    """Main segmentation function."""
+    # Load model
+    model = load_model()
+
+    # Preprocess
+    image_tensor, original_size, original_image = preprocess_image(image)
+    image_tensor = image_tensor.to(DEVICE)
+
+    # Inference
+    with torch.no_grad():
+        mask_logits = model(image_tensor)
+
+    # Postprocess
+    mask_binary, mask_prob = postprocess_mask(mask_logits, original_size, threshold)
+
+    # Resize probability map for visualization
+    mask_prob_resized = cv2.resize(mask_prob, (original_size[1], original_size[0]))
+
+    # Create visualizations
+    if show_overlay:
+        overlay = create_overlay(original_image, mask_binary)
+        extracted = extract_garment(original_image, mask_binary)
+        return overlay, extracted, (mask_binary * 255).astype(np.uint8)
+    else:
+        extracted = extract_garment(original_image, mask_binary)
+        return (mask_binary * 255).astype(np.uint8), extracted, overlay
+
+# Custom CSS for better styling
+custom_css = """
+#title {
+    text-align: center;
+    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    font-size: 3em;
+    font-weight: bold;
+    margin-bottom: 0.5em;
+}
+
+#description {
+    text-align: center;
+    font-size: 1.2em;
+    color: #666;
+    margin-bottom: 2em;
+}
+
+#model-info {
+    background: #f8f9fa;
+    padding: 1.5em;
+    border-radius: 10px;
+    margin: 1em 0;
+}
+
+.performance-badge {
+    background: #28a745;
+    color: white;
+    padding: 0.3em 0.8em;
+    border-radius: 15px;
+    font-weight: bold;
+    display: inline-block;
+    margin: 0.2em;
+}
+
+footer {
+    text-align: center;
+    margin-top: 2em;
+    padding: 1em;
+    color: #888;
+}
+"""
+
+# Create Gradio Interface
+with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as demo:
+
+    # Header
+    gr.Markdown("<h1 id='title'>👗 Garment Segmentation</h1>")
+    gr.Markdown(
+        "<p id='description'>AI-powered garment extraction for fashion and virtual try-on applications</p>"
+    )
+
+    # Model Information
+    with gr.Accordion("📊 Model Information", open=False):
+        gr.Markdown("""
+        <div id='model-info'>
+
+        ### Architecture
+        - **Model**: U-Net with ResNet50 encoder
+        - **Input Size**: 768 × 768 pixels
+        - **Training Dataset**: DeepFashion2
+        - **Performance**: <span class='performance-badge'>Val IoU: 89.64%</span>
+
+        ### Key Features
+        - 🎯 High-precision garment segmentation
+        - ⚡ Fast inference (GPU-accelerated)
+        - 🎨 Multiple visualization options
+        - 🔧 Adjustable confidence threshold
+
+        ### Use Cases
+        - Virtual try-on applications
+        - Fashion e-commerce product editing
+        - Garment dataset preprocessing
+        - Clothing item extraction and isolation
+
+        </div>
+        """)
+
+    # Main Interface
+    with gr.Row():
+        with gr.Column(scale=1):
+            input_image = gr.Image(
+                label="📤 Upload Image",
+                type="pil",
+                height=400
+            )
+
+            threshold = gr.Slider(
+                minimum=0.1,
+                maximum=0.9,
+                value=0.5,
+                step=0.05,
+                label="🎚️ Confidence Threshold",
+                info="Adjust to refine the segmentation mask"
+            )
+
+            submit_btn = gr.Button("🚀 Segment Garment", variant="primary", size="lg")
+
+            gr.Markdown("### 💡 Tips:")
+            gr.Markdown("""
+            - Upload clear photos with visible garments
+            - Works best with upper-body clothing
+            - Adjust threshold if mask is too loose/tight
+            - Try different angles for best results
+            """)
+
+        with gr.Column(scale=2):
+            gr.Markdown("### 📊 Results")
+
+            with gr.Row():
+                output_overlay = gr.Image(
+                    label="🎨 Overlay (Mask + Original)",
+                    height=300
+                )
+                output_extracted = gr.Image(
+                    label="✂️ Extracted Garment",
+                    height=300
+                )
+
+            output_mask = gr.Image(
+                label="🎭 Binary Mask",
+                height=300
+            )
+
+    # Examples
+    gr.Markdown("### 🖼️ Try These Examples")
+    gr.Examples(
+        examples=[
+            ["examples/fashion1.jpg", 0.5],
+            ["examples/fashion2.jpg", 0.5],
+            ["examples/fashion3.jpg", 0.5],
+        ],
+        inputs=[input_image, threshold],
+        outputs=[output_overlay, output_extracted, output_mask],
+        fn=segment_garment,
+        cache_examples=False,
+    )
+
+    # Event handlers
+    submit_btn.click(
+        fn=segment_garment,
+        inputs=[input_image, threshold],
+        outputs=[output_overlay, output_extracted, output_mask]
+    )
+
+    # Auto-run on image upload
+    input_image.change(
+        fn=segment_garment,
+        inputs=[input_image, threshold],
+        outputs=[output_overlay, output_extracted, output_mask]
+    )
+
+    # Footer
+    gr.Markdown("""
+    <footer>
+    <hr>
+    <p>
+        Built with ❤️ using <a href="https://gradio.app">Gradio</a> |
+        Model: <a href="https://huggingface.co/zyuzuguldu/garment-segmentation-unet-resnet50">garment-segmentation-unet-resnet50</a> |
+        <a href="https://github.com/zyuzuguldu">GitHub</a>
+    </p>
+    </footer>
+    """)
+
+# Launch the app
+if __name__ == "__main__":
+    demo.launch()

requirements.txt

@@ -0,0 +1,10 @@
+gradio>=4.0.0
+torch>=2.0.0
+torchvision>=0.15.0
+segmentation-models-pytorch
+opencv-python-headless
+numpy
+pillow
+safetensors
+huggingface-hub
+matplotlib