| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>WaferSAGE VQA Dashboard</title> |
| <link rel="stylesheet" href="style.css"> |
| </head> |
| <body> |
| <header class="dashboard-header"> |
| <div class="header-title"> |
| <h1>WaferSAGE-Wafermap-VQA</h1> |
| <span class="badge">Gemma-3 VLM Fine-Tuned</span> |
| </div> |
| <div class="header-metrics"> |
| <div class="metric-card"> |
| <span class="metric-label">Dataset Size</span> |
| <span class="metric-value" id="dataset-size">15.3k Rows</span> |
| </div> |
| <div class="metric-card"> |
| <span class="metric-label">Quality Lift</span> |
| <span class="metric-value highlight">+5.0%</span> |
| </div> |
| </div> |
| </header> |
|
|
| <main class="dashboard-grid"> |
| |
| <section class="panel image-panel"> |
| <h2>Wafer Map Inspection</h2> |
| <div class="selector-container"> |
| <label for="record-select">Select Test Record:</label> |
| <select id="record-select" onchange="updateDashboardView()"> |
| <option value="">Loading dataset records...</option> |
| </select> |
| </div> |
| <div class="image-container"> |
| <img id="wafer-image" src="" alt="Wafer Map Preview"> |
| </div> |
| <div class="metadata-box"> |
| <p><strong>Record ID:</strong> <span id="record-id">-</span></p> |
| <p><strong>Ground Truth Label:</strong> <span id="ground-label">-</span></p> |
| </div> |
| </section> |
|
|
| |
| <section class="analysis-column"> |
| <div class="panel"> |
| <h3>Defect Classification & Morphology</h3> |
| <p id="morphology-text" class="analysis-content">Select a record to view morphological analysis...</p> |
| </div> |
|
|
| <div class="panel"> |
| <h3>Spatial Signature & Distribution</h3> |
| <p id="spatial-text" class="analysis-content">Select a record to view spatial analysis...</p> |
| </div> |
|
|
| <div class="panel"> |
| <h3>Root Cause & Process Hypotheses</h3> |
| <p id="root-cause-text" class="analysis-content">Select a record to view root-cause analysis...</p> |
| </div> |
| </section> |
| </main> |
|
|
| <script src="app.js"></script> |
| </body> |
| </html> |
