TagNCount is a web application that uses computer vision to detect, label, and count objects in images. The system provides an interface where users can upload images and receive detailed analysis of the objects present in them.
- Frontend Interface: Users can upload images through a drag-and-drop interface or by browsing their files.
- Image Processing Workflow:
- Images are sent to the backend API for analysis
- The YOLOv8 model processes each image to detect objects
- Results are returned to the frontend with:
- Object counts by category
- Confidence scores for each detection
- Annotated image with bounding boxes around detected objects
- Results Display: The application shows both the original and annotated images side by side, with a detailed breakdown of all detected objects.
- Upload and analyze images through drag-and-drop or file browser
- Real-time object detection using YOLOv8
- Object counting by category with confidence scores
- Side-by-side comparison of original and annotated images
- Clean and intuitive user interface with dark/light mode
- RESTful API backend
The application uses YOLOv8 with the COCO dataset pre-trained model, which can detect the following 80 object categories:
| Person | Bicycle | Car | Motorcycle | Airplane |
| Bus | Train | Truck | Boat | Traffic Light |
| Fire Hydrant | Stop Sign | Parking Meter | Bench | Bird |
| Cat | Dog | Horse | Sheep | Cow |
| Elephant | Bear | Zebra | Giraffe | Backpack |
| Umbrella | Handbag | Tie | Suitcase | Frisbee |
| Skis | Snowboard | Sports Ball | Kite | Baseball Bat |
| Baseball Glove | Skateboard | Surfboard | Tennis Racket | Bottle |
| Wine Glass | Cup | Fork | Knife | Spoon |
| Bowl | Banana | Apple | Sandwich | Orange |
| Broccoli | Carrot | Hot Dog | Pizza | Donut |
| Cake | Chair | Couch | Potted Plant | Bed |
| Dining Table | Toilet | TV | Laptop | Mouse |
| Remote | Keyboard | Cell Phone | Microwave | Oven |
| Toaster | Sink | Refrigerator | Book | Clock |
| Vase | Scissors | Teddy Bear | Hair Drier | Toothbrush |
Limitations: The model can only detect objects it was trained on. Objects not in this list (such as specific products, specialized equipment, or uncommon items) may not be detected or might be incorrectly classified as one of the known categories. For specialized detection needs, the model would need to be fine-tuned on custom datasets.
- Python 3.9+
- FastAPI - High-performance REST API framework
- YOLOv8 - Deep learning-based Object detection model
- OpenCV - Computer Vision library
- Uvicorn - ASGI web server
- React - UI library
- JavaScript
- TailwindCSS - Utility-first CSS framework
- Fetch API for making HTTP requests
- Backend: A FastAPI server that hosts the YOLOv8 model and exposes an
/analyzeendpoint for image processing. - Frontend: A React application that handles file uploads, displays results, and provides a responsive UI with dark/light mode toggle.
- Docker: Containerization for both frontend and backend services for easy deployment.
- Docker and Docker Compose
- Node.js 16+
- Python 3.9+
- Clone the repository
- Run
docker-compose up --build - Access the application at
http://localhost:3000
-
Backend:
cd backend python -m venv venv source venv/bin/activate pip install -r requirements.txt uvicorn main:app --reload
-
Frontend:
cd frontend npm install npm start
Once the backend is running, visit http://localhost:8000/docs for the API documentation.