카카오톡·구글 독스로 흩어진 연구실 협업을 한곳으로 모으는 통합 플랫폼 첫 번째 모듈로 세미나 피드백 워크플로우(발표 PDF × AI 코파일럿)를 구현·운영 중입니다.
연구실 운영의 협업(세미나 피드백, 일정·공지, 서류 작업 등)이 카카오톡 단일 채널 + 구글 독스에 흩어져 비효율적이라는 문제에서 출발했습니다. 이 흩어진 워크플로우를 단계적으로 흡수하는 연구실 협업 통합 플랫폼을 지향하며, 통증이 가장 큰 세미나 발표 자료 피드백을 첫 번째 모듈로 완성했습니다.
| 항목 | 내용 |
|---|---|
| 소속 | SCH CSE 정보보호 연구실 Hedgehog |
| 비전 | 연구실 협업 통합 플랫폼 (단일 워크스페이스) |
| 현재 단계 | 세미나 피드백 모듈 구현·운영 중 (self-hosted) |
| 본인 담당 | 풀스택 (기획 · 프론트 · 백엔드 · AI 연동 · DB 스키마 · 인프라/배포) |
이 저장소는 통합 플랫폼의 첫 모듈까지 구현된 상태입니다. 일정·공지·서류 협업 등은 로드맵을 참고하세요.
| 슬라이드 뷰어 + AI 피드백 사이드패널 | 위치 기반 핀 작성 |
|---|---|
 |
 |
| 핀이 찍힌 슬라이드 | 핀 · 슬라이드 · 종합 코멘트 |
|---|---|
 |
 |
"PPTX용 Figma + 한국어 학술 AI 코파일럿" — 한 화면에서 슬라이드를 보며 어느 좌표든 클릭해 핀을 박고 코멘트하고, AI가 한국어 학술 교정을 사람보다 먼저 제안합니다. 기존의 "PPT 보기"와 "구글 독스에 글로 적기" 두 화면이 하나로 합쳐집니다.
- Google OAuth 로그인 + 초대 코드 기반 가입 (워크스페이스 단위)
- 역할 분리: 일반 멤버 / 발표자(세미나 단위 동적) / 관리자
- 멤버 목록 · 관리자 멤버 관리
- 세미나 생성·일정 관리, 월별 피드백 순번 지정 + 본인 차례 알림
- PDF 발표 자료 업로드 + 버전 관리 (v1 · v2 · v3 …, 이전 버전 보존)
- 상태 흐름: 예정 → 검토 중 → 발표 완료 → 보관 (자동 전환)
- 슬라이드 위 임의 좌표에 핀을 찍어 코멘트 (위치 기반 피드백, 정규화 좌표)
- 슬라이드별 일반 코멘트 + 발표 종합 코멘트, 답글 스레드
- 핀 해결 표시, 작성자 본인만 수정·삭제
- Supabase Realtime으로 다중 사용자 즉시 동기화
- 업로드 시 Claude가 슬라이드를 분석해 명확성·논리·표현 등 한국어 학술 교정을 사이드패널에 자동 제안
- 발표자가 슬라이드별 AI 자동 코멘트 on/off (첫 사용 시 동의 모달)
- 알림 4종: 내 발표 차례 / 내 자료에 코멘트 / 멘션(@) / AI 분석 완료
- 이메일(nodemailer) + 웹 푸시(PWA) 발송
통합 플랫폼 비전의 다음 wedge들 — 아직 미구현이며 수요 검증 후 단계적으로 추가:
- 일정 · 태스크 · 공지 — 연구실 운영 협업 (현재 카카오톡이 담당하는 영역)
- 서류 협업 워크플로우 — 공동 문서 작성·검토
- 멀티플레이어 presence/커서 — Figma 수준 실시간 협업 (현재는 아바타 presence까지)
- (수요 검증 후) 다중 연구실 / SaaS화
| 영역 | 기술 |
|---|---|
| Frontend | Next.js 16 (App Router) · React 19 · TypeScript 5 |
| UI | shadcn/ui · Radix UI · Tailwind CSS 4 · Pretendard |
| Backend | Supabase (Auth · PostgreSQL · Storage · Realtime) |
| AI | Anthropic Claude (claude-sonnet-4-6) — 교내 AIHub Gateway 경유 |
| pdfjs-dist · react-pdf · unpdf (텍스트 + bbox 추출) | |
| 알림 | nodemailer (이메일) · web-push (PWA) |
| 테스트 | Vitest (unit · integration) · Playwright (E2E) |
| 배포 | Docker (standalone) · 연구실 서버 self-host |
labplatform/
├── src/
│ ├── app/ # Next.js App Router (페이지 · API · server actions)
│ │ ├── (app)/ # 인증 후 메인 — 세미나 · 멤버 · 알림
│ │ ├── (admin)/ # 관리자 — 멤버 관리 · 설정 · 초대 · 피드백 순번
│ │ ├── api/ # Route handlers — deck 업로드/추출/분석 · cron · auth
│ │ └── auth/callback/ # OAuth 콜백
│ ├── components/ # 공용 UI (shadcn/Radix) · 알림
│ └── lib/ # 도메인 로직
│ ├── auth/ # 인증·인가 (getCurrentUser · requireAdmin/Presenter)
│ ├── seminars/ decks/ pins/ comments/ # 핵심 도메인
│ ├── ai/ # Claude 분석 (gateway · prompt · schema)
│ ├── notifications/ # 이메일 · web-push · 멘션
│ └── supabase/ # 클라이언트 (server · client · admin)
├── supabase/migrations/ # DB 스키마 + RLS 정책
├── tests/ # Vitest (unit·integration) + Playwright (e2e)
├── docs/adr/ # 아키텍처 결정 기록(ADR)
├── middleware.ts # 인증 게이트
└── Dockerfile # standalone 이미지 (bun build → node runtime)
# 1. 의존성 설치
bun install # 또는 npm install
# 2. 환경 변수 설정 (.env.example 참고)
cp .env.example .env.local # Supabase·AIHub·VAPID·SMTP 키 채우기
# 3. 로컬 Supabase (선택)
bun run supabase:start
# 4. 개발 서버
bun run dev # http://localhost:3000| 스크립트 | 설명 |
|---|---|
bun run dev |
개발 서버 |
bun run build |
프로덕션 빌드 (standalone) |
bun run test |
단위·통합 테스트 (Vitest) |
bun run test:e2e |
E2E 테스트 (Playwright) |
bun run lint |
ESLint |
- 인증/인가: Supabase
getUser()(서버 측 JWT 검증) 기반. 미들웨어 + 도메인 계층 이중 가드, 소유권 기반 인가. - AI 구조화 출력: Claude tool-use로 JSON 스키마를 강제 (텍스트 파싱 금지).
- PDF: 업로드는 presigned URL로 Storage 직행, 열람은 same-origin 인증 프록시 경유. 변환은 사용자 PC(PowerPoint/Keynote의 PDF export)에서 — 폰트 임베드 보장.
- 설계 결정 상세는
docs/adr/참고.