[Project : SpeakNote] 실시간 강의 음성 기반 AI 주석 시스템

https://speaknote.site/

Speak-Note

 

---

SpeakNote – 실시간 강의 음성 기반 AI 주석 시스템

---

1. 프로젝트 개요

SpeakNote는 강의나 세미나 환경에서 발생하는 실시간 음성(STT)과 강의 자료(PDF)를 통합하여, AI가 강의 문맥을 반영한 주석을 자동으로 생성하고 이를 슬라이드 위에 시각적으로 배치해주는 웹 기반 실시간 학습 보조 시스템입니다.

본 프로젝트는 2025년 부산대학교 정보컴퓨터공학부 졸업과제로 수행되었으며, 과제 제출이나 단순 시연을 목표로 하기보다는 다중 사용자 환경에서 실제로 동작 가능한 실시간 시스템을 구현하는 것을 목표로 설계·개발되었습니다.

또한 프로젝트 완성 이후에는 대회 및 외부 프로젝트에 출품하여 수상 성과를 거두었고, 현재는 해당 프로젝트를 기반으로 실제 서비스(Product) 단계로의 고도화를 진행하고 있습니다.

---

2. 프로젝트를 시작하게 된 배경

강의나 세미나 환경에서 학습자들이 공통적으로 겪는 어려움은 생각보다 단순합니다.

• 강의자의 발화 속도는 빠른데, 이를 모두 기록하기는 어렵고
• 필기에 집중하다 보면 정작 강의 흐름을 놓치게 되며
• 수업이 끝난 뒤에는 기억에 의존해 정리해야 하는 경우가 많습니다.

기존의 STT 기반 도구들도 이러한 문제를 일부 해결해 주지만,
대부분은 음성을 텍스트로 변환하는 수준에 머물러 있습니다.
결국 사용자는 변환된 텍스트를 다시 정리하고,
강의 자료와 연결 지어 이해해야 하는 과정을 거치게 됩니다.

SpeakNote는 여기서 한 단계 더 나아가고자 했습니다.

“음성을 텍스트로만 남길 것이 아니라,
강의 자료 위에 ‘주석’이라는 형태로 바로 고정할 수는 없을까?”

 

 

이 질문이 SpeakNote 프로젝트의 출발점이었습니다.

---

3. 문제 정의

기존 강의 환경의 구조적인 문제는 다음과 같이 정리할 수 있습니다.

1. 발화 속도와 필기 속도의 격차
   강의자의 평균 발화 속도는 분당 120~180 단어에 달하지만,
   학습자의 필기 또는 타이핑 속도는 이에 크게 미치지 못합니다.
2. 학습 도구의 분산
   강의 자료(PDF), STT 앱, 개인 노트 도구가 분리되어 있어
   학습자는 여러 도구를 오가며 정보를 처리해야 합니다.
3. STT 결과의 비정제성
   STT 결과는 구어체 표현, 중복 발화, 맥락 단절이 포함된 경우가 많아
   학습 자료로 활용하기에 적합하지 않습니다.
4. 실시간 학습 보조 시스템의 부재
   대부분의 AI 요약이나 RAG 서비스는 사후 분석을 전제로 하며,
   실시간 강의 환경을 고려한 구조는 드뭅니다.

SpeakNote는 이러한 문제를
기능 나열이 아닌 시스템 구조 설계 관점에서 해결하고자 했습니다.

---

4. 프로젝트 목표

SpeakNote의 주요 목표는 다음과 같습니다.

• 실시간 음성 인식과 요약을 하나의 흐름으로 처리할 것
• 강의 자료(PDF)와 주석을 단일 화면에서 통합 제공할 것
• 다중 사용자 환경에서도 안정적으로 동작할 것
• 주석을 일회성 정보가 아닌 재사용 가능한 데이터 자산으로 관리할 것

단순히 “동작하는 기능”이 아니라,
실제 사용 가능한 시스템을 구현하는 것이 핵심 목표였습니다.

---

5. 시스템 아키텍처 개요

SpeakNote는 역할 분리가 명확한 멀티 서버 구조로 설계되었습니다.

5.1 전체 구조

시스템은 크게 네 개의 계층으로 구성됩니다.

Presentation	사용자 인터페이스, 오디오 캡쳐 및 주석 렌더링	Next.js, React, Zustand, WebSocket Client
Application Tier (Java)	실시간 통신, 세션 관리, 데이터 중계 및 REST API	Spring Boot, WebSocket Handler, Google STT (gRPC)
AI Tier (Python)	문서 전처리, RAG 기반 주석 생성, 병렬 작업 관리	FastAPI, Task Manager, Document Parser (UpStageDP), LLM Agents (CRAG)
Data & Storage	데이터 저장 및 파일 관리	MySQL (정형 데이터), MongoDB (주석 스냅샷/버전), File Storage (PDF 원본)

 

 

• Frontend (Next.js)
  강의 자료 렌더링, 주석 UI, 사용자 인터랙션 처리
• Application Server (Spring Boot)
  WebSocket 기반 실시간 통신, 사용자 세션 관리, Google STT 연동
• AI Server (FastAPI)
  문서 전처리, RAG 기반 주석 생성, 비동기·병렬 처리
• Data & Storage
  정형 데이터(MySQL)와 비정형 데이터(MongoDB) 분리 저장

이 구조는 실시간 처리 성능, 장애 격리, 확장성을 고려하여 설계되었습니다.

 

---

6. 주요 기능 구현

 

6.1 실시간 음성 인식 (STT)

• Google STT Streaming API를 활용하여 실시간 음성 인식 구현
• WebSocket 기반으로 브라우저 오디오 스트리밍 처리
• 세션별 독립 STT 스트림 관리
• 평균 지연 시간 약 0.6초 수준 유지

---

6.2 문맥 기반 AI 주석 생성

• STT 결과를 즉시 요약하지 않고 문맥 단위로 축적
• 페이지 전환, 침묵 구간 등을 기준으로 주석 생성 트리거
• Corrective RAG(CRAG) 적용
  • 문서 적합도 판단
  • 필요 시 외부 정보 검색
  • 환각(Hallucination) 최소화

---

6.3 PDF 주석 시각화

• PDF 페이지 위에 주석을 오버레이 형태로 표시
• 드래그 앤 드롭을 통한 위치 조정
• 주석 크기 조절 및 편집 기능 제공
• 강의 흐름을 방해하지 않는 UI 구성

---

6.4 주석 데이터 관리 및 내보내기

• 주석 위치를 정규화 좌표(0~1)로 저장
• MongoDB 기반 주석 스냅샷 및 버전 관리
• 주석 포함 PDF 내보내기 기능 구현
• 화면에서 보이는 그대로 출력되는 WYSIWYG 보장

---

7. 기술 스택

• Frontend: Next.js, React, TypeScript, Tailwind CSS
• Backend: Java, Spring Boot, WebSocket
• AI: Python, FastAPI, Google STT, Upstage Document Parse, Corrective RAG
• Database: MySQL, MongoDB
• Infra: Docker 기반 컨테이너 환경, VM 배포

 

---

8. 개발 기록 (Project Development Log)

SpeakNote는 단기간에 완성된 프로젝트가 아니라,
기획부터 설계, 구현, 디버깅, 구조 개선까지의 과정을 반복하며 발전해 왔습니다.

아래는 프로젝트 관련 주요 개발 기록과 공부 기록입니다.

실시간 처리 & 아키텍처

• [DataEngineering - MongoDB] 실시간 주석 스냅샷 스키마 설계 - https://ye-seul0-0.tistory.com/129

[DataEngineering - MongoDB] 실시간 주석 스냅샷 스키마 설계 (Project: SpeakNote)

• [DataBase - Design] MySQL + MongoDB를 분리한 이유 - https://ye-seul0-0.tistory.com/128

[DataBase - Design] MySQL + MongoDB를 분리한 이유 (Project: SpeakNote)

• [Springboot - gRPC] 실시간 STT 스트리밍과 세션별 gRPC 스트림 분리 - https://ye-seul0-0.tistory.com/81

[SpringBoot - gRPC] 실시간 STT 스트리밍과 세션별 gRPC 스트림 분리 (Project: SpeakNote)

• [Springboot - WebSocket] 실시간 음성 스트리밍 서버 구조 - https://ye-seul0-0.tistory.com/71

[SpringBoot - WebSocket] 실시간 음성 스트리밍 서버 구조 (Project: SpeakNote)

• [CS | 실시간 시스템] 병목 현상 발생 이유 - https://ye-seul0-0.tistory.com/185

[CS | 실시간 시스템] 병목이 발생하는 이유

• [Architecture] 병목 현상을 줄이기 위한 설계 - https://ye-seul0-0.tistory.com/187

[Architecture] 병목 현상을 줄이기 위한 실시간 아키텍처 설계(Project:SpeakNote)

 

 

서비스 운영을 전제로 한 고도화 과정의 공부는 별도의 Product 단계에서 이어집니다.

---

9. 이후 방향

SpeakNote 프로젝트는
졸업과제 및 대회 출품 기준으로 기능적 완성을 이룬 상태입니다.

현재는 해당 프로젝트를 기반으로,

• 서비스 운영을 고려한 인프라 개선
• 성능 및 비용 최적화
• 실제 사용자 환경을 전제로 한 제품화

를 목표로 Product : SpeakNote 단계의 고도화를 진행하고 있습니다.

 

 

깃허브 링크 

 

• 대회

https://github.com/2025-AI-SW-Hackathon

2025-Speak-Note

 

• 졸업과제 

https://github.com/yeseul-kim01/Capstone-2025-team-19

GitHub - yeseul-kim01/Capstone-2025-team-19: pnucse-capstone2025-classroom-capstone-2025-Capstone-Template created by GitHub Cla

 

 

 

#SpeakNote #졸업과제 #프로젝트포트폴리오 #AI주석 #실시간시스템 #STT #RAG #웹소켓 #팀프로젝트