공유하기 기능 제거 및 문서 업데이트

- .gitignore 업데이트
- 대시보드 프로토타입 수정
- 회의록공유 프로토타입 삭제
- UI/UX 설계서 업데이트
- 공유하기 제거 검토 보고서 추가
- 유저스토리 업데이트

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
yabo0812 2025-10-23 10:27:44 +09:00
parent 9794926651
commit 4d8878aad3
6 changed files with 316 additions and 716 deletions

5
.gitignore vendored
View File

@ -4,4 +4,7 @@
.env .env
design/uiux/ref_img/ design/uiux/ref_img/
reference/sampleimg/ reference/sampleimg/
settings.local.json *copy.html
design/*copy.md
design/*/*copy.md
.claude/settings.local.json

View File

@ -137,11 +137,11 @@
} }
} }
/* 헤더 */ /* 헤더 - 개선안 A: 간결한 인사 + 실질적 정보 */
.header { .header {
background: var(--white); background: var(--white);
border-bottom: 1px solid var(--gray-300); border-bottom: 1px solid var(--gray-300);
padding: var(--space-lg) var(--space-md); padding: var(--space-md) var(--space-md);
} }
@media (min-width: 768px) { @media (min-width: 768px) {
@ -150,16 +150,19 @@
} }
} }
.header-title { .header-greeting {
font-size: var(--font-h2); font-size: var(--font-h3);
font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold);
color: var(--gray-900); color: var(--gray-900);
margin-bottom: var(--space-xs); margin-bottom: var(--space-xs);
display: flex;
align-items: center;
gap: var(--space-xs);
} }
.header-subtitle { .header-info {
font-size: var(--font-small); font-size: var(--font-body);
color: var(--gray-500); color: var(--gray-600);
} }
/* 메인 콘텐츠 */ /* 메인 콘텐츠 */
@ -176,36 +179,67 @@
} }
} }
/* 통계 카드 */ /* 통계 카드 - 개선안 A: 컴팩트 수평 배치 */
.stats-grid { .stats-compact {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: var(--space-md);
margin-bottom: var(--space-xl);
}
.stat-card {
background: var(--white); background: var(--white);
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
padding: var(--space-lg); padding: var(--space-md);
margin-bottom: var(--space-lg);
box-shadow: var(--shadow-sm); box-shadow: var(--shadow-sm);
} }
.stat-icon { .stats-compact-title {
font-size: 32px;
margin-bottom: var(--space-sm);
}
.stat-label {
font-size: var(--font-small); font-size: var(--font-small);
color: var(--gray-500); font-weight: var(--font-weight-semibold);
margin-bottom: var(--space-xs); color: var(--gray-700);
margin-bottom: var(--space-sm);
display: flex;
align-items: center;
gap: var(--space-xs);
} }
.stat-value { .stats-compact-items {
font-size: var(--font-h2); display: flex;
justify-content: space-around;
align-items: center;
gap: var(--space-md);
}
.stats-compact-item {
display: flex;
align-items: center;
gap: var(--space-xs);
font-size: var(--font-small);
color: var(--gray-600);
}
.stats-compact-icon {
font-size: 20px;
}
.stats-compact-value {
font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold);
color: var(--gray-900); color: var(--gray-900);
margin-left: 2px;
}
@media (min-width: 768px) {
.stats-compact {
padding: var(--space-lg);
}
.stats-compact-items {
justify-content: flex-start;
gap: var(--space-xl);
}
.stats-compact-item {
font-size: var(--font-body);
}
.stats-compact-icon {
font-size: 24px;
}
} }
/* 섹션 헤더 */ /* 섹션 헤더 */
@ -528,28 +562,30 @@
<!-- 메인 콘텐츠 --> <!-- 메인 콘텐츠 -->
<main class="main-content"> <main class="main-content">
<!-- 헤더 --> <!-- 헤더 - 개선안 A: 간결한 인사 + 실질적 정보 -->
<header class="header"> <header class="header">
<h1 class="header-title">안녕하세요, 김민준님!</h1> <h1 class="header-greeting">
<p class="header-subtitle">오늘의 일정을 확인하세요</p> 안녕하세요 👋
</h1>
<p class="header-info" id="header-meeting-info">오늘 <strong id="header-meeting-count">2</strong>건의 회의가 예정되어 있어요</p>
</header> </header>
<!-- 통계 --> <!-- 통계 - 개선안 A: 컴팩트 수평 배치 -->
<section class="stats-grid"> <section class="stats-compact">
<div class="stat-card"> <div class="stats-compact-title">📊 오늘의 현황</div>
<div class="stat-icon">📅</div> <div class="stats-compact-items">
<div class="stat-label">예정된 회의</div> <div class="stats-compact-item">
<div class="stat-value" id="stat-scheduled">3</div> <span class="stats-compact-icon">📅</span>
</div> <span>예정 <span class="stats-compact-value" id="stat-scheduled">2</span></span>
<div class="stat-card"> </div>
<div class="stat-icon"></div> <div class="stats-compact-item">
<div class="stat-label">진행 중 Todo</div> <span class="stats-compact-icon"></span>
<div class="stat-value" id="stat-todos">1</div> <span>진행 <span class="stats-compact-value" id="stat-todos">1</span></span>
</div> </div>
<div class="stat-card"> <div class="stats-compact-item">
<div class="stat-icon">📈</div> <span class="stats-compact-icon">📈</span>
<div class="stat-label">Todo 완료율</div> <span>완료 <span class="stats-compact-value" id="stat-completion">0%</span></span>
<div class="stat-value" id="stat-completion">33%</div> </div>
</div> </div>
</section> </section>
@ -585,17 +621,6 @@
<!-- 동적 생성 --> <!-- 동적 생성 -->
</div> </div>
</section> </section>
<!-- 공유받은 회의록 -->
<section>
<div class="section-header">
<h2 class="section-title">공유받은 회의록</h2>
<a href="12-회의록목록조회.html" class="section-link">전체 보기 →</a>
</div>
<div class="minutes-list" id="shared-minutes">
<!-- 동적 생성 -->
</div>
</section>
</main> </main>
<!-- 하단 네비게이션 (모바일) --> <!-- 하단 네비게이션 (모바일) -->
@ -813,7 +838,7 @@
} }
/** /**
* 통계 업데이트 * 통계 업데이트 - 개선안 A: 헤더 정보 포함
*/ */
function updateStats() { function updateStats() {
const scheduled = SAMPLE_MEETINGS.filter(m => m.status === 'scheduled' || m.status === 'ongoing').length; const scheduled = SAMPLE_MEETINGS.filter(m => m.status === 'scheduled' || m.status === 'ongoing').length;
@ -822,6 +847,15 @@
const completedTodos = SAMPLE_TODOS.filter(t => t.assignee.id === currentUser.id && t.status === 'completed').length; const completedTodos = SAMPLE_TODOS.filter(t => t.assignee.id === currentUser.id && t.status === 'completed').length;
const completion = totalTodos > 0 ? Math.round((completedTodos / totalTodos) * 100) : 0; const completion = totalTodos > 0 ? Math.round((completedTodos / totalTodos) * 100) : 0;
// 헤더 정보 업데이트
$('#header-meeting-count').textContent = scheduled;
if (scheduled === 0) {
$('#header-meeting-info').innerHTML = '예정된 회의가 없습니다';
} else {
$('#header-meeting-info').innerHTML = `오늘 <strong>${scheduled}</strong>건의 회의가 예정되어 있어요`;
}
// 통계 카드 업데이트
$('#stat-scheduled').textContent = scheduled; $('#stat-scheduled').textContent = scheduled;
$('#stat-todos').textContent = todos; $('#stat-todos').textContent = todos;
$('#stat-completion').textContent = completion + '%'; $('#stat-completion').textContent = completion + '%';

View File

@ -1,491 +0,0 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회의록 공유 - 회의록 서비스</title>
<link rel="stylesheet" href="common.css">
<style>
/* Body 배경 흰색으로 변경 */
body {
background: var(--white);
}
/* 헤더 - 회의록 수정화면과 통일 */
.header {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 64px;
background: var(--white);
border-bottom: 1px solid var(--gray-300);
box-shadow: var(--shadow-sm);
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 var(--space-md);
z-index: 100;
}
.header-left {
display: flex;
align-items: center;
gap: var(--space-md);
}
.icon-btn {
background: transparent;
border: none;
font-size: 24px;
color: var(--gray-700);
cursor: pointer;
padding: var(--space-sm);
transition: color var(--transition-fast);
}
.icon-btn:hover {
color: var(--primary);
}
.header-title {
font-size: var(--font-h3);
font-weight: var(--font-weight-bold);
color: var(--gray-900);
}
/* 메인 콘텐츠 */
.main-content {
margin-top: 64px;
padding: var(--space-md);
padding-bottom: 100px;
}
@media (min-width: 768px) {
.main-content {
max-width: 800px;
margin-left: auto;
margin-right: auto;
padding-bottom: var(--space-lg);
}
}
/* 섹션 타이틀 */
.section-title {
font-size: var(--font-h3);
font-weight: var(--font-weight-bold);
color: var(--gray-900);
margin-bottom: var(--space-md);
}
/* 라디오 버튼 그룹 */
.radio-group {
display: flex;
flex-direction: column;
gap: var(--space-sm);
}
.radio-option {
display: flex;
align-items: center;
gap: var(--space-sm);
padding: var(--space-md);
border: 2px solid var(--gray-300);
border-radius: var(--radius-md);
cursor: pointer;
transition: all var(--transition-fast);
}
.radio-option:hover {
border-color: var(--primary-light);
background: var(--primary-light);
}
.radio-option.selected {
border-color: var(--primary);
background: var(--primary-light);
}
.radio-option input[type="radio"] {
width: 20px;
height: 20px;
accent-color: var(--primary);
}
.radio-option label {
flex: 1;
cursor: pointer;
font-weight: var(--font-weight-medium);
}
/* 참석자 체크리스트 */
.participant-list {
display: none;
margin-top: var(--space-md);
padding: var(--space-md);
background: var(--gray-100);
border-radius: var(--radius-md);
}
.participant-list.show {
display: block;
}
.participant-item {
display: flex;
align-items: center;
gap: var(--space-md);
padding: var(--space-sm) 0;
}
/* 토글 스위치 */
.toggle-group {
margin-bottom: var(--space-md);
}
.toggle-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: var(--space-md);
background: var(--white);
border-radius: var(--radius-md);
box-shadow: var(--shadow-sm);
margin-bottom: var(--space-sm);
}
.toggle-label {
font-weight: var(--font-weight-medium);
color: var(--gray-900);
}
.toggle-switch {
position: relative;
width: 48px;
height: 24px;
background: var(--gray-300);
border-radius: 12px;
cursor: pointer;
transition: background var(--transition-normal);
}
.toggle-switch.active {
background: var(--primary);
}
.toggle-switch::after {
content: '';
position: absolute;
top: 2px;
left: 2px;
width: 20px;
height: 20px;
background: var(--white);
border-radius: 50%;
transition: transform var(--transition-normal);
}
.toggle-switch.active::after {
transform: translateX(24px);
}
/* 옵션 콘텐츠 */
.toggle-content {
display: none;
margin-top: var(--space-md);
padding: var(--space-md);
background: var(--gray-100);
border-radius: var(--radius-md);
}
.toggle-content.show {
display: block;
}
/* 공유 이력 */
.history-list {
margin-top: var(--space-md);
}
.history-item {
padding: var(--space-md);
background: var(--white);
border-radius: var(--radius-md);
box-shadow: var(--shadow-sm);
margin-bottom: var(--space-sm);
}
.history-header {
display: flex;
justify-content: space-between;
margin-bottom: var(--space-sm);
}
.history-date {
font-size: var(--font-small);
color: var(--gray-500);
}
.history-info {
font-size: var(--font-small);
color: var(--gray-700);
}
/* 하단 버튼 - 회의록 수정화면과 통일 */
.bottom-buttons {
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: var(--space-md);
background: var(--white);
border-top: 1px solid var(--gray-300);
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
z-index: 100;
display: flex;
gap: var(--space-md);
}
@media (min-width: 768px) {
.bottom-buttons {
position: static;
margin-top: var(--space-lg);
border-top: none;
box-shadow: none;
padding: 0;
}
}
</style>
</head>
<body>
<!-- Header -->
<header class="header">
<div class="header-left">
<button class="icon-btn" onclick="history.back()"></button>
<h1 class="header-title">회의록 공유</h1>
</div>
</header>
<!-- Main Content -->
<main class="main-content">
<!-- 공유 대상 -->
<section class="mb-lg">
<h3 class="section-title">공유 대상</h3>
<div class="radio-group">
<div class="radio-option selected" id="shareAllOption" onclick="selectShareTarget('all')">
<input type="radio" name="shareTarget" id="shareAll" checked>
<label for="shareAll">참석자 전체</label>
</div>
<div class="radio-option" id="shareSelectedOption" onclick="selectShareTarget('selected')">
<input type="radio" name="shareTarget" id="shareSelected">
<label for="shareSelected">특정 참석자 선택</label>
</div>
</div>
<div class="participant-list" id="participantList">
<div id="participantCheckList"></div>
</div>
</section>
<!-- 공유 권한 -->
<section class="mb-lg">
<h3 class="section-title">공유 권한</h3>
<div class="form-group">
<select class="form-control" id="sharePermission">
<option value="readonly" selected>읽기 전용</option>
<option value="comment">댓글 가능</option>
<option value="edit">편집 가능</option>
</select>
</div>
</section>
<!-- 공유 방식 -->
<section class="mb-lg">
<h3 class="section-title">공유 방식</h3>
<div class="checkbox-wrapper mb-md">
<input type="checkbox" class="checkbox" id="emailShare" checked>
<label for="emailShare">이메일 발송</label>
</div>
<button class="btn btn-secondary" style="width: 100%;" onclick="copyShareLink()">
🔗 링크 복사
</button>
</section>
<!-- 링크 보안 설정 -->
<section class="mb-lg">
<h3 class="section-title">링크 보안 설정 (선택)</h3>
<div class="toggle-group">
<div class="toggle-item">
<span class="toggle-label">유효기간 설정</span>
<div class="toggle-switch" id="expiryToggle" onclick="toggleOption('expiry')"></div>
</div>
<div class="toggle-content" id="expiryContent">
<select class="form-control">
<option value="7">7일</option>
<option value="30" selected>30일</option>
<option value="90">90일</option>
<option value="0">무제한</option>
</select>
</div>
<div class="toggle-item">
<span class="toggle-label">비밀번호 설정</span>
<div class="toggle-switch" id="passwordToggle" onclick="toggleOption('password')"></div>
</div>
<div class="toggle-content" id="passwordContent">
<input type="password" class="form-control" placeholder="비밀번호 입력">
</div>
</div>
</section>
<!-- 공유 이력 -->
<section>
<h3 class="section-title">공유 이력</h3>
<div class="history-list" id="shareHistory"></div>
</section>
</main>
<!-- 하단 버튼 -->
<div class="bottom-buttons">
<button class="btn btn-primary" style="flex: 1;" onclick="shareMinutes()">
공유하기
</button>
</div>
<script src="common.js"></script>
<script>
// 페이지 초기화
function initPage() {
renderParticipantList();
renderShareHistory();
}
// 공유 대상 선택
function selectShareTarget(target) {
const allOption = $('#shareAllOption');
const selectedOption = $('#shareSelectedOption');
const participantList = $('#participantList');
if (target === 'all') {
allOption.classList.add('selected');
selectedOption.classList.remove('selected');
$('#shareAll').checked = true;
participantList.classList.remove('show');
} else {
allOption.classList.remove('selected');
selectedOption.classList.add('selected');
$('#shareSelected').checked = true;
participantList.classList.add('show');
}
}
// 참석자 체크리스트 렌더링
function renderParticipantList() {
const participants = SAMPLE_MEETINGS[0].participants;
const container = $('#participantCheckList');
participants.forEach(participant => {
const item = createElement('div', { className: 'participant-item' }, `
<input type="checkbox" class="checkbox" id="participant-${participant.id}" value="${participant.id}" checked>
${createAvatar(participant, 'sm')}
<label for="participant-${participant.id}">${participant.name}</label>
`);
container.appendChild(item);
});
}
// 토글 옵션
function toggleOption(option) {
const toggle = $(`#${option}Toggle`);
const content = $(`#${option}Content`);
toggle.classList.toggle('active');
content.classList.toggle('show');
}
// 링크 복사
function copyShareLink() {
const link = `https://meeting.example.com/share/meeting-001-${Date.now()}`;
// 클립보드 복사 (실제 구현)
if (navigator.clipboard) {
navigator.clipboard.writeText(link).then(() => {
showToast('링크가 복사되었습니다', 'success');
});
} else {
// Fallback
showToast('링크가 복사되었습니다', 'success');
}
}
// 공유 이력 렌더링
function renderShareHistory() {
const history = [
{ date: '2025-10-20 14:30', targets: '참석자 전체', permission: '읽기 전용' },
{ date: '2025-10-19 16:45', targets: '박서연, 이준호', permission: '편집 가능' }
];
const container = $('#shareHistory');
if (history.length === 0) {
container.innerHTML = '<div class="empty-state"><p>공유 이력이 없습니다</p></div>';
return;
}
history.forEach(item => {
const historyItem = createElement('div', { className: 'history-item' }, `
<div class="history-header">
<span class="history-date">${item.date}</span>
${createBadge(item.permission, 'draft')}
</div>
<div class="history-info">
<strong>대상:</strong> ${item.targets}
</div>
`);
container.appendChild(historyItem);
});
}
// 회의록 공유
function shareMinutes() {
const emailShare = $('#emailShare').checked;
const permission = $('#sharePermission').value;
const shareAll = $('#shareAll').checked;
// 특정 참석자 선택 시 검증
if (!shareAll) {
const selectedParticipants = Array.from($$('#participantCheckList input[type="checkbox"]:checked'));
if (selectedParticipants.length === 0) {
showToast('공유할 참석자를 선택해주세요', 'error');
return;
}
}
// 로딩 시뮬레이션
const btn = event.target;
const originalText = btn.textContent;
btn.textContent = '공유 중...';
btn.disabled = true;
setTimeout(() => {
btn.textContent = originalText;
btn.disabled = false;
showToast('회의록이 공유되었습니다', 'success');
// 캘린더 등록 제안
setTimeout(() => {
if (confirm('다음 회의 일정을 캘린더에 등록하시겠습니까?')) {
showToast('캘린더에 등록되었습니다', 'success');
}
navigateTo('01-대시보드.html');
}, 1500);
}, 2000);
}
// 페이지 로드 시 초기화
initPage();
</script>
</body>
</html>

View File

@ -85,11 +85,10 @@
| 05 | 회의진행 | UFR-MEET-030, UFR-STT-010/020, UFR-AI-010, UFR-COLLAB-010 | 높음 | 실시간 회의 진행 및 회의록 작성 | X | X | | | 05 | 회의진행 | UFR-MEET-030, UFR-STT-010/020, UFR-AI-010, UFR-COLLAB-010 | 높음 | 실시간 회의 진행 및 회의록 작성 | X | X | |
| 06 | 검증완료 | UFR-COLLAB-030 | 중간 | 섹션별 검증 | X | X | | | 06 | 검증완료 | UFR-COLLAB-030 | 중간 | 섹션별 검증 | X | X | |
| 07 | 회의종료 | UFR-MEET-040, UFR-MEET-050 | 높음 | 회의 통계 및 최종 확정 | X | X | | | 07 | 회의종료 | UFR-MEET-040, UFR-MEET-050 | 높음 | 회의 통계 및 최종 확정 | X | X | |
| 08 | 회의록공유 | UFR-MEET-060 | 높음 | 공유 설정 | X | O | | | 08 | Todo관리 | UFR-TODO-010, UFR-TODO-030 | 높음 | Todo 목록 및 진행 관리 | O | X | |
| 09 | Todo관리 | UFR-TODO-010, UFR-TODO-030 | 높음 | Todo 목록 및 진행 관리 | O | X | | | 09 | 회의록상세조회 | UFR-MEET-045 | 중간 | 회의록 상세 보기 | X | O | |
| 10 | 회의록상세조회 | UFR-MEET-045 | 중간 | 회의록 상세 보기 | X | O | | | 10 | 회의록수정 | UFR-MEET-055 | 중간 | 지난 회의록 수정 | X | O | |
| 11 | 회의록수정 | UFR-MEET-055 | 중간 | 지난 회의록 수정 | X | O | | | 11 | 회의록목록조회 | UFR-MEET-030, UFR-MEET-045 | 높음 | 회의록 목록 필터링/정렬/검색 | O | X | |
| 12 | 회의록목록조회 | UFR-MEET-030, UFR-MEET-045 | 높음 | 회의록 목록 필터링/정렬/검색 | O | X | |
--- ---
@ -100,7 +99,7 @@
#### 시나리오 1: 새 회의 진행 (Full Flow) #### 시나리오 1: 새 회의 진행 (Full Flow)
``` ```
로그인 → 대시보드 → 회의예약 → 템플릿선택 → 회의진행 로그인 → 대시보드 → 회의예약 → 템플릿선택 → 회의진행
→ 검증완료 → 회의종료 → 회의록공유 → 대시보드 → 검증완료 → 회의종료 → 대시보드
``` ```
#### 시나리오 2: 지난 회의록 조회 및 수정 #### 시나리오 2: 지난 회의록 조회 및 수정
@ -129,8 +128,7 @@ graph TD
E --> F{검증 완료?} E --> F{검증 완료?}
F -->|Yes| G[회의종료] F -->|Yes| G[회의종료]
F -->|No| E F -->|No| E
G --> H[회의록공유] G --> B
H --> B
B --> I[회의록상세조회] B --> I[회의록상세조회]
I --> J{수정 필요?} I --> J{수정 필요?}
@ -222,21 +220,26 @@ graph TD
- 진행중 회의 (참여 가능한 회의) - 진행중 회의 (참여 가능한 회의)
3. **내 Todo 우선순위별 표시** (지연중 → 진행중 → 미진행 → 완료, 최대 5개) 3. **내 Todo 우선순위별 표시** (지연중 → 진행중 → 미진행 → 완료, 최대 5개)
4. **내 회의록** (참여자/생성자로 등록된 최근 3개, 상태 포함) 4. **내 회의록** (참여자/생성자로 등록된 최근 3개, 상태 포함)
5. **공유받은 회의록** (최근 공유받은 순 3개) 5. 전역 검색
6. 전역 검색
#### UI 구성요소 #### UI 구성요소
**Mobile (320px~768px)** **Mobile (320px~768px)**
- **헤더** (상단) - **헤더** (상단) - **개선안 A 적용 (v1.5)**
- "안녕하세요, {사용자명}님!" (H2, Bold) - "안녕하세요 👋" (H3, Bold)
- 부제: "오늘의 일정을 확인하세요" (Body-sm, 회색) - 부제: "오늘 {N}건의 회의가 예정되어 있어요" (Body, 회색)
- N = 예정된 회의 개수 (동적 업데이트)
- 예정된 회의가 없을 경우: "예정된 회의가 없습니다"
- **메인 콘텐츠** (스크롤, padding-bottom: 80px, background: gray-50) - **메인 콘텐츠** (스크롤, padding-bottom: 80px, background: gray-50)
- **통계 카드 그리드** (3개 카드) - **통계 카드 컴팩트 배치** (단일 카드) - **개선안 A 적용 (v1.5)**
- "예정된 회의": 개수 표시 (아이콘: 📅) - 제목: "📊 오늘의 현황" (H5, Semibold)
- "진행 중 Todo": 개수 표시 (아이콘: ✅) - 수평 배치 (flex, space-around):
- "Todo 완료율": 퍼센트 표시 (아이콘: 📈) - "📅 예정 {N}" (Icon + Label + Value)
- "✅진행 {N}" (Icon + Label + Value)
- "📈 완료 {N}%" (Icon + Label + Value)
- 높이: ~80px (기존 대비 70% 감소)
- 반응형: 태블릿 이상에서 justify-content: flex-start, gap 증가
- **최근 회의** 섹션 - **최근 회의** 섹션
- 헤더: "예정된 회의" (H4) + "전체 보기 →" 링크 - 헤더: "예정된 회의" (H4) + "전체 보기 →" 링크
@ -301,18 +304,6 @@ graph TD
- 클릭 시: 회의록 상세 화면으로 이동 - 클릭 시: 회의록 상세 화면으로 이동
- 빈 상태: "작성한 회의록이 없습니다. 첫 회의를 시작해보세요!" - 빈 상태: "작성한 회의록이 없습니다. 첫 회의를 시작해보세요!"
- **공유받은 회의록** 카드 (개선)
- 헤더: "공유받은 회의록" (H4) + "전체 보기 →" 링크 (회의록 목록 화면으로 이동)
- **최근 공유받은 회의록 리스트** (최대 3개):
- 정렬: 최근 공유받은 순
- 각 항목:
- 회의 제목 (H5)
- 공유자 정보 (아바타 + 이름)
- 공유 일시 (상대 시간)
- 상태 배지
- 클릭 시: 회의록 상세 화면으로 이동 (읽기 전용)
- 빈 상태: "공유받은 회의록이 없습니다"
**Mobile (320px~768px)** **Mobile (320px~768px)**
- **하단 네비게이션**: [Mobile 하단 네비게이션](#mobile-하단-네비게이션-320px768px) 참조 (홈 활성) - **하단 네비게이션**: [Mobile 하단 네비게이션](#mobile-하단-네비게이션-320px768px) 참조 (홈 활성)
@ -339,11 +330,7 @@ graph TD
- **내 회의록 리스트** - **내 회의록 리스트**
- 화이트 카드 배경 - 화이트 카드 배경
- 전체보기 → 12-회의록목록조회.html - 전체보기 → 11-회의록목록조회.html
- **공유받은 회의록 리스트**
- 화이트 카드 배경
- 전체보기 → 12-회의록목록조회.html
- **하단 네비게이션**: 숨김 (데스크톱에서는 사이드바 사용) - **하단 네비게이션**: 숨김 (데스크톱에서는 사이드바 사용)
@ -433,12 +420,6 @@ graph TD
- 정렬: 생성일시 (최근 순) - 정렬: 생성일시 (최근 순)
- 최대 3개 - 최대 3개
- **공유받은 회의록**:
- 회의 ID, 제목, 공유자 정보, 공유 일시, 상태
- 필터: 공유 대상 = 현재 사용자
- 정렬: 공유 일시 (최근 순)
- 최대 3개
- **통계 데이터** (Desktop): - **통계 데이터** (Desktop):
- 예정된/진행중 회의 수 (진행중 회의 수 별도 배지) - 예정된/진행중 회의 수 (진행중 회의 수 별도 배지)
- 진행 중 Todo 수 - 진행 중 Todo 수
@ -447,7 +428,6 @@ graph TD
- **연동**: - **연동**:
- Meeting 서비스 (회의 정보, 회의록 정보) - Meeting 서비스 (회의 정보, 회의록 정보)
- Todo 서비스 (Todo 목록) - Todo 서비스 (Todo 목록)
- Share 서비스 (공유 정보)
#### 에러 처리 #### 에러 처리
- **데이터 로딩 실패**: - **데이터 로딩 실패**:
@ -463,7 +443,6 @@ graph TD
- 예정된/진행중 회의: "예정된 회의가 없습니다" - 예정된/진행중 회의: "예정된 회의가 없습니다"
- Todo: "할당된 Todo가 없습니다" - Todo: "할당된 Todo가 없습니다"
- 내 회의록: "작성한 회의록이 없습니다. 첫 회의를 시작해보세요!" - 내 회의록: "작성한 회의록이 없습니다. 첫 회의를 시작해보세요!"
- 공유받은 회의록: "공유받은 회의록이 없습니다"
- **진행중 회의 참여 실패**: - **진행중 회의 참여 실패**:
- "회의에 참여할 수 없습니다." 토스트 메시지 - "회의에 참여할 수 없습니다." 토스트 메시지
@ -1108,94 +1087,7 @@ graph TD
--- ---
### 08-회의록공유 ### 08-Todo관리
#### 개요
- **목적**: 회의록 공유 설정 및 참석자에게 전송
- **관련 유저스토리**: UFR-MEET-060
- **비즈니스 중요도**: 높음
- **접근 경로**: 회의종료 → "회의록 공유하기" 또는 대시보드 → 회의록 상세 → "공유"
#### 주요 기능
1. 공유 대상 선택 (전체/특정 참석자)
2. 공유 권한 설정 (읽기 전용/댓글/편집)
3. 공유 방식 선택 (이메일/링크)
4. 링크 보안 설정 (유효기간, 비밀번호)
5. 공유 이력 확인
#### UI 구성요소
**Mobile (320px~768px)**
- **헤더**
- 뒤로가기 버튼
- "회의록 공유" 타이틀
- "공유하기" 버튼 (Primary)
- **공유 설정 폼**
- **공유 대상**
- "참석자 전체" 라디오 버튼 (기본 선택)
- "특정 참석자 선택" 라디오 버튼
- 참석자 목록 (체크박스)
- **공유 권한**
- 드롭다운 또는 라디오 버튼
- 읽기 전용 (기본)
- 댓글 가능
- 편집 가능
- **공유 방식**
- "이메일 발송" 체크박스 (기본 선택)
- "링크 복사" 버튼
- **링크 보안 설정** (선택)
- "유효기간 설정" 토글
- 기간 선택 (7일, 30일, 90일, 무제한)
- "비밀번호 설정" 토글
- 비밀번호 입력 필드
- **공유 이력** (하단)
- 이전 공유 기록 리스트
- 각 항목: 공유 날짜, 대상, 권한
**Tablet/Desktop (768px+)**
- 좌측: 공유 설정 폼 (모바일과 동일)
- 우측: 회의록 미리보기
#### 인터랙션
1. **공유 대상 선택**
- "참석자 전체" 선택: 모든 참석자에게 발송
- "특정 참석자 선택": 체크박스로 개별 선택
2. **링크 생성 및 복사**
- "링크 복사" 클릭: 고유 URL 생성 → 클립보드 복사
- 토스트 메시지: "링크가 복사되었습니다"
3. **공유 실행**
- "공유하기" 버튼 클릭:
- 이메일 발송 진행 (로딩 인디케이터)
- 성공: "회의록이 공유되었습니다" 토스트
- 다음 회의 일정 언급 확인: 자동 캘린더 등록 제안
#### 데이터 요구사항
- **입력**:
- 회의 ID
- 공유 대상 (사용자 ID 배열)
- 공유 권한 (읽기/댓글/편집)
- 공유 방식 (이메일/링크)
- 링크 설정 (유효기간, 비밀번호)
- **출력**:
- 공유 링크 URL
- 이메일 발송 결과
- **연동**: Meeting 서비스, Notification 서비스
#### 에러 처리
- **공유 대상 미선택**: "공유할 대상을 선택해주세요"
- **이메일 발송 실패**: "일부 참석자에게 이메일 발송에 실패했습니다" + 재시도 옵션
- **링크 생성 실패**: "링크 생성에 실패했습니다. 다시 시도해주세요"
---
### 09-Todo관리
#### 개요 #### 개요
- **목적**: 할당된 Todo 목록 조회 및 진행 상황 관리 - **목적**: 할당된 Todo 목록 조회 및 진행 상황 관리
@ -1282,7 +1174,7 @@ graph TD
--- ---
### 10-회의록상세조회 ### 09-회의록상세조회
#### 개요 #### 개요
- **목적**: 지난 회의록의 전체 내용 및 상세 정보 확인 - **목적**: 지난 회의록의 전체 내용 및 상세 정보 확인
@ -1305,7 +1197,7 @@ graph TD
- **헤더** - **헤더**
- 뒤로가기 버튼 - 뒤로가기 버튼
- 회의 제목 - 회의 제목
- 메뉴 버튼 (수정, 공유, 삭제) - 메뉴 버튼 (수정, 삭제)
- **기본 정보 카드** - **기본 정보 카드**
- 회의 일시 - 회의 일시
@ -1462,7 +1354,7 @@ graph TD
--- ---
### 11-회의록수정 ### 10-회의록수정
#### 개요 #### 개요
- **목적**: 지난 회의록 조회 및 수정 - **목적**: 지난 회의록 조회 및 수정
@ -1581,7 +1473,7 @@ graph TD
--- ---
### 12-회의록목록조회 ### 11-회의록목록조회
#### 개요 #### 개요
- **목적**: 회의록 목록 조회 및 필터링/정렬/검색 기능 제공 - **목적**: 회의록 목록 조회 및 필터링/정렬/검색 기능 제공
@ -1589,13 +1481,12 @@ graph TD
- **비즈니스 중요도**: 높음 - **비즈니스 중요도**: 높음
- **접근 경로**: - **접근 경로**:
- 대시보드 → "내 회의록" 전체 보기 - 대시보드 → "내 회의록" 전체 보기
- 대시보드 → "공유받은 회의록" 전체 보기
- 하단 네비게이션 → "회의록" 메뉴 - 하단 네비게이션 → "회의록" 메뉴
#### 주요 기능 #### 주요 기능
1. **회의록 목록 조회** (참여/생성/공유받은 회의록) 1. **회의록 목록 조회** (참여/생성 회의록)
2. **필터링 기능**: 2. **필터링 기능**:
- 참여 유형: 공유받은 회의, 참석한 회의, 생성한 회의 - 참여 유형: 참석한 회의, 생성한 회의
- 상태: 전체, 작성중, 확정완료 - 상태: 전체, 작성중, 확정완료
3. **정렬 기능**: 3. **정렬 기능**:
- 최신 회의순 (회의 일시 기준, 최근 순) - 최신 회의순 (회의 일시 기준, 최근 순)
@ -1611,7 +1502,7 @@ graph TD
**Mobile (320px~768px)** **Mobile (320px~768px)**
- **헤더** (Fixed, 상단) - **헤더** (Fixed, 상단)
- 뒤로가기 버튼 - 뒤로가기 버튼
- "내 회의록" 타이틀 (또는 "공유받은 회의록") - "내 회의록" 타이틀
- 검색 아이콘 (검색창 포커스) - 검색 아이콘 (검색창 포커스)
- **필터 및 정렬** (상단, 스크롤 가능) - **필터 및 정렬** (상단, 스크롤 가능)
@ -1625,7 +1516,6 @@ graph TD
- **참여 유형 필터** (탭 형식, 선택): - **참여 유형 필터** (탭 형식, 선택):
- 전체 (기본 선택) - 전체 (기본 선택)
- 공유받은 회의
- 참석한 회의 - 참석한 회의
- 생성한 회의 - 생성한 회의
@ -1789,7 +1679,7 @@ graph TD
- **프로필** (사용자 프로필 및 설정) - **프로필** (사용자 프로필 및 설정)
- 아이콘: 👤 (24px) - 아이콘: 👤 (24px)
- 텍스트: "프로필" (12px) - 텍스트: "프로필" (12px)
- **사용 화면**: 02-대시보드, 09-Todo관리, 12-회의록목록조회 - **사용 화면**: 02-대시보드, 08-Todo관리, 11-회의록목록조회
#### Desktop 좌측 사이드바 (768px+) #### Desktop 좌측 사이드바 (768px+)
- **위치**: Fixed, 좌측 (width: 240px) - **위치**: Fixed, 좌측 (width: 240px)
@ -1802,11 +1692,10 @@ graph TD
- 대시보드 - 대시보드
- 내 회의록 - 내 회의록
- Todo - Todo
- 공유받은 회의록
- **하단 영역**: - **하단 영역**:
- 사용자 정보 (아바타 + 이름) - 사용자 정보 (아바타 + 이름)
- 로그아웃 - 로그아웃
- **사용 화면**: 02-대시보드, 09-Todo관리, 12-회의록목록조회 - **사용 화면**: 02-대시보드, 08-Todo관리, 11-회의록목록조회
#### 상단 헤더 (공통) #### 상단 헤더 (공통)
- **위치**: Sticky, 상단 - **위치**: Sticky, 상단
@ -2034,7 +1923,7 @@ graph TD
| 1.0 | 2025-10-21 | 이미준 | 최초 작성 - 11개 화면 설계 완료 | | 1.0 | 2025-10-21 | 이미준 | 최초 작성 - 11개 화면 설계 완료 |
| 1.1 | 2025-10-21 | 이미준 | AI 요약 및 참고자료 기능 추가<br>- 05-회의진행: AI 회의 내용 요약 자동 생성 및 참고자료 자동 연결 추가<br>- 10-회의록상세조회: 섹션별 AI 요약 표시 및 참고자료 영역 추가<br>- 11-회의록수정: AI 요약 수정 및 참고자료 편집 기능 추가<br>- 관련 유저스토리: UFR-AI-040 (관련 회의록 자동 연결) | | 1.1 | 2025-10-21 | 이미준 | AI 요약 및 참고자료 기능 추가<br>- 05-회의진행: AI 회의 내용 요약 자동 생성 및 참고자료 자동 연결 추가<br>- 10-회의록상세조회: 섹션별 AI 요약 표시 및 참고자료 영역 추가<br>- 11-회의록수정: AI 요약 수정 및 참고자료 편집 기능 추가<br>- 관련 유저스토리: UFR-AI-040 (관련 회의록 자동 연결) |
| 1.1.1 | 2025-10-21 | 이미준 | 회의록 상세 화면 구조 개선 (프로토타입 기반)<br>- 10-회의록상세조회: 탭 기반 네비게이션 추가 (회의록/대시보드)<br>- 대시보드 탭 추가: 핵심내용, 결정사항, Todo 진행상황, 참고자료 섹션<br>- 참고자료 관련도 점수 표시 (백분율 + 색상 코딩)<br>- 참고자료 카테고리 탭 (관련 회의록/프로젝트 문서/이슈 트래커/위키 페이지)<br>- 참조: design-gappa/uiux/prototype 파일 (11-회의록대시보드.html, 05-회의진행.html) | | 1.1.1 | 2025-10-21 | 이미준 | 회의록 상세 화면 구조 개선 (프로토타입 기반)<br>- 10-회의록상세조회: 탭 기반 네비게이션 추가 (회의록/대시보드)<br>- 대시보드 탭 추가: 핵심내용, 결정사항, Todo 진행상황, 참고자료 섹션<br>- 참고자료 관련도 점수 표시 (백분율 + 색상 코딩)<br>- 참고자료 카테고리 탭 (관련 회의록/프로젝트 문서/이슈 트래커/위키 페이지)<br>- 참조: design-gappa/uiux/prototype 파일 (11-회의록대시보드.html, 05-회의진행.html) |
| 1.1.2 | 2025-10-21 | 이미준 | 대시보드 및 회의록 목록 화면 개선 (사용자 피드백 반영)<br>- 02-대시보드: 예정된 회의 카드 추가, Todo 우선순위 정렬 개선 (지연→진행→미진행→완료, 최대 5개), 내 회의록 상태 배지 추가, 공유받은 회의록 섹션 개선<br>- 12-회의록목록조회: 신규 화면 추가 (필터링/정렬/검색 기능)<br> - 필터: 참여 유형(공유받은/참석한/생성한), 상태(전체/작성중/확정완료)<br> - 정렬: 최신 회의순/최신 업데이트순/제목 가나다순<br> - 검색: 제목/참석자/키워드 통합 검색<br> - 통계 정보 표시 (전체/작성중/확정완료 개수)<br>- 참조: design/uiux/prototype_fix 및 design-gappa/uiux/prototype 파일 | | 1.1.2 | 2025-10-21 | 이미준 | 대시보드 및 회의록 목록 화면 개선 (사용자 피드백 반영)<br>- 02-대시보드: 예정된 회의 카드 추가, Todo 우선순위 정렬 개선 (지연→진행→미진행→완료, 최대 5개), 내 회의록 상태 배지 추가<br>- 11-회의록목록조회: 신규 화면 추가 (필터링/정렬/검색 기능)<br> - 필터: 참여 유형(참석한/생성한), 상태(전체/작성중/확정완료)<br> - 정렬: 최신 회의순/최신 업데이트순/제목 가나다순<br> - 검색: 제목/참석자/키워드 통합 검색<br> - 통계 정보 표시 (전체/작성중/확정완료 개수)<br>- 참조: design/uiux/prototype_fix 및 design-gappa/uiux/prototype 파일 |
| 1.2 | 2025-10-21 | 이미준 | 대시보드 진행중 회의 표시 기능 추가<br>- 02-대시보드: 예정된 회의 카드에 진행중 회의 포함<br> - 진행중 회의 우선 표시 (최상단)<br> - "진행중" 배지 (빨강/주황, 깜빡임 애니메이션)<br> - "참여하기" 버튼으로 즉시 회의 참여 가능<br> - 정렬: 진행중 회의 → 예정된 회의 (일시 순)<br>- 데이터 요구사항: 회의 상태 (ongoing) 추가, 진행중 회의 필터 조건 정의<br>- 에러 처리: 진행중 회의 참여 실패 시나리오 추가 (종료됨/권한없음/네트워크오류) | | 1.2 | 2025-10-21 | 이미준 | 대시보드 진행중 회의 표시 기능 추가<br>- 02-대시보드: 예정된 회의 카드에 진행중 회의 포함<br> - 진행중 회의 우선 표시 (최상단)<br> - "진행중" 배지 (빨강/주황, 깜빡임 애니메이션)<br> - "참여하기" 버튼으로 즉시 회의 참여 가능<br> - 정렬: 진행중 회의 → 예정된 회의 (일시 순)<br>- 데이터 요구사항: 회의 상태 (ongoing) 추가, 진행중 회의 필터 조건 정의<br>- 에러 처리: 진행중 회의 참여 실패 시나리오 추가 (종료됨/권한없음/네트워크오류) |
| 1.2.1 | 2025-10-21 | 이미준 | 대시보드 예정된 회의 역할 기반 접근 제어 추가<br>- 02-대시보드: 예정된 회의에 생성자/참석자별 차별화된 권한 적용<br> - **생성자 권한**: 회의 수정 가능 (크라운 아이콘 표시, "수정" 버튼)<br> - **참석자 권한**: 시작 10분 전부터 참여 가능 ("참여하기" 버튼 조건부 활성화)<br> - 실시간 타이머 표시 (참여 가능 시간 카운트다운, 1분 간격 갱신)<br>- UI 구성요소: 역할 표시 (크라운 아이콘), 액션 버튼 (역할 및 시간 기반 조건부 렌더링)<br>- 인터랙션: 생성자 수정 플로우, 참석자 시간 기반 참여 플로우, 타이머 자동 갱신<br>- 데이터 요구사항: 생성자 ID, 사용자 역할 (creator\|attendee), 참여 가능 시간 계산<br>- 에러 처리: 시간 제한 접근, 권한 제한 수정 시도, 회의 수정 실패 시나리오 추가 | | 1.2.1 | 2025-10-21 | 이미준 | 대시보드 예정된 회의 역할 기반 접근 제어 추가<br>- 02-대시보드: 예정된 회의에 생성자/참석자별 차별화된 권한 적용<br> - **생성자 권한**: 회의 수정 가능 (크라운 아이콘 표시, "수정" 버튼)<br> - **참석자 권한**: 시작 10분 전부터 참여 가능 ("참여하기" 버튼 조건부 활성화)<br> - 실시간 타이머 표시 (참여 가능 시간 카운트다운, 1분 간격 갱신)<br>- UI 구성요소: 역할 표시 (크라운 아이콘), 액션 버튼 (역할 및 시간 기반 조건부 렌더링)<br>- 인터랙션: 생성자 수정 플로우, 참석자 시간 기반 참여 플로우, 타이머 자동 갱신<br>- 데이터 요구사항: 생성자 ID, 사용자 역할 (creator\|attendee), 참여 가능 시간 계산<br>- 에러 처리: 시간 제한 접근, 권한 제한 수정 시도, 회의 수정 실패 시나리오 추가 |
| 1.2.2 | 2025-10-21 | 최유진 | 회의진행 화면 개선 및 스타일 가이드 작성<br>- 05-회의진행: 사용성 개선<br> - **참고자료 링크**: 새 탭(target="_blank")으로 열기 기능 추가 (녹음 중 페이지 이탈 방지)<br> - **참석자 추가 초대**: 회의 진행 중 참석자 추가 초대 기능 추가<br> - 초대 모달: 이메일 입력, 조직 내 사용자 검색, 권한 선택 (편집 가능/읽기 전용)<br> - 실시간 참석자 목록 업데이트 및 알림 발송 (이메일/앱 푸시)<br> - 권한 제어: 생성자는 모든 참석자 초대 가능, 일반 참석자는 회의 설정에 따라 결정<br>- design/uiux/style-guide.md: 신규 작성 (reference/sampleimg 샘플 이미지 기반)<br> - 민트 그린(#4DD5A7) 프라이머리 컬러 적용<br> - Mobile First 디자인 시스템 정의<br> - 15개 섹션: 컬러, 타이포그래피, 간격, 카드, 버튼, 배지, 아이콘, 네비게이션, 폼, 모달, 애니메이션, 접근성, 반응형 등 | | 1.2.2 | 2025-10-21 | 최유진 | 회의진행 화면 개선 및 스타일 가이드 작성<br>- 05-회의진행: 사용성 개선<br> - **참고자료 링크**: 새 탭(target="_blank")으로 열기 기능 추가 (녹음 중 페이지 이탈 방지)<br> - **참석자 추가 초대**: 회의 진행 중 참석자 추가 초대 기능 추가<br> - 초대 모달: 이메일 입력, 조직 내 사용자 검색, 권한 선택 (편집 가능/읽기 전용)<br> - 실시간 참석자 목록 업데이트 및 알림 발송 (이메일/앱 푸시)<br> - 권한 제어: 생성자는 모든 참석자 초대 가능, 일반 참석자는 회의 설정에 따라 결정<br>- design/uiux/style-guide.md: 신규 작성 (reference/sampleimg 샘플 이미지 기반)<br> - 민트 그린(#4DD5A7) 프라이머리 컬러 적용<br> - Mobile First 디자인 시스템 정의<br> - 15개 섹션: 컬러, 타이포그래피, 간격, 카드, 버튼, 배지, 아이콘, 네비게이션, 폼, 모달, 애니메이션, 접근성, 반응형 등 |
@ -2044,6 +1933,8 @@ graph TD
| 1.3.2 | 2025-10-21 | 도그냥 | 회의진행 화면 참석자 탭 개선 및 UI 일관성 강화<br>- **05-회의진행**: 참석자 탭 참석자 추가 기능 및 UI 정리<br> - **참석자 추가 폼 추가**: 이메일 입력 필드(form-control) + "초대" 버튼(btn btn-primary btn-sm)<br> - 이메일 유효성 검증: 정규식으로 형식 체크<br> - 빈 값 체크: "이메일 주소를 입력해주세요" 경고 토스트<br> - 잘못된 형식: "올바른 이메일 형식이 아닙니다" 오류 토스트<br> - 성공: "{email}에게 초대 링크가 전송되었습니다" 토스트 + 입력창 초기화<br> - **참석자 상태 표시 제거**: 발언 중/온라인 등 상태 아이콘 및 텍스트 모두 제거<br> - **참석자 수 동적 업데이트**: 4명으로 업데이트 (최유진 추가)<br> - **참고자료 영역 제거**: 회의개요 탭의 참고자료 섹션 삭제 (우측 관련회의록 탭으로 통합)<br>- **버튼 스타일 통일**: 모든 버튼에 .btn 기본 클래스 추가<br> - 편집 버튼 (4개 섹션): btn btn-ghost btn-sm<br> - AI 제안 적용 버튼 (3개): btn btn-primary btn-sm<br> - 수정 버튼 (3개): btn btn-ghost btn-sm<br> - 하단 일시정지/종료 버튼: btn btn-ghost, btn btn-error<br>- **검색창 스타일 통일**: 용어사전 검색창을 .input → .form-control 클래스로 변경<br>- 프로토타입 파일 수정: design/uiux/prototype/05-회의진행.html | | 1.3.2 | 2025-10-21 | 도그냥 | 회의진행 화면 참석자 탭 개선 및 UI 일관성 강화<br>- **05-회의진행**: 참석자 탭 참석자 추가 기능 및 UI 정리<br> - **참석자 추가 폼 추가**: 이메일 입력 필드(form-control) + "초대" 버튼(btn btn-primary btn-sm)<br> - 이메일 유효성 검증: 정규식으로 형식 체크<br> - 빈 값 체크: "이메일 주소를 입력해주세요" 경고 토스트<br> - 잘못된 형식: "올바른 이메일 형식이 아닙니다" 오류 토스트<br> - 성공: "{email}에게 초대 링크가 전송되었습니다" 토스트 + 입력창 초기화<br> - **참석자 상태 표시 제거**: 발언 중/온라인 등 상태 아이콘 및 텍스트 모두 제거<br> - **참석자 수 동적 업데이트**: 4명으로 업데이트 (최유진 추가)<br> - **참고자료 영역 제거**: 회의개요 탭의 참고자료 섹션 삭제 (우측 관련회의록 탭으로 통합)<br>- **버튼 스타일 통일**: 모든 버튼에 .btn 기본 클래스 추가<br> - 편집 버튼 (4개 섹션): btn btn-ghost btn-sm<br> - AI 제안 적용 버튼 (3개): btn btn-primary btn-sm<br> - 수정 버튼 (3개): btn btn-ghost btn-sm<br> - 하단 일시정지/종료 버튼: btn btn-ghost, btn btn-error<br>- **검색창 스타일 통일**: 용어사전 검색창을 .input → .form-control 클래스로 변경<br>- 프로토타입 파일 수정: design/uiux/prototype/05-회의진행.html |
| 1.3.3 | 2025-10-21 | 도그냥 | UI/UX 설계 문서 최적화 및 중복 제거<br>- **공통 UI 컴포넌트 섹션 신규 작성**: 반복 사용되는 UI 컴포넌트를 공통 섹션으로 분리<br> - **Mobile 하단 네비게이션**: 위치, 배경, 그림자, 3개 항목 (홈/회의록/Todo) 상세 스펙 정의<br> - **Desktop 좌측 사이드바**: 로고 영역, 메뉴 리스트, 사용자 정보 영역 상세 스펙 정의<br> - **상단 헤더**: Mobile/Desktop별 제목, 액션 버튼 배치 가이드<br>- **공통 에러 메시지 표준 섹션 신규 작성**: 반복 사용되는 에러 메시지를 표준화<br> - **네트워크 오류**: 자동 재시도 3회 (exponential backoff), 토스트 메시지, 재시도 버튼<br> - **데이터 로딩 실패**: 스켈레톤 UI 30초, 타임아웃 처리, 재시도 버튼<br> - **권한 오류**: 401/403 에러 처리, 명확한 안내 메시지<br> - **인증 오류**: 토큰 만료 자동 갱신, 로그인 리다이렉트<br> - **입력 검증 오류**: 실시간 인라인 검증, 포커스 이동<br> - **서버 오류**: 500 에러 에러 ID 제공, 고객센터 안내<br>- **중복 내용 참조 링크 교체**: 8개 화면에서 반복된 네비게이션/에러 메시지 설명을 공통 섹션 참조로 변경<br> - 01-로그인, 02-대시보드, 12-회의록목록조회 등<br> - 예상 파일 크기 감소: 1,500~2,200자 (약 8~10%)<br>- **목차 업데이트**: 공통 UI 컴포넌트, 공통 에러 메시지 표준 섹션 추가 | | 1.3.3 | 2025-10-21 | 도그냥 | UI/UX 설계 문서 최적화 및 중복 제거<br>- **공통 UI 컴포넌트 섹션 신규 작성**: 반복 사용되는 UI 컴포넌트를 공통 섹션으로 분리<br> - **Mobile 하단 네비게이션**: 위치, 배경, 그림자, 3개 항목 (홈/회의록/Todo) 상세 스펙 정의<br> - **Desktop 좌측 사이드바**: 로고 영역, 메뉴 리스트, 사용자 정보 영역 상세 스펙 정의<br> - **상단 헤더**: Mobile/Desktop별 제목, 액션 버튼 배치 가이드<br>- **공통 에러 메시지 표준 섹션 신규 작성**: 반복 사용되는 에러 메시지를 표준화<br> - **네트워크 오류**: 자동 재시도 3회 (exponential backoff), 토스트 메시지, 재시도 버튼<br> - **데이터 로딩 실패**: 스켈레톤 UI 30초, 타임아웃 처리, 재시도 버튼<br> - **권한 오류**: 401/403 에러 처리, 명확한 안내 메시지<br> - **인증 오류**: 토큰 만료 자동 갱신, 로그인 리다이렉트<br> - **입력 검증 오류**: 실시간 인라인 검증, 포커스 이동<br> - **서버 오류**: 500 에러 에러 ID 제공, 고객센터 안내<br>- **중복 내용 참조 링크 교체**: 8개 화면에서 반복된 네비게이션/에러 메시지 설명을 공통 섹션 참조로 변경<br> - 01-로그인, 02-대시보드, 12-회의록목록조회 등<br> - 예상 파일 크기 감소: 1,500~2,200자 (약 8~10%)<br>- **목차 업데이트**: 공통 UI 컴포넌트, 공통 에러 메시지 표준 섹션 추가 |
| 1.4 | 2025-10-22 | 이미준 | 프로토타입 기반 네비게이션 사양 업데이트<br>- **Mobile 하단 네비게이션**: 4개 메뉴 항목으로 복원 (홈/회의록/Todo/프로필)<br> - 프로필 메뉴 추가: 👤 아이콘, 사용자 정보 및 설정 접근<br> - 프로토타입 구현 기준 반영 (12-회의록목록조회.html 등)<br>- **일관성 개선**: 프로토타입과 UI/UX 설계서 간 네비게이션 사양 통일<br>- **스타일 가이드 동기화**: design/uiux/style-guide.md v1.2와 정합성 확보 | | 1.4 | 2025-10-22 | 이미준 | 프로토타입 기반 네비게이션 사양 업데이트<br>- **Mobile 하단 네비게이션**: 4개 메뉴 항목으로 복원 (홈/회의록/Todo/프로필)<br> - 프로필 메뉴 추가: 👤 아이콘, 사용자 정보 및 설정 접근<br> - 프로토타입 구현 기준 반영 (12-회의록목록조회.html 등)<br>- **일관성 개선**: 프로토타입과 UI/UX 설계서 간 네비게이션 사양 통일<br>- **스타일 가이드 동기화**: design/uiux/style-guide.md v1.2와 정합성 확보 |
| 1.5 | 2025-10-23 | 강지수 | 대시보드 모바일 UI/UX 개선 (360px 최적화)<br>- **헤더 개선안 A 적용**: 간결한 인사 + 실질적 정보<br> - "안녕하세요 👋" (H3, Bold)<br> - "오늘 {N}건의 회의가 예정되어 있어요" (동적 업데이트)<br> - 2줄 구조 제거로 세로 공간 절약<br>- **통계 카드 개선안 A 적용**: 컴팩트 수평 배치<br> - 단일 카드 "📊 오늘의 현황" (H5, Semibold)<br> - 수평 배치: "📅 예정 {N}", "✅ 진행 {N}", "📈 완료 {N}%"<br> - 높이 ~80px (기존 대비 70% 감소)<br> - 반응형: 태블릿 이상에서 justify-content: flex-start<br>- **프로토타입 파일**: design/uiux/prototype/02-대시보드-개선.html 신규 생성<br>- **모바일 우선 반응형 설계**: 웹/태블릿 화면에서도 자연스러운 레이아웃 유지<br>- **참조**: design/uiux/ref_img/레이아웃 이상.png (개선 요구사항 이미지) |
| 1.6 | 2025-10-23 | 강지수 | 회의록 공유 기능 전면 제거<br>- **제거 배경**: 회의 참가자가 아니면 대상자 선정 불가능, 기능 중복 및 논리적 모순 해결<br>- **유저스토리**: UFR-MEET-060 (회의록공유) 제거<br>- **UI/UX 설계서**:<br> - 08-회의록공유 화면 전체 제거<br> - 02-대시보드: "공유받은 회의록" 섹션 제거<br> - 09-회의록상세조회: 공유 버튼 제거 (메뉴: 수정/삭제만 유지)<br> - 11-회의록목록조회: 카테고리 필터 수정 (전체/참석한 회의/생성한 회의)<br> - Desktop 사이드바: "공유받은 회의록" 메뉴 제거<br>- **화면 번호 재정렬**: 08-Todo관리, 09-회의록상세조회, 10-회의록수정, 11-회의록목록조회<br>- **프로토타입 파일**: 08-회의록공유.html 삭제 예정<br>- **검토 문서**: design/uiux/crosscheck-report.md (상세 검토 의견 및 수정 계획) |
--- ---

View File

@ -0,0 +1,185 @@
# 회의록 공유 기능 제거 검토 의견서
**작성자**: 강지수 (Product Designer)
**작성일**: 2025-10-23
**문서 목적**: 회의록 공유 기능 제거에 대한 검토 의견 및 수정 계획
---
## 📋 요약
회의록 공유 기능은 **회의 참가자가 아닌 경우 대상자 선정이 불가능**하므로, 실제로는 필요하지 않은 기능입니다. 회의 참가자들은 이미 회의록에 접근할 수 있는 권한이 있으므로, 별도의 공유 기능이 중복됩니다.
**결론**: 회의록 공유 기능 전체 제거 권장
---
## 🔍 현재 상황 분석
### 문제점
1. **논리적 모순**: 회의 참가자가 아니면 대상자를 선정할 수 없음
2. **기능 중복**: 회의 참석자는 이미 회의록 접근 권한 보유
3. **불필요한 복잡성**: 공유 관리 로직 및 UI가 시스템을 복잡하게 만듦
### 현재 접근 권한 구조
- **회의 참가자**: 이미 회의록 접근 권한 있음 (조회/수정)
- **회의 생성자**: 회의록 전체 관리 권한
- **비참가자**: 회의록 접근 권한 없음 → 공유 기능으로도 추가 불가
---
## 🗂️ 영향 받는 문서 및 화면
### 1. 유저스토리 (design/userstory.md)
**제거 대상**:
- **UFR-MEET-060: [회의록공유]** (라인 353-373)
- 회의록 공유 설정
- 공유 링크 생성
- 공유 대상 및 권한 설정
- 공유 링크 보안 (유효기간, 비밀번호)
### 2. UI/UX 설계서 (design/uiux/uiux.md)
**제거 대상**:
#### a. 02-대시보드
- "공유받은 회의록" 섹션 (라인 310-320, 350-352)
- 최근 공유받은 회의록 목록 (최대 3개)
- 전체 보기 링크
- 빈 상태 메시지
#### b. 08-회의록공유 (화면 전체)
- 프로토타입 목록 8번 항목
- 전체 화면 설계
- 공유 설정 인터페이스
#### c. 10-회의록상세조회
- 부가 기능 중 "회의록 공유 버튼" (라인 302)
- 공유 설정 화면으로 이동하는 버튼
#### d. 12-회의록목록조회
- 카테고리 필터 중 "공유받은 회의" 옵션 (라인 250)
- 공유 관련 필터링 기능
### 3. 프로토타입 HTML 파일
**제거 대상**:
- **08-회의록공유.html** - 전체 파일 삭제
- **02-대시보드.html / 02-대시보드-개선.html** - 공유받은 회의록 섹션 제거
- **10-회의록상세조회.html** - 공유 버튼 제거
- **12-회의록목록조회.html** - 카테고리 필터 수정
---
## ✅ 수정 권장 사항
### 1. 개념 정리
**기존**: 공유 기능을 통한 회의록 배포
**변경 후**: 회의 참가자 관리를 통한 자동 접근 권한 부여
### 2. 권한 관리 방식 변경
- 회의 예약 시 참석자 초대 (UFR-MEET-010)
- 회의 진행 중 참석자 추가/제거 가능 (필요 시)
- 모든 참석자는 자동으로 회의록 접근 권한 보유
### 3. 대시보드 섹션 재구성
**기존**:
- 내 회의록
- 공유받은 회의록 (제거)
**변경 후**:
- **참석한 회의** (통합)
- 내가 생성한 회의 + 초대받은 회의
- 필터링: 전체 / 생성한 회의 / 참석한 회의
- 상태 표시: 작성중 / 확정완료
### 4. 회의록 목록 카테고리 단순화
**기존**:
```
전체 / 공유받은 회의 / 참석한 회의 / 생성한 회의
```
**변경 후**:
```
전체 / 참석한 회의 / 생성한 회의
```
---
## 📊 수정 우선순위 및 작업 계획
| 우선순위 | 문서/파일 | 수정 내용 | 예상 시간 |
|---------|----------|----------|----------|
| 1⃣ 높음 | **유저스토리** (userstory.md) | UFR-MEET-060 제거 | 10분 |
| 1⃣ 높음 | **UI/UX 설계서** (uiux.md) | 08-회의록공유 화면 제거 및 관련 섹션 수정 | 20분 |
| 2⃣ 중간 | **프로토타입 08-회의록공유.html** | 파일 삭제 | 1분 |
| 2⃣ 중간 | **프로토타입 02-대시보드** | 공유받은 회의록 섹션 제거 | 15분 |
| 2⃣ 중간 | **프로토타입 10-회의록상세조회** | 공유 버튼 제거 | 10분 |
| 3⃣ 낮음 | **프로토타입 12-회의록목록조회** | 카테고리 필터 수정 | 10분 |
**총 예상 시간**: 약 66분
---
## 📝 추가 고려사항
### 1. 알림 기능 유지
공유 기능은 제거하지만, **참석자 초대 알림**은 유지:
- ✅ 회의 예약 시 참석자에게 이메일 알림 발송
- ✅ 회의록 확정 시 참석자에게 완료 알림 발송
- ✅ Todo 할당 시 담당자에게 알림 발송
### 2. 접근 권한 명확화
| 역할 | 권한 |
|------|------|
| **참석자** | 회의록 조회 + 댓글 + 수정 (실시간 협업) |
| **생성자** | 회의록 전체 관리 (확정, 삭제 등) |
| **비참가자** | 접근 불가 (공유 기능 없음) |
### 3. 회의록 검색 기능 강화
공유 기능 대신 **참석한 회의록 검색 기능** 강화 권장:
- 제목, 내용, 참석자, 날짜로 검색
- 태그/카테고리 필터링
- 빠른 접근을 위한 북마크 기능 (선택적)
---
## 🎯 결론
### 회의록 공유 기능 제거가 타당한 이유
1. ✅ **논리적 모순 해결**: 회의 참가자가 아니면 대상자 선정 불가
2. ✅ **기능 중복 제거**: 참석자는 이미 접근 권한 보유
3. ✅ **UI/UX 단순화**: 불필요한 화면 및 버튼 제거로 사용자 경험 개선
4. ✅ **개발 범위 축소**: 공유 관리 API 및 로직 제거로 개발 효율화
### 권장 사항
**즉시 수정**: 유저스토리 → UI/UX 설계서 → 프로토타입 순서로 수정 작업 진행
---
## 📌 작업 체크리스트
- [ ] 유저스토리 UFR-MEET-060 제거
- [ ] UI/UX 설계서 08-회의록공유 화면 제거
- [ ] UI/UX 설계서 02-대시보드 "공유받은 회의록" 섹션 제거
- [ ] UI/UX 설계서 10-회의록상세조회 공유 버튼 제거
- [ ] UI/UX 설계서 12-회의록목록조회 카테고리 필터 수정
- [ ] 프로토타입 08-회의록공유.html 삭제
- [ ] 프로토타입 02-대시보드.html 수정
- [ ] 프로토타입 02-대시보드-개선.html 수정
- [ ] 프로토타입 10-회의록상세조회.html 수정
- [ ] 프로토타입 12-회의록목록조회.html 수정
---
**문서 종료**

View File

@ -349,28 +349,6 @@ UFR-MEET-055: [회의록수정] 회의록 작성자로서 | 나는, 검증이
- M/13 - M/13
3) 회의록 공유
UFR-MEET-060: [회의록공유] 회의록 작성자로서 | 나는, 회의 내용을 참석자들과 공유하기 위해 | 최종 회의록을 공유하고 싶다.
- 시나리오: 회의록 공유
최종 회의록이 확정된 상황에서 | 공유 버튼을 클릭하고 공유 대상과 권한을 설정하면 | 공유 링크가 생성되고 참석자 전원에게 알림이 발송된다.
[공유 설정]
- 공유 대상: 참석자 전체 (기본) / 특정 참석자 선택
- 공유 권한: 읽기 전용 / 댓글 가능 / 편집 가능
- 공유 방식: 이메일 / 링크 복사
[처리 결과]
- 공유 링크 생성 (고유 URL)
- 참석자에게 이메일 알림 발송
- 공유 시간 기록
- 다음 회의 일정이 언급된 경우 캘린더에 자동 등록
[공유 링크 보안]
- 링크 유효 기간 설정 (선택)
- 비밀번호 설정 (선택)
- M/13
--- ---
3. STT 서비스 (음성 인식 및 변환 - 기본 기능) 3. STT 서비스 (음성 인식 및 변환 - 기본 기능)