🧠 Pipeline Interactif de Vision par Ordinateur (Morphing Sandbox)

---

Informations Académiques

• Module : Vision par Ordinateur en Milieu Industriel
• Étudiant : Ahmed Chmourk (SDBDIA2)
• Professeur Référent : Pr. Brahim El Khalil Chaouki
• Rapport de Projet PDF : 📄 Télécharger le Rapport PDF

---

🌌 À Propos du Projet

Ce projet est une application de supervision innovante en temps réel mariant le traitement d'images OpenCV et la simulation de physique particulaire (P5.js).

Le système permet de rechercher ou de charger n'importe quelle image à partir du web, d'appliquer séquentiellement un pipeline complet de prétraitement et de filtrage (Grayscale, Flou Gaussien, Binarisation adaptative locale, Détection de Canny et Transformée de Hough), puis d'échantillonner 6000 particules cinétiques autonomes qui viennent s'agglomérer en temps réel pour former la silhouette ou les primitives géométriques extraites !

---

🛠️ Technologies Utilisées

• Backend : Fast API (Python), OpenCV (cv2), NumPy, Uvicorn, Requests
• Frontend : React (Vite), P5.js (Rendu cinétique interactif à 60 FPS), Craig Reynolds Steering Forces (Comportement d'arrivée particulaire), CSS Glassmorphism

---

⚙️ Le Workflow de Vision par Ordinateur (OpenCV Pipeline)

Pour illustrer notre workflow mathématique et algorithmique, nous étudions la structure métallique de la Tour Eiffel. Sa complexité géométrique démontre parfaitement la robustesse de notre pipeline OpenCV.

Étape 1 : Image Initiale / Acquisition BGR

Acquisition de l'image de la Tour Eiffel convertie dans l'espace colorimétrique BGR d'OpenCV.

---

Étape 2 : Prétraitement (Grayscale + Flou Gaussien)

• Niveaux de Gris : Élimine l'information de couleur inutile pour ne conserver que la luminance $\text{Gray} = 0.299 \cdot R + 0.587 \cdot G + 0.114 \cdot B$.
• Flou Gaussien : Convolution avec un noyau de taille $3 \times 3$ ($\sigma = 1$) pour filtrer le bruit haute fréquence du ciel et les pixels isolés.

---

Étape 3 : Binarisation Adaptative (Seuillage Local)

Calcul d'un seuil local adaptatif gaussien pour s'affranchir des variations d'éclairage réelles et des ombres du ciel : $$T(x, y) = \text{Moyenne Gaussienne}(voisinage) - C$$

---

Étape 4 : Détection de Contours de Canny

Extraction du squelette de contours fins de la Tour Eiffel par suppression des non-maxima et seuillage hystérétique (Seuils : 50 et 150).

---

Étape 5 : Détection de Lignes par Transformée de Hough (PPHT)

Extraction des droites et des poutres métalliques principales de soutien de la Tour Eiffel en vert à l'aide de la Transformée de Hough Cumulative Probabiliste.

---

🚀 Comment Lancer le Projet Localement

1. Prérequis

Assurez-vous d'avoir installé Python 3.8+ et Node.js 16+ sur votre machine.

2. Démarrage du Backend (FastAPI)

1. Ouvrez un terminal dans le dossier backend :

   cd backend

2. Installez les dépendances :

   pip install -r requirements.txt

3. Créez un fichier .env si nécessaire pour vos clés de recherche Google, ou laissez-le vide pour utiliser la recherche Wikipédia intégrée par défaut.
4. Lancez le serveur :

   python -m uvicorn main:app --reload --port 8000

Le backend sera accessible sur http://localhost:8000.

3. Démarrage du Frontend (React / Vite)

1. Ouvrez un terminal dans le dossier frontend :

   cd frontend

2. Installez les packages Node :

   npm install

3. Lancez le serveur de développement :

   npm run dev

Le frontend s'ouvrira automatiquement sur http://localhost:5173. Cliquez sur le bouton ⚙️ à gauche de la barre de recherche pour ouvrir le panneau de configuration en temps réel des algorithmes OpenCV !