Inspiration
In modern automotive manufacturing, even the smallest misalignment of a part can cascade into wasted materials, costly rework, or performance issues down the line. During MHacks, we wanted to tackle this problem by combining computer vision with human-centered feedback. We were inspired by the way cameras guide us to take a perfect photo — and asked, “What if Ford assembly workers could get that same intuitive guidance to achieve perfect alignment in real time?” That idea became FordSight, a tool to help ensure precision and quality on the factory floor.
What it does
FordSight compares a master reference image with a current live image of a part during assembly. It then analyzes five key factors: Contrast – checks whether lighting conditions are suitable for inspection. Focus/Sharpness – ensures the camera is capturing fine detail clearly. Position/Orientation – detects whether the part is shifted left, right, up, or down. Zoom/Scale – verifies if the part is too close or too far. Angle/Rotation – flags whether the part is tilted off-axis. FordSight outputs dual-layer feedback: Technical metrics (e.g., offset: dx=12,dy=−8, angle = −3.2°). Human-friendly guidance (e.g., “Move the camera slightly up and left,” or “Tilt clockwise”). This way, engineers get precision numbers for diagnosis, while assembly workers get clear, actionable instructions they can follow immediately.
How we built it
Frontend: React + TailwindCSS interface with panels for uploading a master image, comparing the current image, and viewing results. Computer Vision Core: OpenCV.js (WebAssembly) for in-browser feature detection and image processing. Contrast measured using the standard deviation of grayscale intensity. Sharpness estimated with variance of the Laplacian: Sharpness=Var(∇^2 * I) Feature Matching + Homography to calculate translation (dx,dy), scale, and angle differences between images. Feedback Logic: Designed thresholds to turn raw metrics into intuitive camera instructions without losing technical depth.
Challenges we ran into
OpenCV.js Integration: Getting advanced computer vision algorithms running directly in the browser required careful debugging and memory management. Balancing Detail vs. Simplicity: Our first results were too technical for non-experts. Mapping math-heavy outputs into simple instructions like “move closer” or “rotate clockwise” was harder than expected. Scaling & Normalization: Early tests broke when images had different resolutions or aspect ratios. We had to standardize preprocessing to ensure reliable comparisons. Hackathon Time Pressure: Building a polished frontend, CV pipeline, and feedback logic in less than 36 hours pushed us to iterate quickly and prioritize key features.
Accomplishments that we're proud of
Successfully implemented real-time image alignment analysis entirely in-browser with no backend dependencies. Created a dual feedback system that serves both engineers and workers, bridging a gap we noticed in most factory inspection tools. Built a clean, intuitive interface in React that visually compares images and provides step-by-step alignment guidance. Translated abstract CV metrics into practical manufacturing instructions, making FordSight immediately useful.Successfully implemented real-time image alignment analysis entirely in-browser with no backend dependencies. Created a dual feedback system that serves both engineers and workers, bridging a gap we noticed in most factory inspection tools. Built a clean, intuitive interface in React that visually compares images and provides step-by-step alignment guidance. Translated abstract CV metrics into practical manufacturing instructions, making FordSight immediately useful.
What we learned
How to work with OpenCV.js and WebAssembly to deliver computer vision in a lightweight, accessible way. The importance of human-centered design in industrial tools — numbers alone aren’t enough, clear instructions matter. That alignment and quality assurance problems in manufacturing are solvable with simple, scalable CV techniques, not just complex AI. How to collaborate under hackathon pressure, moving from raw prototypes to a demo-ready product quickly.
What's next for FordSight
Assembly Line Integration: Connect FordSight directly to cameras and sensors on the production line for continuous monitoring.
Built With
- apis
- cloud-services
- databases
- frameworks
- javascript
- node.js
- opencv.js
- platforms
- react.js
- tailwind-css
- vite


Log in or sign up for Devpost to join the conversation.