Skip to content

Latest commit

 

History

History
270 lines (236 loc) · 13.8 KB

File metadata and controls

270 lines (236 loc) · 13.8 KB

🎯 호스트 가이드 (Host Guide)

Xingu 플랫폼의 호스트(관리자) 화면 상세 설계 문서

목차

  1. 호스트 역할
  2. 호스트 플로우
  3. 화면별 상세 설계
  4. 컴포넌트 구조
  5. 호스트 경험 최적화

호스트 역할

호스트는 게임 방을 만들고 관리하는 역할입니다.

주요 권한

  • ✅ 게임 선택 & 방 만들기 및 설정
  • ✅ 게임 저장 (템플릿) ⭐
  • ✅ 방 생성 및 종료
  • ✅ 참가자 관리 (강퇴)
  • ✅ 게임 진행 컨트롤 (시작/일시정지/종료)
  • ✅ 참가자 상태 모니터링
  • ✅ 결과 공유

사용 시나리오

  • MT/워크샵 진행자
  • 팀 리더
  • 교육자/강사
  • 동아리 운영진

호스트 플로우

📌 비회원 플로우 (바로 시작)

1. 랜딩 페이지 접속
   ↓
2. 우측 상단 [게임 선택 & 방 만들기] 클릭
   ↓
3. 게임 선택 & 방 만들기 페이지 (/create)
   ├─ 필터 적용
   ├─ 게임 카드 탐색
   ├─ [🎮 바로 시작] 클릭
   ├─ 게임 상세 모달
   └─ 설정 조정 후 방 생성
   ↓
4. 호스트 대기실 (/host/[code]/lobby) (예정)
   ├─ 방 코드 공유
   ├─ 참가자 입장 대기
   └─ 게임 시작
   ↓
5-8. (게임 진행 → 결과 동일)

🔑 회원 플로우 (게임 저장 활용) ⭐

1. 로그인 (/login)
   └─ 카카오 로그인
   ↓
2. 게임 선택 & 방 만들기 페이지 (/create)
   ├─ [📌 담기] 클릭
   ├─ 템플릿 이름 입력 (예: "MT용 초성게임")
   └─ 저장 완료
   ↓
3. 대시보드 (/dashboard)
   ├─ 저장된 게임 템플릿 확인
   ├─ [🎮 게임 시작] 클릭
   └─ 즉시 방 생성 (설정 재입력 불필요)
   ↓
4-8. (대기실 → 게임 진행 → 결과 동일)

화면별 상세 설계

0. 대시보드 (/dashboard) ⭐ 새로 추가

🎯 목적

회원이 저장한 게임 템플릿을 관리하고 빠르게 시작

📱 화면 구성

┌─────────────────────────────────────────────────────────────┐
│  Navbar: 🎮 Xingu  [내 게임] [사용방법]    👤    │
├─────────────────────────────────────────────────────────────┤
│                                                               │
│  📦 내 게임                                                   │
│  저장한 게임을 관리하고 바로 시작하세요                       │
│                                                               │
│  ┌─────────────────┐  [메인 영역]                           │
│  │ 빠른 메뉴       │  저장된 게임 (3개)                       │
│  │                 │  ┌─────────────┬─────────────┐         │
│  │ [➕ 새 게임 추가]│  │ MT용 초성   │ 빠른 밸런스 │         │
│  │ [🏠 홈으로]     │  │ 초성 게임   │ 밸런스 게임 │         │
│  │                 │  │             │             │         │
│  ├─────────────────┤  │ 저장일:     │ 저장일:     │         │
│  │ 내 정보         │  │ 2025.10.10  │ 2025.10.11  │         │
│  │ 👤 홍길동       │  │             │             │         │
│  │ 저장된 게임: 3개│  │ [🎮 게임시작] │ [🎮 게임시작] │         │
│  └─────────────────┘  │ [🗑️ 삭제]    │ [🗑️ 삭제]    │         │
│                       └─────────────┴─────────────┘         │
└─────────────────────────────────────────────────────────────┘

🎮 템플릿 카드

┌─────────────────────────┐
│  MT용 초성게임           │  ← 템플릿 이름
│  초성 게임               │  ← 게임 이름
├─────────────────────────┤
│  저장일: 2025.10.10      │
│  마지막 사용: 2025.10.11 │
│  사용 횟수: 5회          │
├─────────────────────────┤
│  [🎮 게임 시작]           │  ← 즉시 방 생성
│  [🗑️ 삭제]               │
└─────────────────────────┘

1. 게임 선택 & 방 만들기 페이지 (/create) ✅ 완료

🎯 목적

호스트가 상황에 맞는 게임을 쉽게 찾고 선택할 수 있도록

🆕 버튼 구조 변경 ⭐

각 게임 카드에 2개의 버튼:
1. [📌 담기] - 로그인 필요, 템플릿으로 저장
2. [🎮 바로 시작] - 비회원 가능, 즉시 방 생성

📱 화면 레이아웃

┌─────────────────────────────────────────────────────────────┐
│  ← 뒤로            🎮 게임 선택 & 방 만들기      [🔑 로그인] / 👤    │
├─────────────────────────────────────────────────────────────┤
│                                                               │
│  💡 추천 게임 (3개)                                           │
│  ┌─────────────┬─────────────┬─────────────┐               │
│  │  초성 게임  │ 밸런스 게임 │ 랜덤 질문   │               │
│  │  ⭐⭐ 추천   │  ⭐ 추천    │  ⭐ 추천    │               │
│  │  2-20명     │  2-100명    │  2-30명     │               │
│  │  ~15분      │  ~10분      │  ~15분      │               │
│  │  [📌 담기]  [🎮 바로시작]                                 │
│  └─────────────┴─────────────┴─────────────┘               │
│                                                               │
│  🔍 필터                  📋 전체 게임 (7개)                  │
│  ┌───────────────┐        ┌─────────────┬─────────────┐    │
│  │ 🔍 검색       │        │  스피드퀴즈 │  라이어     │    │
│  │ [검색...]     │        │  ⭐         │  ⭐⭐⭐     │    │
│  │               │        │  2-50명     │  4-10명     │    │
│  │ 📂 카테고리   │        │  ~10분      │  ~20분      │    │
│  │ [퀴즈][워드]  │        │  [📌] [🎮]  │  [📌] [🎮]  │    │
│  │               │        └─────────────┴─────────────┘    │
│  │ ⭐ 난이도     │        ...                               │
│  │ [⭐][⭐⭐]    │                                           │
│  └───────────────┘                                          │
└─────────────────────────────────────────────────────────────┘

💾 게임 저장 모달 ⭐ 새로 추가

[📌 담기] 클릭 시:

┌─────────────────────────────────┐
│  게임 저장하기                   │
├─────────────────────────────────┤
│                                  │
│  🎮 초성 게임                    │
│  제시된 초성으로 단어 맞추기     │
│                                  │
│  📝 템플릿 이름                  │
│  [MT용 초성게임_______________]  │
│                                  │
│  💡 나중에 쉽게 찾을 수 있도록   │
│     구체적으로 적어주세요        │
│                                  │
│  [취소]        [💾 저장하기]     │
└─────────────────────────────────┘

🎮 게임 상세 모달

[🎮 바로 시작] 클릭 시:

┌──────────────────────────────────────────┐
│  🎮 초성 게임                       [X]   │
├──────────────────────────────────────────┤
│  [게임 이미지]                            │
│                                           │
│  📖 게임 설명                             │
│  제시된 초성(자음)을 보고 해당하는       │
│  단어를 맞추는 게임입니다.               │
│                                           │
│  ⚙️ 게임 설정                            │
│  ┌─────────────────────────────────────┐ │
│  │ 라운드 수: [5▼]                     │ │
│  │ 시간 제한: [30초▼]                  │ │
│  │ 난이도: ⚪ 쉬움 ⚫ 보통 ⚪ 어려움   │ │
│  │ 카테고리: ☑️ 음식 ☑️ 동물 ☐ 영화  │ │
│  └─────────────────────────────────────┘ │
│                                           │
│  👥 방 설정                              │
│  최대 인원: [20명▼]                      │
│                                           │
│  [🏠 방 만들기]                          │
└──────────────────────────────────────────┘

2. 호스트 대기실 (/host/[code]/lobby) (예정)

🎯 목적

  • 참가자 입장 대기
  • 방 코드 공유
  • 게임 시작 전 최종 확인

📱 화면 레이아웃

┌─────────────────────────────────────────────────────────────┐
│  🎮 Xingu                    [방 코드] AB1234       [방 나가기]│
├─────────────────────────────────────────────────────────────┤
│                                                               │
│  🎯 초성 게임 - 대기실                                        │
│                                                               │
│  ┌──────────────────────────────────────────┐               │
│  │  방 코드: AB1234                          │               │
│  │                                            │               │
│  │  [AB1234]  [📋 복사]  [QR코드 보기]      │               │
│  └──────────────────────────────────────────┘               │
│                                                               │
│  참가자 (3/20명)                                             │
│  ┌────────────────────────────────────────────────────────┐ │
│  │  ✅ 홍길동 (호스트)                         [강퇴]       │ │
│  │  ✅ 김철수                                  [강퇴]       │ │
│  │  ✅ 이영희                                  [강퇴]       │ │
│  └────────────────────────────────────────────────────────┘ │
│                                                               │
│  게임 설정                                                    │
│  - 라운드: 5라운드                                           │
│  - 시간 제한: 30초                                           │
│  - 난이도: 보통                                              │
│                                                               │
│  [⚙️ 설정 변경]            [▶️ 게임 시작] (3명 이상)         │
│                                                               │
└─────────────────────────────────────────────────────────────┘

(나머지 화면들은 기존 내용 유지)


문서 작성일: 2025.10.11
최종 수정일: 2025.10.11
버전: 2.0
주요 변경사항:

  • 회원/비회원 플로우 구분
  • 대시보드 페이지 설계 추가
  • 게임 카드 버튼 구조 변경 (담기/바로 시작)
  • 게임 저장 모달 추가
  • 카카오 로그인 연동 반영