mirror of
https://github.com/hwanny1128/HGZero.git
synced 2025-12-06 10:16:24 +00:00
회의진행화면 개선안 종합보고서 작성 내용 업로드
This commit is contained in:
parent
1e67bb5ad9
commit
253d214526
7
.gitignore
vendored
7
.gitignore
vendored
@ -43,8 +43,9 @@ examples/
|
|||||||
.claude/settings.local.json
|
.claude/settings.local.json
|
||||||
|
|
||||||
# Backup files
|
# Backup files
|
||||||
design/*/*/*backup.*
|
design/*/*/*/*back*
|
||||||
design/*/*backup.*
|
design/*/*/*back*
|
||||||
design/*backup.m*
|
design/*/*back*
|
||||||
|
design/*back*
|
||||||
backup/
|
backup/
|
||||||
.vscode/settings.json
|
.vscode/settings.json
|
||||||
|
|||||||
762
claudedocs/회의진행-개선안-종합보고서.md
Normal file
762
claudedocs/회의진행-개선안-종합보고서.md
Normal file
@ -0,0 +1,762 @@
|
|||||||
|
# 회의진행 화면 개선안 종합 보고서
|
||||||
|
|
||||||
|
**작성일**: 2025-10-25
|
||||||
|
**버전**: v1.0
|
||||||
|
**대상**: 회의록 작성 서비스 MVP
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📋 목차
|
||||||
|
1. [논의 배경 및 목적](#1-논의-배경-및-목적)
|
||||||
|
2. [MVP 핵심 가치 재확인](#2-mvp-핵심-가치-재확인)
|
||||||
|
3. [최종 개선안](#3-최종-개선안)
|
||||||
|
4. [공수 및 일정 영향 분석](#4-공수-및-일정-영향-분석)
|
||||||
|
5. [유저스토리 수정안](#5-유저스토리-수정안)
|
||||||
|
6. [화면설계 수정안](#6-화면설계-수정안)
|
||||||
|
7. [프로토타입 수정 가이드](#7-프로토타입-수정-가이드)
|
||||||
|
8. [v2.0 백로그](#8-v20-백로그)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 1. 논의 배경 및 목적
|
||||||
|
|
||||||
|
### 1.1 논의 내용
|
||||||
|
회의 진행 화면의 다음 기능들에 대해 MVP 관점에서 재검토:
|
||||||
|
- **회의 참석자 권한 구분**: 생성자 vs 일반 참석자
|
||||||
|
- **메모 기능**: 개인 메모 vs 공유 메모
|
||||||
|
- **용어 설명**: 회사 특화 용어 처리 방안
|
||||||
|
- **관련 회의록**: 표시 방식 및 활용도
|
||||||
|
- **중도 퇴장**: 화면 전환 방식에 따른 구현
|
||||||
|
|
||||||
|
### 1.2 목적
|
||||||
|
- MVP 범위 명확화 및 불필요한 기능 제거
|
||||||
|
- 핵심 가치 실현에 집중
|
||||||
|
- 예산 및 일정 준수
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 2. MVP 핵심 가치 재확인
|
||||||
|
|
||||||
|
### 2.1 서비스 핵심 가치
|
||||||
|
> **"업무지식이 없어도 누락 없이 정확하게 회의록을 작성"**
|
||||||
|
|
||||||
|
### 2.2 MVP 필수 기능
|
||||||
|
1. ✅ AI STT로 실시간 음성 인식
|
||||||
|
2. ✅ AI가 주요 내용 자동 추출 및 제시
|
||||||
|
3. ✅ 회의 종료 후 AI 자동 요약 생성
|
||||||
|
4. ✅ 회의록 확인 및 기본 수정
|
||||||
|
5. ✅ 회의록 공유 (이메일/링크)
|
||||||
|
|
||||||
|
### 2.3 MVP 제외 기능 (v2.0 이관)
|
||||||
|
- ❌ 복잡한 메모 입력/편집 기능
|
||||||
|
- ❌ 실시간 협업 메모 동기화
|
||||||
|
- ❌ 참석자별 세밀한 권한 관리 UI
|
||||||
|
- ❌ 용어 사전 직접 검색 기능
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 3. 최종 개선안
|
||||||
|
|
||||||
|
### 3.1 회의 참석자 권한
|
||||||
|
|
||||||
|
#### 현재 문제점
|
||||||
|
- 생성자 vs 참석자로 이분법적 구분
|
||||||
|
- 회의 생성자도 참석자 중 한 명이라는 관점 누락
|
||||||
|
|
||||||
|
#### 개선안
|
||||||
|
**회의 생성자 = 특별 권한을 가진 참석자**
|
||||||
|
|
||||||
|
```
|
||||||
|
모든 참석자 공통 기능:
|
||||||
|
- AI 제시 주요 내용 확인 및 체크
|
||||||
|
- 회의록 실시간 확인
|
||||||
|
- 용어 설명 확인
|
||||||
|
- 관련 회의록 확인
|
||||||
|
- "나가기" 버튼으로 중도 퇴장
|
||||||
|
|
||||||
|
회의 생성자 전용 기능:
|
||||||
|
- 회의 종료 버튼 (일반 참석자에게는 숨김)
|
||||||
|
- 녹음 제어 (일시정지/재개/종료)
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 구현 방식
|
||||||
|
```javascript
|
||||||
|
// 버튼 조건부 표시
|
||||||
|
if (currentUser.id === meeting.creator_id) {
|
||||||
|
// 회의 종료 버튼 표시
|
||||||
|
showEndMeetingButton();
|
||||||
|
showRecordingControls();
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3.2 메모 기능
|
||||||
|
|
||||||
|
#### 현재 문제점
|
||||||
|
- 텍스트 입력 메모 구현 시 공수 증가
|
||||||
|
- 공유 메모 vs 개인 메모 선택 어려움
|
||||||
|
- 실시간 동기화 복잡도
|
||||||
|
|
||||||
|
#### 개선안 (MVP 최소화)
|
||||||
|
**AI 제시 내용 체크박스 방식**
|
||||||
|
|
||||||
|
```
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ 🤖 AI가 파악한 주요 내용 │
|
||||||
|
├─────────────────────────────────┤
|
||||||
|
│ ☐ 예산 500만원 증액 합의 │
|
||||||
|
│ ☐ 일정 2주 연장 논의 │
|
||||||
|
│ ☐ 외주 업체 3곳 검토 │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
**특징:**
|
||||||
|
- 참석자는 클릭만 (텍스트 입력 없음)
|
||||||
|
- 개인별 체크 (다른 사람 체크 안 보임)
|
||||||
|
- AI 요약 시 체크 수에 따라 가중치 부여
|
||||||
|
- 편집 충돌 없음
|
||||||
|
|
||||||
|
**공수 절감:**
|
||||||
|
- 기존 방식 (공유+개인 메모): 38일
|
||||||
|
- 체크박스 방식: 7일
|
||||||
|
- **절감률: 82%**
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3.3 용어 설명 기능
|
||||||
|
|
||||||
|
#### 현재 문제점
|
||||||
|
- 일반 전문용어와 회사 특화 용어 구분 필요
|
||||||
|
- RAG 구축은 MVP 범위 초과
|
||||||
|
|
||||||
|
#### 개선안
|
||||||
|
**간소화된 JSON 용어 사전 + AI 보조**
|
||||||
|
|
||||||
|
##### 3.3.1 회사 용어 사전 구조
|
||||||
|
```json
|
||||||
|
// config/terms-dictionary.json
|
||||||
|
{
|
||||||
|
"terms": [
|
||||||
|
{
|
||||||
|
"keyword": "레거시",
|
||||||
|
"aliases": ["구시스템", "기존ERP"],
|
||||||
|
"definition": "2020년 구축한 우리 회사 통합 ERP 시스템",
|
||||||
|
"context": "현재 클라우드 기반 신규 시스템으로 마이그레이션 중",
|
||||||
|
"category": "시스템"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
##### 3.3.2 용어 표시 방식
|
||||||
|
```
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ [AI 주요 내용] [용어] │
|
||||||
|
├─────────────────────────────────┤
|
||||||
|
│ 📚 회의 중 언급된 용어 │
|
||||||
|
│ │
|
||||||
|
│ 🔹 레거시 ⭐ │
|
||||||
|
│ 2020년 구축한 우리 회사 ERP │
|
||||||
|
│ (회사 용어 사전) │
|
||||||
|
│ │
|
||||||
|
│ 🔹 POC │
|
||||||
|
│ Proof of Concept │
|
||||||
|
│ (AI 일반 설명) │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
|
||||||
|
⭐ = 회사 용어 사전 등록 항목
|
||||||
|
```
|
||||||
|
|
||||||
|
##### 3.3.3 처리 로직
|
||||||
|
```python
|
||||||
|
def explain_term(term, stt_context, company_dict):
|
||||||
|
# 1. 회사 용어 사전 확인 (우선)
|
||||||
|
if term in company_dict:
|
||||||
|
return company_dict[term] + " ⭐"
|
||||||
|
|
||||||
|
# 2. AI 일반 설명 (회의 맥락 포함)
|
||||||
|
else:
|
||||||
|
return ai_model.explain(term, context=stt_context)
|
||||||
|
```
|
||||||
|
|
||||||
|
**장점:**
|
||||||
|
- ✅ RAG 대비 공수 1/5 (4일 vs 20일)
|
||||||
|
- ✅ 초기 10-20개 용어만으로 80% 커버
|
||||||
|
- ✅ 비개발자도 JSON 편집 가능
|
||||||
|
- ✅ v1.5에서 자동 학습 추가 가능
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3.4 관련 회의록 기능
|
||||||
|
|
||||||
|
#### 기존 요구사항 (UFR-AI-040)
|
||||||
|
- ✅ AI가 벡터 유사도 검색으로 관련 회의록 자동 추천
|
||||||
|
- ✅ 관련도 배지 표시 (높음/중간/낮음)
|
||||||
|
- ✅ 최대 5개 회의록 연결
|
||||||
|
|
||||||
|
#### 현재 문제점
|
||||||
|
- 회의록 제목과 관련도 배지만 표시 (목록만 나열)
|
||||||
|
- 전체 회의록을 열어봐야 내용 파악 가능
|
||||||
|
- 회의 중 전체 회의록 읽을 시간 없음
|
||||||
|
|
||||||
|
#### 개선안
|
||||||
|
**기존 기능 유지 + 핵심 내용 요약 추가**
|
||||||
|
|
||||||
|
```
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ 📄 관련 회의록 │
|
||||||
|
├─────────────────────────────────┤
|
||||||
|
│ 🔥 95% 2024-01-15 주간 회의 │
|
||||||
|
│ 💡 현재 회의와 유사한 내용: │
|
||||||
|
│ • "예산 500만원으로 증액 1차 합의"│
|
||||||
|
│ • "외주 업체 A, B, C 3곳 후보" │
|
||||||
|
│ • "일정은 2주 더 필요하다는 의견"│
|
||||||
|
│ → 전체 회의록 보기 │
|
||||||
|
│ │
|
||||||
|
│ 🔥 78% 2024-01-08 기획 회의 │
|
||||||
|
│ 💡 현재 회의와 유사한 내용: │
|
||||||
|
│ • "POC 범위를 챗봇 기능만으로" │
|
||||||
|
│ • "개발 일정 2월 말까지" │
|
||||||
|
│ → 전체 회의록 보기 │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
##### 3.4.1 유사도 계산 로직
|
||||||
|
```python
|
||||||
|
def calculate_meeting_similarity(current, past):
|
||||||
|
# 1. 주제 유사도 (50%)
|
||||||
|
topic_similarity = cosine_similarity(
|
||||||
|
current.topics_vector,
|
||||||
|
past.topics_vector
|
||||||
|
)
|
||||||
|
|
||||||
|
# 2. 참석자 겹침 (20%)
|
||||||
|
attendee_overlap = len(
|
||||||
|
set(current.attendees) & set(past.attendees)
|
||||||
|
) / len(set(current.attendees))
|
||||||
|
|
||||||
|
# 3. 프로젝트/태그 일치 (30%)
|
||||||
|
project_match = 1.0 if current.project == past.project else 0.3
|
||||||
|
|
||||||
|
return (
|
||||||
|
topic_similarity * 0.5 +
|
||||||
|
attendee_overlap * 0.2 +
|
||||||
|
project_match * 0.3
|
||||||
|
)
|
||||||
|
```
|
||||||
|
|
||||||
|
##### 3.4.2 효율화 방안
|
||||||
|
```python
|
||||||
|
# 과거 회의록 저장 시 요약본 미리 생성
|
||||||
|
class Meeting:
|
||||||
|
content: str # 전체 내용
|
||||||
|
summary: str # AI 요약본 (미리 생성 - 배치)
|
||||||
|
topics: list # 주제 태그
|
||||||
|
|
||||||
|
# 실시간에는 요약본만 활용
|
||||||
|
def show_related_meetings(current):
|
||||||
|
for past in find_similar(current):
|
||||||
|
relevant_summary = extract_relevant_parts(
|
||||||
|
past.summary, # 미리 생성된 요약본
|
||||||
|
current.topics
|
||||||
|
)
|
||||||
|
```
|
||||||
|
|
||||||
|
**효과:**
|
||||||
|
- 회의록 찾는 시간: 5-10분 → 10초
|
||||||
|
- 컨텍스트 파악: 전체 읽기 → 요약으로 즉시
|
||||||
|
- 핵심 가치 강화: "업무지식 없어도" 실현
|
||||||
|
|
||||||
|
**추가 공수:** +1일 (최적화 적용 시)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3.5 중도 퇴장 기능
|
||||||
|
|
||||||
|
#### 현재 문제점
|
||||||
|
- 대시보드 → 회의진행 화면: 페이지 전환 (같은 탭)
|
||||||
|
- 브라우저 창 닫기 = 서비스 전체 종료
|
||||||
|
|
||||||
|
#### 개선안
|
||||||
|
**"나가기" 버튼 추가**
|
||||||
|
|
||||||
|
```
|
||||||
|
회의진행 화면 상단:
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ ← 나가기 | 회의 제목 | [회의종료] │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
**동작:**
|
||||||
|
```javascript
|
||||||
|
function exitMeeting() {
|
||||||
|
if (confirm('회의에서 나가시겠습니까?\n회의는 계속 진행됩니다.')) {
|
||||||
|
// 퇴장 이벤트 서버 전송
|
||||||
|
sendExitEvent(meeting.id, user.id);
|
||||||
|
|
||||||
|
// 대시보드로 복귀
|
||||||
|
navigateTo('02-대시보드.html');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**추가 공수:** +0.5일
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 4. 공수 및 일정 영향 분석
|
||||||
|
|
||||||
|
### 4.1 전체 공수 비교
|
||||||
|
|
||||||
|
| 항목 | 기존 계획 | 개선안 | 차이 |
|
||||||
|
|------|----------|--------|------|
|
||||||
|
| 메모 기능 | 38일 | 7일 | **-31일** ⬇️ |
|
||||||
|
| 용어 설명 | 20일 (RAG) | 4일 (JSON) | **-16일** ⬇️ |
|
||||||
|
| 관련 회의록 | 5일 (목록만) | 6일 (요약 추가) | **+1일** ⬆️ |
|
||||||
|
| 나가기 버튼 | - | 0.5일 | **+0.5일** ⬆️ |
|
||||||
|
| **순 절감** | - | - | **-45.5일** ⬇️ |
|
||||||
|
|
||||||
|
### 4.2 MVP 일정 영향
|
||||||
|
- ✅ 예산 및 일정 대폭 절감
|
||||||
|
- ✅ 핵심 기능에 집중 가능
|
||||||
|
- ✅ 빠른 시장 검증 가능
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 5. 유저스토리 수정안
|
||||||
|
|
||||||
|
### 5.1 신규 추가 (MVP 단순화)
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
# 회의 참석자 공통 기능
|
||||||
|
UFR-PART-010: 회의 입장
|
||||||
|
- 모든 참석자(생성자 포함)는 대시보드에서 "참여하기"로 회의 입장
|
||||||
|
- 회의진행 화면으로 페이지 전환 (같은 탭)
|
||||||
|
|
||||||
|
UFR-PART-020: AI 주요 내용 체크 (개인별)
|
||||||
|
- AI가 추출한 주요 내용을 체크박스로 표시
|
||||||
|
- 각 참석자는 중요하다고 생각하는 항목 독립적으로 체크
|
||||||
|
- 다른 참석자의 체크 여부는 보이지 않음
|
||||||
|
- AI 요약 시 체크 수에 따라 가중치 차등 적용
|
||||||
|
|
||||||
|
UFR-PART-030: 회의 중도 퇴장
|
||||||
|
- "나가기" 버튼으로 회의에서 퇴장
|
||||||
|
- 확인 모달: "회의에서 나가시겠습니까? 회의는 계속 진행됩니다"
|
||||||
|
- 퇴장 후 대시보드로 복귀
|
||||||
|
- 회의록은 종료 시 공유됨
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 회의 생성자 전용 기능
|
||||||
|
UFR-HOST-010: 회의 종료 권한
|
||||||
|
- 회의 생성자만 "회의 종료" 버튼으로 회의 종료 가능
|
||||||
|
- 일반 참석자에게는 버튼 숨김
|
||||||
|
|
||||||
|
UFR-HOST-020: 녹음 제어 권한
|
||||||
|
- 회의 생성자만 녹음 일시정지/재개/종료 가능
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 용어 설명 기능
|
||||||
|
UFR-TERM-010: 용어 자동 감지 및 표시
|
||||||
|
- AI가 STT 분석 중 중요 용어 자동 감지
|
||||||
|
- "용어" 탭에 실시간으로 표시
|
||||||
|
|
||||||
|
UFR-TERM-020: 회사 용어 사전 우선 표시
|
||||||
|
- 회사 용어 사전(JSON)에 등록된 용어는 ⭐ 표시
|
||||||
|
- 클릭 시 회사 특화 설명 표시
|
||||||
|
- 사전에 없는 용어는 AI가 일반 설명 + 회의 맥락 제공
|
||||||
|
|
||||||
|
UFR-TERM-030: 용어 관리 (관리자 기능)
|
||||||
|
- 관리자는 회사 용어 사전 등록/수정 가능
|
||||||
|
- JSON 파일 직접 편집
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
### 5.2 수정 필요
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
# 기존 수정 1
|
||||||
|
UFR-MEET-020: 회의 종료 권한
|
||||||
|
- 기존: "회의 생성자 또는 참석자가 회의 종료"
|
||||||
|
- 변경: "회의 생성자만 회의 종료 가능"
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 기존 수정 2 - UFR-AI-040 개선
|
||||||
|
UFR-AI-040: 관련 회의록 자동 연결 (개선)
|
||||||
|
|
||||||
|
기존 기능 (유지):
|
||||||
|
- ✅ AI가 벡터 유사도 검색으로 관련 회의록 자동 추천
|
||||||
|
- ✅ 같은 프로젝트/팀의 회의록 중 관련도 높은 순으로 표시
|
||||||
|
- ✅ 관련도 배지 표시
|
||||||
|
|
||||||
|
변경 및 개선 사항:
|
||||||
|
1. **최대 개수**: 5개 → 3개로 축소 (MVP)
|
||||||
|
2. **관련도 표시 방식**: 배지(높음/중간/낮음) → 퍼센트(95%, 78%) 변경
|
||||||
|
3. **유사 내용 요약 추가** (신규):
|
||||||
|
- AI가 추천한 각 회의록에서 현재 회의와 유사한 부분 자동 추출
|
||||||
|
- 유사한 내용을 3-5개 문장으로 요약하여 표시
|
||||||
|
- 전체 회의록을 열지 않아도 핵심 내용 파악 가능
|
||||||
|
- "전체 회의록 보기" 버튼으로 상세 내용 확인
|
||||||
|
4. **성능 최적화**:
|
||||||
|
- 과거 회의록 저장 시 요약본 미리 생성 (배치 처리)
|
||||||
|
- 실시간 요약은 캐싱된 데이터 활용
|
||||||
|
- 성능 목표: 1초 이내 표시
|
||||||
|
|
||||||
|
수행절차 (기존 유지):
|
||||||
|
1. 회의 종료 시 또는 회의록 작성 중 AI가 현재 회의 내용 분석
|
||||||
|
2. 벡터 유사도 검색을 통해 관련 회의록 탐색
|
||||||
|
3. 관련도가 높은 회의록 자동 연결 (최대 3개로 축소)
|
||||||
|
4. 각 회의록에서 유사한 내용 추출 및 요약 (신규 추가)
|
||||||
|
5. 회의 진행 화면, 회의록 상세 조회 화면에 표시
|
||||||
|
```
|
||||||
|
|
||||||
|
### 5.3 제거 (v2.0 이관)
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
# v2.0 백로그로 이관
|
||||||
|
- 공유 메모 입력 기능
|
||||||
|
- 개인 메모 기능
|
||||||
|
- 사용자 직접 용어 검색 기능
|
||||||
|
- 용어 북마크 기능
|
||||||
|
- 참석자별 세밀한 권한 UI
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 6. 화면설계 수정안
|
||||||
|
|
||||||
|
### 6.1 회의진행 화면 (05-회의진행.html)
|
||||||
|
|
||||||
|
#### 6.1.1 상단 헤더 수정
|
||||||
|
```
|
||||||
|
기존:
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ 회의 제목 | [회의 종료] │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
|
||||||
|
변경:
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ ← 나가기 | 회의 제목 | [회의종료] │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
|
||||||
|
조건부 표시:
|
||||||
|
- "회의 종료" 버튼: 생성자만 표시
|
||||||
|
- "나가기" 버튼: 모든 참석자 표시
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 6.1.2 탭 구조
|
||||||
|
```
|
||||||
|
┌─────────────────────────────────┐
|
||||||
|
│ [AI 주요 내용] [용어] [관련 회의록] │
|
||||||
|
├─────────────────────────────────┤
|
||||||
|
│ (탭 콘텐츠) │
|
||||||
|
└─────────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 6.1.3 AI 주요 내용 탭
|
||||||
|
```html
|
||||||
|
<div class="tab-content active">
|
||||||
|
<h3>🤖 AI가 파악한 주요 내용</h3>
|
||||||
|
<div class="ai-items">
|
||||||
|
<div class="ai-item">
|
||||||
|
<input type="checkbox" id="item1"
|
||||||
|
data-importance="high">
|
||||||
|
<label for="item1">예산 500만원 증액 합의</label>
|
||||||
|
<span class="timestamp">15:23</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 6.1.4 용어 탭
|
||||||
|
```html
|
||||||
|
<div class="tab-content">
|
||||||
|
<h3>📚 회의 중 언급된 용어</h3>
|
||||||
|
<div class="terms-list">
|
||||||
|
<div class="term-item company-term"
|
||||||
|
onclick="showTermDetail('legacy')">
|
||||||
|
<h4>🔹 레거시 ⭐</h4>
|
||||||
|
<p>2020년 구축한 우리 회사 ERP</p>
|
||||||
|
</div>
|
||||||
|
<div class="term-item ai-term"
|
||||||
|
onclick="showTermDetail('poc')">
|
||||||
|
<h4>🔹 POC</h4>
|
||||||
|
<p>Proof of Concept (개념 증명)</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 용어 상세 팝업 -->
|
||||||
|
<div class="modal" id="term-detail">
|
||||||
|
<div class="modal-content">
|
||||||
|
<h3>💡 레거시</h3>
|
||||||
|
<p class="definition">
|
||||||
|
2020년 구축한 우리 회사 통합 ERP 시스템
|
||||||
|
</p>
|
||||||
|
<p class="context">
|
||||||
|
현재 클라우드 기반 신규 시스템으로
|
||||||
|
마이그레이션 중입니다.
|
||||||
|
</p>
|
||||||
|
<button onclick="closeModal()">닫기</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 6.1.5 관련 회의록 탭
|
||||||
|
```html
|
||||||
|
<div class="tab-content">
|
||||||
|
<h3>📄 관련 회의록</h3>
|
||||||
|
<div class="related-meetings">
|
||||||
|
<div class="meeting-card">
|
||||||
|
<div class="similarity-badge">🔥 95% 관련도</div>
|
||||||
|
<h4>2024-01-15 주간 회의</h4>
|
||||||
|
<div class="meeting-summary">
|
||||||
|
<p class="summary-label">💡 현재 회의와 유사한 내용:</p>
|
||||||
|
<ul>
|
||||||
|
<li>"예산 500만원으로 증액 1차 합의"</li>
|
||||||
|
<li>"외주 업체 A, B, C 3곳 후보"</li>
|
||||||
|
<li>"일정은 2주 더 필요하다는 의견"</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<button class="btn-link"
|
||||||
|
onclick="openMeeting('meeting-123')">
|
||||||
|
전체 회의록 보기 →
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
```
|
||||||
|
|
||||||
|
### 6.2 인터랙션 추가
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
# 회의진행 화면 인터랙션
|
||||||
|
1. **나가기 버튼**
|
||||||
|
- 클릭 시 확인 모달 표시
|
||||||
|
- 확인 시 대시보드로 페이지 전환
|
||||||
|
|
||||||
|
2. **AI 주요 내용 체크박스**
|
||||||
|
- 체크 시 개인 선택 저장 (로컬 + 서버)
|
||||||
|
- 다른 사람 체크 여부는 표시 안 함
|
||||||
|
|
||||||
|
3. **용어 항목 클릭**
|
||||||
|
- 상세 설명 모달 표시
|
||||||
|
- 회사 용어는 ⭐ 배지 표시
|
||||||
|
|
||||||
|
4. **관련 회의록 카드**
|
||||||
|
- 유사도 점수 색상 코딩:
|
||||||
|
- 90% 이상: 빨강 (#FF6B6B)
|
||||||
|
- 70-89%: 주황 (#FFA94D)
|
||||||
|
- 50-69%: 노랑 (#FFD43B)
|
||||||
|
- "전체 회의록 보기" 버튼: 새 탭으로 열기
|
||||||
|
|
||||||
|
5. **회의 종료 버튼**
|
||||||
|
- 조건부 표시:
|
||||||
|
```javascript
|
||||||
|
if (currentUser.id === meeting.creator_id) {
|
||||||
|
showButton('endMeeting');
|
||||||
|
}
|
||||||
|
```
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 7. 프로토타입 수정 가이드
|
||||||
|
|
||||||
|
### 7.1 파일 수정 목록
|
||||||
|
1. `05-회의진행.html` - 메인 화면 구조 변경
|
||||||
|
2. `common.js` - 권한 체크 함수 추가
|
||||||
|
3. `02-대시보드.html` - 참여하기 버튼 동작 확인
|
||||||
|
|
||||||
|
### 7.2 주요 수정 사항
|
||||||
|
|
||||||
|
#### 7.2.1 권한 체크 함수 (common.js)
|
||||||
|
```javascript
|
||||||
|
/**
|
||||||
|
* 현재 사용자가 회의 생성자인지 확인
|
||||||
|
*/
|
||||||
|
function isCreator(meetingId, userId) {
|
||||||
|
const meeting = getMeetingById(meetingId);
|
||||||
|
return meeting && meeting.creator_id === userId;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 생성자 전용 UI 표시/숨김
|
||||||
|
*/
|
||||||
|
function updateCreatorUI(meetingId, userId) {
|
||||||
|
const isCreator = isCreator(meetingId, userId);
|
||||||
|
|
||||||
|
// 회의 종료 버튼
|
||||||
|
const endBtn = document.getElementById('end-meeting-btn');
|
||||||
|
if (endBtn) {
|
||||||
|
endBtn.style.display = isCreator ? 'block' : 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// 녹음 제어 버튼들
|
||||||
|
const recordControls = document.querySelectorAll('.record-control');
|
||||||
|
recordControls.forEach(btn => {
|
||||||
|
btn.style.display = isCreator ? 'inline-block' : 'none';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 7.2.2 나가기 버튼 (05-회의진행.html)
|
||||||
|
```javascript
|
||||||
|
function exitMeeting() {
|
||||||
|
if (confirm('회의에서 나가시겠습니까?\n회의는 계속 진행됩니다.')) {
|
||||||
|
// 퇴장 이벤트 전송
|
||||||
|
sendExitEvent(currentMeeting.id, currentUser.id);
|
||||||
|
|
||||||
|
// 대시보드로 복귀
|
||||||
|
navigateTo('02-대시보드.html');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 7.2.3 AI 주요 내용 체크박스
|
||||||
|
```javascript
|
||||||
|
// 개인별 체크 저장
|
||||||
|
function handleAIItemCheck(itemId, checked) {
|
||||||
|
const checkData = {
|
||||||
|
meeting_id: currentMeeting.id,
|
||||||
|
user_id: currentUser.id,
|
||||||
|
item_id: itemId,
|
||||||
|
checked: checked,
|
||||||
|
timestamp: new Date().toISOString()
|
||||||
|
};
|
||||||
|
|
||||||
|
// 로컬 저장
|
||||||
|
saveLocalCheck(checkData);
|
||||||
|
|
||||||
|
// 서버 전송 (비동기)
|
||||||
|
sendCheckToServer(checkData);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 7.2.4 용어 표시 로직
|
||||||
|
```javascript
|
||||||
|
// 용어 목록 렌더링
|
||||||
|
function renderTerms(terms) {
|
||||||
|
const container = document.getElementById('terms-list');
|
||||||
|
container.innerHTML = terms.map(term => `
|
||||||
|
<div class="term-item ${term.isCompanyTerm ? 'company-term' : 'ai-term'}"
|
||||||
|
onclick="showTermDetail('${term.id}')">
|
||||||
|
<h4>🔹 ${term.keyword} ${term.isCompanyTerm ? '⭐' : ''}</h4>
|
||||||
|
<p>${term.shortDefinition}</p>
|
||||||
|
</div>
|
||||||
|
`).join('');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 용어 상세 표시
|
||||||
|
function showTermDetail(termId) {
|
||||||
|
const term = getTermById(termId);
|
||||||
|
const modal = document.getElementById('term-detail-modal');
|
||||||
|
|
||||||
|
modal.querySelector('.term-title').textContent = term.keyword;
|
||||||
|
modal.querySelector('.term-definition').textContent = term.definition;
|
||||||
|
modal.querySelector('.term-context').textContent = term.context;
|
||||||
|
|
||||||
|
modal.classList.add('show');
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### 7.2.5 관련 회의록 표시
|
||||||
|
```javascript
|
||||||
|
// 관련 회의록 렌더링
|
||||||
|
function renderRelatedMeetings(meetings) {
|
||||||
|
const container = document.getElementById('related-meetings');
|
||||||
|
container.innerHTML = meetings.map(meeting => `
|
||||||
|
<div class="meeting-card">
|
||||||
|
<div class="similarity-badge"
|
||||||
|
style="background-color: ${getSimilarityColor(meeting.similarity)}">
|
||||||
|
🔥 ${Math.round(meeting.similarity * 100)}% 관련도
|
||||||
|
</div>
|
||||||
|
<h4>${meeting.date} ${meeting.title}</h4>
|
||||||
|
<div class="meeting-summary">
|
||||||
|
<p class="summary-label">💡 현재 회의와 유사한 내용:</p>
|
||||||
|
<ul>
|
||||||
|
${meeting.relevantSummary.map(item => `<li>"${item}"</li>`).join('')}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<button class="btn-link" onclick="openMeeting('${meeting.id}')">
|
||||||
|
전체 회의록 보기 →
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
`).join('');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 유사도에 따른 색상
|
||||||
|
function getSimilarityColor(similarity) {
|
||||||
|
if (similarity >= 0.9) return '#FF6B6B'; // 빨강
|
||||||
|
if (similarity >= 0.7) return '#FFA94D'; // 주황
|
||||||
|
return '#FFD43B'; // 노랑
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 8. v2.0 백로그
|
||||||
|
|
||||||
|
### 8.1 메모 기능 고도화
|
||||||
|
- 공유 메모 실시간 동기화
|
||||||
|
- 개인 메모 기능
|
||||||
|
- 메모 검색 및 필터
|
||||||
|
- 메모 히스토리 추적
|
||||||
|
|
||||||
|
### 8.2 용어 사전 고도화
|
||||||
|
- 사용자 직접 용어 검색
|
||||||
|
- 용어 북마크 기능
|
||||||
|
- 용어 설명 편집 기능
|
||||||
|
- 과거 회의록 기반 자동 학습
|
||||||
|
- 전체 RAG 시스템 구축
|
||||||
|
|
||||||
|
### 8.3 권한 관리 고도화
|
||||||
|
- 세밀한 참석자 권한 설정
|
||||||
|
- 안건별 편집 권한 제어
|
||||||
|
- 참석자 강제 퇴장 기능
|
||||||
|
|
||||||
|
### 8.4 관련 회의록 고도화
|
||||||
|
- 용어-회의록 연계 표시
|
||||||
|
- 관련 문서 통합 검색
|
||||||
|
- 프로젝트 문서/위키 연동
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 9. 결론 및 다음 단계
|
||||||
|
|
||||||
|
### 9.1 결론
|
||||||
|
이번 개선안을 통해:
|
||||||
|
- ✅ MVP 범위 명확화
|
||||||
|
- ✅ 핵심 가치 "업무지식 없어도 누락 없이" 실현
|
||||||
|
- ✅ 개발 공수 45.5일 절감
|
||||||
|
- ✅ 예산 및 일정 준수
|
||||||
|
|
||||||
|
### 9.2 다음 단계
|
||||||
|
1. **유저스토리 업데이트** (design/userstory.md)
|
||||||
|
- 신규 스토리 추가
|
||||||
|
- 기존 스토리 수정
|
||||||
|
- v2.0 백로그 섹션 추가
|
||||||
|
|
||||||
|
2. **화면설계 업데이트** (design/uiux/uiux.md)
|
||||||
|
- 05-회의진행 화면 상세 명세
|
||||||
|
- 인터랙션 시나리오 추가
|
||||||
|
- 권한별 UI 조건 명시
|
||||||
|
|
||||||
|
3. **프로토타입 수정** (design/uiux/prototype/05-회의진행.html)
|
||||||
|
- 나가기 버튼 추가
|
||||||
|
- 체크박스 방식 메모 구현
|
||||||
|
- 용어 탭 구현
|
||||||
|
- 관련 회의록 요약 표시
|
||||||
|
|
||||||
|
4. **백엔드 API 설계 반영**
|
||||||
|
- 권한 체크 API
|
||||||
|
- 체크 데이터 저장 API
|
||||||
|
- 용어 사전 API
|
||||||
|
- 관련 회의록 추천 API
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
**보고서 종료**
|
||||||
Loading…
x
Reference in New Issue
Block a user