- Bryan Abrego - Backend (Database)
- Daniel Betancourt - Machine Learning
- Victoria Miteva - Frontend
MotionFrame is a web-based system designed to extract and refine human motion data from videos, making it ready for animation and 3D applications. Using MediaPipe Pose, the platform efficiently detects skeletal movements in real-time, ensuring smooth and accurate motion capture without requiring high-end hardware or GPUs.
MotionFrame aims to:
- Enable Easy Video-Based Motion Capture: Users can upload videos of human movement and extract skeletal motion data without specialized hardware.
- Ensure Real-Time Pose Estimation and Motion Visualization: MediaPipe Pose detects and tracks skeletal movement, displaying extracted motion data in a 2D/3D viewer.
- Offer Motion Refinement: Implement Kalman filters and other noise reduction techniques to smooth movement, handle occlusion, and improve animation quality.
- Provide an Intuitive GUI: A user-friendly interface allows users to upload videos, view extracted motion data, apply customizations, and export in their preferred format.
- Video Upload & Processing: Users upload videos, and the system extracts keyframes for motion analysis.
- Pose Estimation & Skeleton Extraction: Uses MediaPipe Pose to detect and track skeletal movement.
- Real-time Motion Visualization: Displays extracted skeletal motion in a 2D/3D environment.
- Data Filtering & Refinement: Implements Kalman filters and frame interpolation for smoother animations.
- Animation Export: Supports formats like BVH, FBX, JSON for use in Blender, Unity, and other 3D applications.
| Component | Technology |
|---|---|
| Frontend | React.js, TypeScript, HTML, CSS |
| Backend | Node.js + Express.js |
| Database & Storage | MongoDB Atlas (GridFS) |
| Machine Learning | MediaPipe Pose, Python (Converted to JS), Google Colab |
| Video Processing | TBD |
| Deployment | TBD |
- DeepLabCut: Markerless Pose Estimation of User-Defined Body Parts with Deep Learning – Discusses deep learning-based pose estimation for motion capture without markers.
- Motion Capture: Overview and Technical Challenges – Provides an overview of motion capture technology, including challenges and future directions.
- Carnegie Mellon University Motion Capture Database – A comprehensive dataset of human motion capture recordings, useful for research and animation.
- FreeMoCap Project – An open-source initiative for markerless motion capture using consumer-grade cameras.
- FreeMoCap GitHub Repository – Source code and development resources for the FreeMoCap system.
- Rokoko Studio – A professional motion capture tool with an intuitive UI for animation and real-time tracking.
- Clipchamp – A simple, user-friendly video editing platform that serves as a UI reference.
Ensure you have the following installed:
- Node.js (Recommended: LTS version)
- Clone the repository:
git clone https://github.com/<your-github-user>/MotionFrame.git cd MotionFrame
- Install dependencies:
cd react-app npm install - Run the Development Server:
After running the command, you should see output similar to this:
npm run devOpen http://localhost:5173/ in your browser to view the app.VITE vX.X.X ready in Xms ➜ Local: http://localhost:5173/ ➜ Network: http://192.168.X.X:5173/