MediaPipe Pose实战教程:构建智能健身APP
1. 引言
1.1 学习目标
在本教程中,你将学会如何基于Google MediaPipe Pose模型,从零开始搭建一个可用于智能健身场景的 AI 骨骼关键点检测系统。完成本教程后,你将掌握:
- 如何部署并运行本地化的 MediaPipe 姿态估计服务
- 实现人体 33 个关键点的实时检测与可视化
- 构建 WebUI 界面实现图像上传与结果展示
- 将该能力集成到智能健身 APP 中的核心思路
最终,你可以将此模块扩展为动作标准度评分、运动轨迹分析、姿态纠正提醒等实用功能。
1.2 前置知识
建议具备以下基础: - Python 编程基础(熟悉函数、类、文件操作) - Flask 或 FastAPI 等轻量 Web 框架使用经验(非必须但有助于理解) - 对计算机视觉和人体姿态估计有基本了解
1.3 教程价值
不同于依赖云端 API 或复杂深度学习训练流程的方案,本文提供的方法: -完全本地化运行,无网络延迟与隐私泄露风险 -环境极简,仅需安装mediapipe和flask即可启动 -毫秒级响应,适合嵌入移动或边缘设备 -可二次开发性强,便于接入摄像头、动作识别逻辑等
2. 环境准备与项目结构
2.1 安装依赖库
确保已安装 Python 3.8+,然后执行以下命令:
pip install mediapipe flask numpy opencv-python pillow⚠️ 注意:MediaPipe 官方已对 CPU 推理进行了高度优化,无需 GPU 即可流畅运行。
2.2 项目目录结构
创建如下文件夹结构:
smart_fitness_app/ ├── app.py # Web服务主程序 ├── static/ │ └── uploads/ # 用户上传图片存储路径 ├── templates/ │ └── index.html # 图像上传与结果显示页面 └── pose_detector.py # 核心姿态检测模块3. 核心功能实现
3.1 关键点检测模块开发
我们封装一个独立的姿态检测类,便于复用。
pose_detector.py
import cv2 import mediapipe as mp from PIL import Image import numpy as np class PoseDetector: def __init__(self, static_image_mode=True, min_detection_confidence=0.5): self.mp_drawing = mp.solutions.drawing_utils self.mp_pose = mp.solutions.pose self.pose = self.mp_pose.Pose( static_image_mode=static_image_mode, model_complexity=1, # 轻量与精度平衡 smooth_landmarks=True, enable_segmentation=False, min_detection_confidence=min_detection_confidence ) def detect(self, image_path): """输入图像路径,返回带骨架图的RGB数组""" image = cv2.imread(image_path) image_rgb = cv2.cvtColor(image, cv2.COLOR_BGR2RGB) results = self.pose.process(image_rgb) if not results.pose_landmarks: return None, "未检测到人体" # 绘制骨架连接线 annotated_image = image_rgb.copy() self.mp_drawing.draw_landmarks( annotated_image, results.pose_landmarks, self.mp_pose.POSE_CONNECTIONS, landmark_drawing_spec=self.mp_drawing.DrawingSpec(color=(255, 0, 0), thickness=2, circle_radius=2), connection_drawing_spec=self.mp_drawing.DrawingSpec(color=(255, 255, 255), thickness=2) ) # 转回BGR用于保存 annotated_image_bgr = cv2.cvtColor(annotated_image, cv2.COLOR_RGB2BGR) return annotated_image_bgr, results.pose_landmarks.landmark📌代码解析: - 使用mediapipe.solutions.pose初始化姿态模型 -model_complexity=1在速度与精度间取得良好平衡 -draw_landmarks自动绘制红点(关节)与白线(骨骼),符合需求描述 - 返回原始 OpenCV 图像和 33 个关键点坐标列表(可用于后续动作分析)
3.2 Web服务接口搭建
app.py
from flask import Flask, request, render_template, send_from_directory import os from pose_detector import PoseDetector import cv2 app = Flask(__name__) UPLOAD_FOLDER = 'static/uploads' os.makedirs(UPLOAD_FOLDER, exist_ok=True) detector = PoseDetector() @app.route('/', methods=['GET', 'POST']) def index(): if request.method == 'POST': file = request.files.get('image') if not file: return '请上传图片' input_path = os.path.join(UPLOAD_FOLDER, 'input.jpg') output_path = os.path.join(UPLOAD_FOLDER, 'output.jpg') file.save(input_path) # 执行姿态检测 result_img, landmarks = detector.detect(input_path) if result_img is None: return f"检测失败: {landmarks}" cv2.imwrite(output_path, result_img) return render_template('index.html', input_image='uploads/input.jpg?ts=' + str(hash(file.filename)), output_image='uploads/output.jpg') return render_template('index.html') @app.route('/static/<path:filename>') def serve_static(filename): return send_from_directory('static', filename) if __name__ == '__main__': app.run(host='0.0.0.0', port=5000, debug=False)📌核心逻辑说明: - 接收用户上传的图片并保存至static/uploads- 调用PoseDetector.detect()进行处理 - 将结果图像写入同目录下的output.jpg- 渲染 HTML 页面展示原图与骨骼图对比
3.3 前端界面设计
templates/index.html
<!DOCTYPE html> <html> <head> <title>AI 智能健身姿态检测</title> <style> body { font-family: Arial; text-align: center; margin: 40px; } .image-row img { max-width: 45%; height: auto; margin: 10px; border: 1px solid #ddd; } .upload-btn { padding: 10px 20px; font-size: 16px; margin: 20px; } </style> </head> <body> <h1>🤸♂️ AI 人体骨骼关键点检测 - MediaPipe Pose</h1> <p>上传一张全身照,查看系统自动绘制的骨骼关键点(红点)与连接线(白线)</p> <form method="post" enctype="multipart/form-data"> <input type="file" name="image" accept="image/*" required /> <button type="submit" class="upload-btn">上传并分析</button> </form> {% if input_image and output_image %} <div class="image-row"> <div> <h3>原始图像</h3> <img src="{{ url_for('static', filename=input_image) }}" /> </div> <div> <h3>骨骼可视化结果</h3> <img src="{{ url_for('static', filename=output_image) }}" /> </div> </div> {% endif %} </body> </html>📌前端特点: - 简洁直观,支持拖拽上传 - 左右分栏对比显示原图与结果图 - 使用时间戳防止缓存问题
4. 启动与测试
4.1 启动服务
进入项目根目录,运行:
python app.py控制台输出:
* Running on http://0.0.0.0:5000点击平台提供的 HTTP 访问链接即可打开 Web 页面。
4.2 测试示例
上传一张包含站立、深蹲或瑜伽动作的人体照片,系统将在几秒内返回结果:
- ✅ 正确识别出头部、肩部、手肘、手腕、髋部、膝盖、脚踝等 33 个关键点
- ✅ 所有关节以红点高亮标注
- ✅ 骨骼通过白线连接形成“火柴人”骨架图
- ✅ 支持多种角度与光照条件下的稳定检测
5. 实际应用拓展:构建智能健身助手
5.1 动作标准化评分原理
利用检测出的 33 个关键点坐标,可以进一步实现:
- 角度计算:如膝关节弯曲角判断深蹲是否到位
- 距离比值:如双手间距是否符合俯卧撑标准
- 轨迹追踪:连续帧中某关节运动路径是否平滑合规
示例:判断深蹲动作质量
def calculate_angle(a, b, c): """计算三点形成的角度(a-b-c)""" ba = np.array([a.x - b.x, a.y - b.y]) bc = np.array([c.x - b.x, c.y - b.y]) cosine_angle = np.dot(ba, bc) / (np.linalg.norm(ba) * np.linalg.norm(bc)) angle = np.arccos(cosine_angle) return np.degrees(angle) # 获取左腿三个关键点 left_hip = landmarks[mp_pose.PoseLandmark.LEFT_HIP.value] left_knee = landmarks[mp_pose.PoseLandmark.LEFT_KNEE.value] left_ankle = landmarks[mp_pose.PoseLandmark.LEFT_ANKLE.value] angle = calculate_angle(left_hip, left_knee, left_ankle) if angle < 90: feedback = "深蹲到位!" else: feedback = "还需下蹲更深"5.2 可扩展功能清单
| 功能 | 技术实现方式 |
|---|---|
| 实时摄像头检测 | 替换cv2.imread为cv2.VideoCapture(0) |
| 多人姿态识别 | 设置pose_detector = mp_pose.Pose(..., static_image_mode=False) |
| 动作序列识别 | 结合 LSTM 或 Transformer 对关键点序列建模 |
| 数据导出 | 将关键点坐标保存为 CSV 或 JSON 文件供分析 |
6. 总结
6.1 核心收获回顾
通过本教程,我们成功实现了:
- ✅ 基于MediaPipe Pose的高精度人体骨骼关键点检测
- ✅ 构建了完整的本地化 Web 应用,支持图像上传与可视化反馈
- ✅ 掌握了从模型调用、Web 接口开发到前端展示的全流程
- ✅ 为智能健身 APP 提供了可落地的技术原型
该项目具备轻量、快速、稳定、可扩展四大优势,特别适合部署在边缘设备或作为移动端 AI 功能模块。
6.2 下一步学习建议
- 学习 MediaPipe Hands / Face Mesh 模块,实现手势控制或表情识别
- 尝试将模型转换为 TFLite 格式,部署到 Android/iOS 设备
- 结合 OpenCV 实现视频流实时处理
- 使用 PyTorch/TensorFlow 构建自定义动作分类器
💡获取更多AI镜像
想探索更多AI镜像和应用场景?访问 CSDN星图镜像广场,提供丰富的预置镜像,覆盖大模型推理、图像生成、视频生成、模型微调等多个领域,支持一键部署。