Homepage   Swagger   Notion

기술 스택

분류기술 스택
프론트엔드
백엔드
AI & 챗봇
실시간 & 미디어
인프라 & DevOps
문서화 & 협업
성능/품질

제스쳐 인식과 Livekit 기반 화상 요리 플랫폼

프로젝트 개요

  • 프로젝트명: Reciplay
  • 프로젝트 기간: 2025.07.14 ~ 2025.08.18
  • 프로젝트 형태: 팀 프로젝트 (실시간 화상 수업 + AI 융합 서비스)
  • 목표: 제스쳐 기반 조작, 실시간 화상 수업, STT 기반 챗봇을 결합한 상호작용형 요리 학습 플랫폼 개발
  • 주요 타겟 사용자: 요리 학습을 원하는 일반 사용자 및 강사

프로젝트 소개


프로젝트 배경

기존 온라인 요리 강의는 단순 영상 시청 위주로,

  • 손이 자유롭지 않아 조작이 불편하고
  • 강의 진도를 놓치기 쉽고 집중도가 낮으며
  • 강사와 실시간 상호작용이 제한되는 문제점이 있었습니다.

👉 이를 해결하기 위해 본 프로젝트는 실시간 화상 통신, 제스처 인식, STT 챗봇, AI 보조를 융합하여 양방향 학습 경험을 제공합니다.


프로젝트 목표

  1. 실시간 상호작용 강화

    • 제스처 인식을 통한 직관적 강의 제어
    • WebSocket, STOMP 기반 실시간 소통
  2. 학습 편의성 증대

    • STT 기반 자동 질문 생성
    • LLM + RAG 기반 문맥형 AI 응답 제공
  3. 안정적이고 확장 가능한 플랫폼 구축

    • LiveKit 기반 저지연 미디어 서버
    • AWS S3 기반 안정적 자료 관리 및 확장성 확보

페이지 소개

화상 기능

제스처 기반 강의 제어

  • 손동작으로 챕터 이동 및 화면 제어
  • 조작 부담 최소화 → 학습 집중도 향상
  • LiveKit + WebSocket 기반 화상 강의

Clap 제스쳐로 챕터 이동 박스 제스쳐

Thumb up으로 투두 체크 따봉 제스쳐

Fist 제스쳐로 질문 피스트 제스쳐

Cross Arm 제스쳐 질문 상태 해제 크로스 암

STT + AI 챗봇

  • 학습자가 발화 → STT 변환 → 질문 자동 생성
  • LLM + RAG 기반으로 레시피·강의 자료에 맞춘 답변 제공

타이핑으로 입력

챗봇 입력

STT로 입력

웹페이지

회원가입

  • 이메일 OTP인증을 통한 회원가입 회원가입

로그인

로그인

소셜 로그인

  • 네이버, 카카오, 구글 회원가입 및 로그인 지원 소셜 로그인

강사 등록

  • 관리자에게 강사 등록 요청 강사 등록

강사 상세 페이지

  • 강사 구독, 경력, 자격증, 강좌 목록 조회 강사 상세 페이지

강좌 등록

AI 기반 강의 자료 생성

  • AI가 요리 주제에 맞는 레시피, 단계별 가이드, 시각 자료를 자동 생성
  • 강사의 부담을 줄이고, 학습자는 최신 자료를 손쉽게 제공받을 수 있음
  • AWS S3 + Presigned URL
  • 강의 영상, 레시피 PDF 안전하게 업로드/다운로드
    강좌 등록

강좌 상세 페이지

  • 스케쥴 표, 수강평, 별점, Q&A를 등록 및 확인 강좌 상세 페이지

강사 관리(관리자)

  • 강사 등록 승인 및 반려 관리
    강사 관리

강좌 관리(관리자)

  • 강좌 등록 승인 및 반려 관리
    강좌 관리

기술 소개

Architecture

CI/CD

성능 개선

LabelSamplesAvgMedian90% Line95% Line99% LineMinMaximumError %ThroughputReceived KB/secSent KB/sec
MySQL1,000,00021713336073519930193020.04300.5758471059281842.5773119223791398.5271065295644
Redis1,000,00017120325026731316480.05745.8385764110342461.6766033762551868.5197714305416
개선율21.19816%-52%30.5%63.6735%84.295%96.6428%33.6063%

MySQL기반 인증 과정

레디스기반 인증 과정

커스텀 웹훅

Livekit webhook 문제로 STOMP를 이용한 커스텀 웹훅을 구현했습니다.

챕터 이슈

조인-리조인

투두 체크

팀원 소개

이름역할Contact블로그
이재익팀장 & FE & AIGit
강태욱FE & DesignGit
배준재BEGit블로그
이지언FE & DesignGit
이원준BE & InfraGit블로그
윤지욱BEGit

문서 자료