A computer vision application that calculates body measurements from a single photo using OpenCV and MediaPipe pose detection.
- Upload a person's photo
- Automatic pose detection using MediaPipe
- Calculate key body measurements:
- Height
- Shoulder width
- Chest/Bust circumference
- Waist circumference
- Hip circumference
- Arm length
- Leg length (inseam)
- Neck circumference
- Wrist circumference
- And more tailoring measurements
- Pose Detection: Uses MediaPipe to detect 33 key body landmarks
- Reference Scaling: Uses known body proportions or user-provided reference measurements
- Anthropometric Calculations: Applies standard body measurement formulas
- Real-time Processing: Processes images and returns measurements instantly
- Upload a clear, full-body photo (front-facing preferred)
- Optionally provide a reference measurement (like height) for better accuracy
- Get comprehensive body measurements suitable for tailoring
- Backend: Hono.js with pose detection and measurement calculations
- Frontend: React with image upload and results display
- Computer Vision: Currently uses mock pose detection (see integration guide below)
- Calculations: Anthropometric formulas for body measurements
- Styling: TailwindCSS for responsive design
├── backend/
│ ├── index.ts # Main API server
│ ├── pose-detection.ts # MediaPipe pose detection
│ ├── measurements.ts # Body measurement calculations
│ └── utils.ts # Helper functions
├── frontend/
│ ├── index.html # Main page
│ ├── App.tsx # React app component
│ └── components/ # UI components
└── shared/
└── types.ts # Shared TypeScript types
POST /api/measure - Upload image and get body measurements
POST /api/report - Download measurements as text file
GET /api/health - Health check endpoint
GET /api/docs - API documentation
GET / - Serve the main application
Real Pose Detection Integration
This demo currently uses mock pose detection for demonstration purposes. To integrate with real pose detection:
npm install @mediapipe/pose @mediapipe/camera_utils
Option 2: TensorFlow.js PoseNet (Good for server-side)
npm install @tensorflow/tfjs-node @tensorflow-models/posenet
Option 3: OpenCV (Lightweight option)
npm install opencv4nodejs
See /backend/real-pose-integration.ts for detailed implementation examples.
The system currently:
- ✅ Provides a complete web interface for image upload
- ✅ Validates image format and size
- ✅ Implements comprehensive measurement calculations
- ✅ Uses anthropometric formulas for accurate estimations
- ✅ Provides confidence scoring
- ✅ Generates downloadable measurement reports
- ⚠️ Uses mock pose detection (needs real implementation)
The measurement calculations are based on established anthropometric research and provide:
- Primary measurements: Height, shoulder width, chest, waist, hip circumferences
- Arm measurements: Full arm, upper arm, forearm lengths and circumferences
- Leg measurements: Leg length, inseam, thigh, calf circumferences
- Tailoring measurements: Neck, armhole, back/front widths, and key distances
Accuracy depends on:
- Photo quality: Clear, well-lit, full-body images
- Pose quality: Upright stance with arms slightly away from body
- Reference measurement: Providing actual height significantly improves accuracy
- Pose detection quality: Real implementation will be more accurate than mock