PostureGuard – AI-Powered Bad Posture Detection App

https://postureguard.onrender.com

🛠 Built With

PostureGuard is an intelligent full-stack application that uses AI-powered pose detection to analyze and correct bad posture in real-time. Built with React and TensorFlow.js for the frontend and Node.js/Express with MongoDB for the backend, it provides comprehensive posture analysis for exercises like squats and desk sitting positions.

Project Overview

PostureGuard combines computer vision and machine learning to deliver real-time posture feedback. Users can analyze their posture through live webcam feeds or by uploading exercise videos. The application uses rule-based logic to detect common posture issues and provides detailed feedback to help users improve their form and prevent injuries.

✨ Key Features

Real-Time Analysis

• Live Webcam Detection: Real-time pose analysis using TensorFlow.js and MediaPipe
• Instant Feedback: Immediate posture corrections and suggestions
• Exercise-Specific Rules: Tailored analysis for squats and desk sitting positions
• Confidence Scoring: AI confidence levels for each detection

Video Analysis

• Upload & Analyze: Upload exercise videos for comprehensive analysis
• Frame-by-Frame Breakdown: Detailed analysis of each video frame
• Progress Monitoring: Track posture improvements over time

Rule-Based Detection System

• Squat Analysis:
  • Knee-over-toe detection
  • Back angle monitoring
  • Hip alignment checks
  • Depth analysis
• Desk Sitting Analysis:
  • Neck bend detection
  • Spine straightness monitoring
  • Shoulder alignment checks
  • Head position analysis

User Experience

• Responsive Design: Works seamlessly on desktop and mobile devices
• Fallback Mode: Basic webcam functionality when AI fails to load
• Progress Indicators: Visual feedback during analysis
• Clean Interface: Modern, intuitive user interface with Tailwind CSS

🏗️ Architecture

Frontend Architecture

• React 18: Modern React with hooks and functional components
• Vite: Fast build tool and development server
• TensorFlow.js: Client-side machine learning for pose detection
• MediaPipe: Google's pose detection models
• Tailwind CSS: Utility-first CSS framework

Backend Architecture

• Express.js: RESTful API server
• MongoDB: Document database for storing analysis results
• Mongoose: ODM for MongoDB with schema validation
• Multer: File upload middleware

AI/ML Pipeline

• Pose Detection: TensorFlow.js PoseNet and MediaPipe models
• Rule Engine: Custom rule-based posture analysis
• Confidence Scoring: AI model confidence assessment
• Real-time Processing: Optimized for 30fps analysis

🚀 Installation and Setup

Prerequisites

• Node.js (v16 or higher)
• MongoDB Atlas account or local MongoDB installation
• Modern web browser with webcam support

Frontend Setup

1. Clone the repository

2. Navigate to frontend directory

   cd frontend/

3. Install dependencies

   npm install

4. Create .env file with the following variables

   VITE_SERVER_URL=Your backend server url ("http://localhost:5000")

5. Start development server ```bash npm run dev ```

The frontend will be available at `http://localhost:3000\`

Backend Setup

1. Navigate to backend directory

   cd backend/

2. Install dependencies

   npm install

3. Create .env file with the following variables

   PORT=5000
   FRONTEND_URL=http://localhost:3000
   ATLAS_DB_URI=Your atlas db url

4. Start the server

   npm run dev

Now open the browser and visit 'http://localhost:3000'

🎯 Usage Guide

Real-Time Posture Analysis

1. Select Exercise Type: Choose between "Squat" or "Sitting" analysis
2. Enable Webcam: Allow camera access when prompted
3. Position Yourself: Ensure your full body is visible in the camera frame
4. Start Analysis: The AI will begin detecting your pose in real-time
5. Follow Feedback: Adjust your posture based on the real-time suggestions

Video Upload Analysis

1. Upload Video: Select an exercise video from your device
2. Choose Exercise Type: Specify whether it's a squat or sitting exercise
3. Start Analysis: The system will process your video frame by frame
4. Review Results: View detailed analysis with timestamps and issue detection

Understanding Results

• Green Indicators: Good posture detected
• Yellow Warnings: Minor posture issues that need attention
• Red Alerts: Significant posture problems requiring immediate correction
• Confidence Scores: AI model confidence in the detection (higher is better)

🧠 AI Models and Detection

Pose Detection Models

• TensorFlow.js PoseNet: Lightweight pose estimation
• MediaPipe Pose: High-accuracy pose detection
• Fallback Detection: Basic computer vision when AI models fail

Rule-Based Analysis Engine

Squat Analysis Rules

• Knee Alignment: Prevents knee-over-toe positioning
• Back Angle: Maintains proper spinal alignment
• Hip Depth: Ensures adequate squat depth
• Weight Distribution: Checks for balanced stance

Sitting Posture Rules

• Neck Position: Prevents forward head posture
• Spine Alignment: Maintains natural spinal curves
• Shoulder Position: Prevents rounded shoulders
• Hip Alignment: Ensures proper sitting position

🔧 API Endpoints

Analysis Endpoints

• `POST /api/analysis/save` - Save analysis results

Posture Analysis Endpoints

• `POST /api/posture/analyze-video` - Analyze uploaded video

🛡️ Security Features

• Input Validation: Comprehensive validation for all API inputs
• File Type Restrictions: Only allow specific video/image formats
• Rate Limiting: Prevent API abuse with request rate limiting
• CORS Configuration: Secure cross-origin resource sharing
• Environment Variables: Sensitive data stored securely

🎨 Customization

Adding New Exercise Types

1. Update the rule engine in `lib/postureRules.js`
2. Add new analysis logic for the exercise
3. Update the frontend exercise selection
4. Test with appropriate video samples

Modifying Detection Thresholds

• Edit angle thresholds in the posture rules
• Adjust confidence score requirements
• Customize severity levels for different issues

🙏 Acknowledgements

• TensorFlow.js Team - For the amazing machine learning framework
• MediaPipe Team - For the pose detection models
• React Team - For the excellent frontend framework
• MongoDB Team - For the flexible database solution
• Open Source Community - For all the libraries and tools used

---

Built with ❤️ for better posture and healthier living