EN 
Українська
Polski
Español
Deutsch
日本語
Italiano
Português (BR)
Français
العربية
Nederlands
中文
한국어
हिन्दी
Türkçe
Tiếng Việt
Русский
Bahasa Indonesia
فارسی
বাংলা
ไทย
Filipino
Kiswahili
اردو
Bahasa Melayu
தமிழ்
עברית
Ελληνικά
ਪੰਜਾਬੀ
አማርኛ
မြန်မာဘာသာ
ខ្មែរ
ქართული
नेपाली
Монгол хэл
Հայերեն
සිංහල
ລາວ
Čeština
Română
Magyar
Български
Svenska
Dansk
Suomi
Norsk
Slovenčina
Hrvatski🏭 Visual Defect Detector — CNN Quality Inspection Line
Watch a convolutional network scan parts moving down a simulated inspection line, highlighting scratches, dents and misalignment in real time with a live pass/fail rate.
About the Visual Defect Detector
This simulation shows a convolutional network doing the job of a machine-vision quality inspector on a factory line. Metal parts, each represented as a 40×40 grid of pixel intensities with a brushed-metal base texture, travel along a simulated conveyor belt. As each part crosses the inspection line, two fixed 3×3 kernels — a Sobel gradient pair and a Laplacian — are convolved across its pixel grid in real time, producing genuine activation maps. Thresholding those maps and grouping the surviving pixels into connected components yields real bounding boxes, a real pass/fail verdict, and a real confidence score, all derived from the actual convolution output rather than a scripted animation.
Three defect classes are modelled with distinct pixel-level signatures: scratches (thin, darkened line artifacts with a jittered path), dents (circular Gaussian intensity dips with a brightened rim), and misalignment (a hard edge discontinuity offset from where the part's border is expected). Adjust how often each defect is injected, drag the detection sensitivity threshold, switch between the Sobel-only, Laplacian-only and combined detection kernels, and watch the confusion matrix and pass rate respond live as the inspection line runs.
Frequently Asked Questions
What convolution kernels does this simulation actually run over each part?
Every part is represented as a 40×40 grid of grayscale pixel intensities. Two fixed 3×3 kernels are convolved across that grid at every pixel: a Sobel gradient pair (Gx and Gy) whose magnitude √(Gx²+Gy²) responds to sharp intensity edges — the signature of a scratch or a misaligned edge — and a discrete Laplacian [[0,1,0],[1,–4,1],[0,1,0]] whose absolute value responds to localised bumps and dips, the signature of a dent. Both are genuine 2D convolutions computed pixel-by-pixel against real image data generated for that part, not a canned animation.
Why fuse an edge kernel with a blob kernel instead of using just one?
A single kernel type misses whole defect classes. A Sobel edge map lights up brightly on scratches and offset edges (misalignment) but barely reacts to a smooth circular dent, because a dent has a gentle gradient with no sharp linear edge. The Laplacian does the opposite: it reacts strongly to the curvature at the centre of a dent but only weakly to a thin straight scratch line. Taking the pixel-wise maximum of the two normalised maps (a channel-wise max-fusion) means the combined activation map catches all three defect types, which mirrors why real CNNs stack many filters per layer rather than relying on a single learned kernel.
How does the sensitivity slider create a real detection tradeoff?
The activation map is normalised to roughly 0–1 and every pixel above the sensitivity threshold is marked as a candidate defect pixel. Lowering the threshold flags more pixels, catching fainter scratches and shallow dents (higher true-positive rate) but also flagging ordinary brushed-metal texture noise as a false alarm (lower true-negative rate). Raising the threshold does the reverse. The confusion matrix in the side panel updates live as you drag the slider, because each part's raw activation map is stored once and re-thresholded instantly — exactly like the sensitivity/specificity tradeoff behind any real anomaly detector.
Is there an actual trained neural network behind this, or hand-picked weights?
The kernel weights here are fixed and hand-chosen, not learned by gradient descent on labelled defect data. That is a deliberate simplification. What the simulation reproduces faithfully is the forward-pass computation every CNN performs at inference time: convolution → feature-map thresholding → connected-component grouping into bounding boxes → pass/fail decision — the same pipeline a trained defect-detection network runs, just with weights chosen by hand instead of learned from thousands of labelled parts.
How are scratches, dents and misalignment turned into actual pixel data?
Each part starts as a brushed-metal base texture: directional noise plus a faint sinusoidal grain. A scratch is drawn as a thin randomly-angled line whose pixels are darkened along a jittered path with a soft falloff on either side. A dent is a circular Gaussian intensity dip with a slightly brightened rim, mimicking how light catches the raised edge of a real dent. Misalignment is simulated by shifting the part's expected border inward or outward on one side, creating a hard intensity discontinuity inside the frame where the CNN does not expect one. All three are real per-pixel modifications to the grid the convolution actually runs over.
What do the bounding boxes on the inspection panel represent?
After thresholding, the simulation groups adjacent flagged pixels into connected components using a 4-connectivity flood fill (the same core algorithm used for connected-component labelling in real computer-vision pipelines). Components smaller than a minimum pixel count are discarded as noise. Each surviving component's bounding box is drawn over the zoomed part view, and its mean activation feeds directly into the pass/fail decision and the confidence score — so every box on screen corresponds to a real cluster of thresholded convolution output, not a decorative overlay.
What does the pass/fail rate and confusion matrix actually measure?
Each part is generated with a known ground truth (whether a scratch, dent or misalignment was actually injected) and a CNN verdict (pass or fail) derived purely from the thresholded activation map. Comparing the two produces a live confusion matrix: true positives (real defect, correctly failed), false positives (clean part, wrongly failed), true negatives (clean part, correctly passed) and false negatives (real defect, missed). The pass rate is simply passed/total across the running session. Watching these numbers shift as you move the sensitivity slider is the same exercise a quality engineer performs when tuning a real inspection line's alarm threshold.
Why does the detection kernel selector change what gets caught?
Switching the detection kernel between Sobel-only, Laplacian-only and the combined max-fusion changes which activation map actually drives the pass/fail decision, not just what is displayed. With Sobel-only selected, dented parts frequently sail through as false negatives because a smooth dip produces little gradient; with Laplacian-only selected, thin scratches are often missed because their curvature signal is weak. Only the combined map reliably catches all three defect classes at a single threshold, which is the practical reason real inspection CNNs use many convolution channels rather than one filter no matter how well-tuned.
Two fixed 3×3 kernels — Sobel gradient magnitude and a Laplacian — convolve across each part's 40×40 pixel grid, producing a real activation map that is thresholded, grouped into connected components, and turned into bounding boxes, a pass/fail verdict and a confidence score.
3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install