← 포트폴리오 목록
AI 자세 분석 트레이닝 대시보드
본 프로젝트의 핵심 요구사항인 MediaPipe 기반 자세 인식과 Rule-based 동작 분석을 직접 반영한 프로젝트입니다.
클라이언트 사이드 Pose Estimation 파이프라인 설계MediaPipe Tasks Vision을 Web Worker에서 실행하여 UI 스레드 부하를 분리하는 구조를 설계합니다.
Rule-based 동작 분석 엔진 구현관절 벡터 각도 계산과 피크 검출 알고리즘을 조합해 반복 횟수·좌우차 산출 로직을 자체 구현합니다.
관절 좌표 JSON 데이터 구조 설계향후 확장을 고려해 프레임·세션·사용자 단위로 정규화된 관절 좌표 저장 구조를 설계합니다.
Overview
프로젝트 개요
본 프로젝트의 핵심 요구사항인 MediaPipe 기반 자세 인식과 Rule-based 동작 분석을 직접 반영한 프로젝트입니다. 사용자가 운동 영상을 촬영·업로드하면 관절 landmark를 추출해 관절각도·ROM·좌우 차이를 자동 산출하고, 세션별 기록 추이를 시각화합니다.
요구사항 정의
프로젝트 핵심 과제
프로젝트 진행 시 해결한 핵심 기술 과제입니다.
브라우저 환경별 MediaPipe 추론 성능 편차 리스크
저사양 기기에서는 프레임 샘플링 레이트를 조정해 대응합니다
목표 동작별로 관절각도 임계값이 달라질 수 있는 리스크
동작 타입별 설정 프로파일을 분리해 대응합니다
영상 업로드 용량 증가에 따른 스토리지 비용 리스크
클라이언트 사이드 압축과 만료 정책 적용으로 대응합니다
핵심 기능 1
AI 자세 분석 대시보드
최근 촬영한 운동 세션의 스켈레톤 오버레이, 핵심 지표(관절각도·ROM·반복 횟수), 좌우 차이를 한 화면에서 확인할 수 있는 대시보드입니다
핵심 기능 2
영상 촬영·업로드
사용자가 모바일 웹에서 운동 동작 영상을 직접 촬영하거나 기존 영상을 업로드하고, 처리 상태를 확인할 수 있습니다
핵심 기능 3
Rule-based 동작 분석
선택한 세션의 프레임별 스켈레톤 오버레이와 함께 관절각도·ROM·반복 횟수·좌우 차이를 Rule-based 로직으로 산출한 상세 결과를 제공합니다
핵심 기능 4
기록 추이 비교
사용자가 과거 운동 기록을 날짜별로 조회하고, 관절각도·ROM·좌우 차이의 변화 추이를 그래프로 비교할 수 있습니다
구현 과정
프로젝트 진행 단계
STEP 1
요구사항 분석 및 데이터 구조 설계
타겟 운동 동작 정의, 관절 좌표 JSON 스키마 설계, ERD 정의
STEP 2
MediaPipe 연동 및 촬영/업로드 구현
MediaPipe Tasks Vision 클라이언트 통합, 영상 촬영·업로드 흐름 구현
STEP 3
Rule-based 분석 엔진 및 결과 화면 개발
관절각도·ROM·반복 횟수·좌우차 산출 로직 구현, 결과 시각화 화면 개발
STEP 4
기록 추이 화면 및 통합 테스트
세션별 기록 저장·비교 차트 구현, 전체 흐름 통합 테스트 및 최적화
프로젝트 성과
클라이언트 사이드 Pose Estimation 파이프라인 설계MediaPipe Tasks Vision을 Web Worker에서 실행하여 UI 스레드 부하를 분리하는 구조를 설계합니다.
Rule-based 동작 분석 엔진 구현관절 벡터 각도 계산과 피크 검출 알고리즘을 조합해 반복 횟수·좌우차 산출 로직을 자체 구현합니다.
관절 좌표 JSON 데이터 구조 설계향후 확장을 고려해 프레임·세션·사용자 단위로 정규화된 관절 좌표 저장 구조를 설계합니다.
Review
기술적 주안점
- 관절 landmark 추출부터 Rule-based 분석 결과까지 이어지는 파이프라인을 하나의 인사이트 대시보드 화면으로 통합해 보여주는 구조를 구현합니다
- 브라우저 촬영과 파일 업로드를 하나의 흐름으로 통합하고, 업로드 직후 분석 파이프라인 상태를 실시간으로 표시하는 구조를 구현합니다
- 클라이언트 사이드 Pose Estimation과 Rule-based 분석 로직을 결합하여 관절각도·ROM·반복 횟수·좌우 차이를 자동 산출하는 분석 엔진을 구현합니다
