Inspiration
Our inspiration came from seeing the immense manual labor involved in retail inventory management. We watched local store owners spend hours scanning barcodes and counting shelf items by hand. We wanted to build a "second set of eyes" for these managers—a system that could see what they see, but count and log it instantly using the power of Computer Vision.
What it does
StockSnap is an AI-powered inventory ecosystem that digitizes manual stock-taking. It allows users to point a camera at a shelf or upload a photo, automatically identifying products, counting them, and logging the data into a central database. It features a hybrid AI approach: a real-time browser scanner for instant feedback and a deep-learning backend for high-accuracy audits, all visualized through a comprehensive management dashboard.
How we built it
We built StockSnap using a modern full-stack architecture. The Frontend is crafted with React and Tailwind CSS, utilizing Transformers.js to run AI models directly in the user's browser. The Backend is powered by FastAPI and PostgreSQL, with YOLOv8 (You Only Look Once) handling the heavy lifting for server-side image analysis. We integrated a custom Model Manager to handle hardware acceleration and seamless fallback between mock and real AI services.
Challenges we ran into
One of the biggest hurdles was managing the latency between the camera feed and the AI processing. We had to implement Web Workers in React to prevent the UI from freezing during live scans. Additionally, configuring the backend to support high-performance libraries like ultralytics on different hardware environments required extensive troubleshooting of Python virtual environments and dependency management.
Accomplishments that we're proud of
We are incredibly proud of our Hybrid AI implementation. Being able to run object detection locally in the browser while simultaneously having a high-precision YOLOv8 model on the server gives our app a professional edge. We are also proud of the Live Mode UI, which provides smooth, real-time bounding box overlays that make the technology feel almost magical to the user.
What we learned
This project was a deep dive into the intersection of Computer Vision and Web Development. We learned how to optimize AI models for the web, how to manage complex asynchronous data flows between a camera and a database, and the importance of robust error handling when dealing with high-stakes inventory data.
What's next for StockSnap
This project was a deep dive into the intersection of Computer Vision and Web Development. We learned how to optimize AI models for the web, how to manage complex asynchronous data flows between a camera and a database, and the importance of robust error handling when dealing with high-stakes inventory data.
Unfortunately we did have to use ai to help edit our video at the end, but our full code is on Github for you to access.
Log in or sign up for Devpost to join the conversation.