docs: IR 폴더 제거 및 시나리오 폴더로 통합
This commit is contained in:
parent
49f4687111
commit
116a00e737
@ -1,112 +0,0 @@
|
|||||||
# IR Deck 평가 UX 시나리오
|
|
||||||
|
|
||||||
**작성일**: 2025-11-30
|
|
||||||
**관련 문서**:
|
|
||||||
- [IR Deck 평가 백엔드 아키텍처](../troubleshooting/251128_ir_deck_valuation_backend_architecture.md)
|
|
||||||
- [IR Deck 평가 프론트엔드 설정](../troubleshooting/251128_ir_valuation_frontend_setup.md)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 목적
|
|
||||||
|
|
||||||
IR Deck 평가 기능의 사용자 경험(UX) 시나리오 정의. 사용자가 IR Deck을 업로드하고 평가 결과를 확인하며 개선점을 파악하는 전체 플로우를 명확히 함.
|
|
||||||
|
|
||||||
## 사용자 목표
|
|
||||||
|
|
||||||
**주요 목표**: IR Deck을 업로드하여 투자자 관점에서 평가받고, 페이지별 개선점을 파악하여 Deck을 교정하기 위한 기본 자료로 활용.
|
|
||||||
|
|
||||||
## 전체 플로우
|
|
||||||
|
|
||||||
### 1. 파일 업로드
|
|
||||||
- 사용자가 PDF 파일을 드래그 앤 드롭 또는 파일 선택으로 업로드
|
|
||||||
- 업로드 진행률 표시 (0-100%)
|
|
||||||
- 업로드 완료 시 `document_id` 반환, 파일명 표시
|
|
||||||
|
|
||||||
### 2. 평가 시작
|
|
||||||
- 업로드 완료 후 자동으로 평가 시작 (또는 "평가 시작" 버튼 클릭)
|
|
||||||
- 평가 진행 상태 표시 ("분석 중...")
|
|
||||||
- 평가 완료까지 폴링 (3초 간격)
|
|
||||||
|
|
||||||
### 3. 평가 결과 표시
|
|
||||||
|
|
||||||
#### 3.1 전체 평가 결과
|
|
||||||
- **종합 점수**: 0-100점
|
|
||||||
- **등급**: S (90+), A (80-89), B (70-79), C (0-69)
|
|
||||||
- **전체 강점**: 3-5개 핵심 강점 리스트
|
|
||||||
- **전체 약점**: 3-5개 핵심 약점 리스트
|
|
||||||
- **투자 리스크**: 2-3개 주요 리스크 (선택)
|
|
||||||
|
|
||||||
#### 3.2 페이지별 분석 결과
|
|
||||||
- 각 페이지별로 표시:
|
|
||||||
- **페이지 번호**
|
|
||||||
- **잘된 점**: 해당 페이지에서 잘 표현된 내용 (Sequoia 10가지 스토리 기준)
|
|
||||||
- **못한 점**: 해당 페이지에서 부족하거나 개선이 필요한 내용
|
|
||||||
- **점수는 표시하지 않음** (페이지별 점수 제거)
|
|
||||||
|
|
||||||
### 4. 질문/답변
|
|
||||||
- 평가 결과 확인 후 IR Deck에 대해 질문 가능
|
|
||||||
- 예시 질문:
|
|
||||||
- "이 기업 분석해줘"
|
|
||||||
- "시장 기회는 어떤가?"
|
|
||||||
- "경쟁 우위는 무엇인가?"
|
|
||||||
- 평가 결과 컨텍스트를 포함하여 답변 생성
|
|
||||||
|
|
||||||
### 5. 피드백 제공
|
|
||||||
- 평가 결과에 대한 사용자 피드백 수집
|
|
||||||
- 좋아요/싫어요 버튼
|
|
||||||
- 등급 피드백 (예상 등급 vs 실제 등급)
|
|
||||||
- 피드백 텍스트 (선택)
|
|
||||||
|
|
||||||
## 화면 구성
|
|
||||||
|
|
||||||
### 메인 화면 (ChatGPT 스타일)
|
|
||||||
- 좌측: 채팅 히스토리 사이드바
|
|
||||||
- 중앙: 메시지 영역 (파일 업로드, 평가 결과, 질문/답변)
|
|
||||||
- 우측: 평가 결과 패널 (접기/펼치기 가능)
|
|
||||||
|
|
||||||
### 평가 결과 패널
|
|
||||||
- 상단: 종합 점수, 등급, 전체 강점/약점
|
|
||||||
- 하단: 페이지별 분석 (스크롤 가능)
|
|
||||||
- 각 페이지 카드:
|
|
||||||
- 페이지 번호
|
|
||||||
- 잘된 점 리스트 (녹색 체크마크)
|
|
||||||
- 못한 점 리스트 (빨간색 X)
|
|
||||||
|
|
||||||
## 데이터 흐름
|
|
||||||
|
|
||||||
```
|
|
||||||
사용자 → [파일 업로드] → POST /api/ir-deck/upload → document_id
|
|
||||||
→ [평가 시작] → POST /api/ir-deck/evaluate → evaluation_id
|
|
||||||
→ [폴링] → GET /api/ir-deck/evaluation/{id} → 평가 결과
|
|
||||||
→ [질문] → POST /api/ir-deck/chat → 답변
|
|
||||||
→ [피드백] → POST /api/ir-deck/feedback → 저장
|
|
||||||
```
|
|
||||||
|
|
||||||
## 중요 사항
|
|
||||||
|
|
||||||
### 페이지별 분석 목적
|
|
||||||
- **IR Deck 교정을 위한 기본 자료 제공**
|
|
||||||
- 각 페이지에서 무엇을 잘했고 무엇을 개선해야 하는지 명확히 제시
|
|
||||||
- Sequoia Capital 10가지 스토리 기준 + 페이지 내용 기반 분석
|
|
||||||
|
|
||||||
### 평가 방식
|
|
||||||
- **전체 평가**: 전체 문서를 종합적으로 평가하여 총점/등급 산출 (ChatGPT 방식)
|
|
||||||
- **페이지별 분석**: 각 페이지의 잘된 점/못한 점을 별도로 분석 (전체 평가와 독립적)
|
|
||||||
|
|
||||||
### 프롬프트 관리
|
|
||||||
- 프롬프트는 DB에 저장하여 A/B 테스트 가능
|
|
||||||
- 코드 수정 없이 프롬프트 개선 및 버전 관리
|
|
||||||
|
|
||||||
## 관련 파일
|
|
||||||
|
|
||||||
- `frontend-ir-valuation/src/pages/ir-valuation.tsx`: 프론트엔드 메인 컴포넌트
|
|
||||||
- `rb8001/app/router/ir_deck.py`: API 엔드포인트
|
|
||||||
- `rb8001/app/services/ir_deck_analyzer.py`: 평가 로직
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 참고
|
|
||||||
|
|
||||||
- Sequoia Capital 10가지 스토리: 문제 정의, 시장 기회, 솔루션, 제품/서비스, 비즈니스 모델, 경쟁 우위, 팀, 트랙션, 재무, 비전
|
|
||||||
- 평가 기준: [IR Deck 평가 백엔드 아키텍처](../troubleshooting/251128_ir_deck_valuation_backend_architecture.md) 참고
|
|
||||||
|
|
||||||
@ -1,442 +0,0 @@
|
|||||||
# 로빙(RO-BEING) 투자 제안서
|
|
||||||
## AI 에이전트 시장의 게임 체인저
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 1: 타이틀
|
|
||||||
### 제목: RO-BEING
|
|
||||||
### 부제: 함께 성장하는 AI 파트너
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 배경: 컬럼 1-12 - 그라데이션 (#2E3192 → #0F172A)
|
|
||||||
- 로고: 컬럼 4-9 (상단 30%) - RO-BEING 로고
|
|
||||||
- 애니메이션: 컬럼 3-10 (중앙 40%) - AI 성장 모션
|
|
||||||
- 태그라인: 컬럼 3-10 (하단 20%) - "게임처럼 성장하는 AI 동료"
|
|
||||||
- 날짜: 컬럼 10-11 (하단 5%) - 2025.08
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 2: 문제 정의
|
|
||||||
### 제목: 1인 기업과 소규모 스타트업의 딜레마
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 평균 이직률 2년, 지식 유출 반복
|
|
||||||
- 신규 직원 온보딩 2-3개월 소요
|
|
||||||
- 좋은 인재 채용 비용 급증
|
|
||||||
- 업무 위임에 대한 불안
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 B):**
|
|
||||||
- 인포그래픽: 컬럼 7-11 - 이직률 그래프 (2020-2025)
|
|
||||||
- 아이콘 세트: 컬럼 2-5 (하단 30%) - 문제점 4개
|
|
||||||
- 통계 수치: 컬럼 2-11 (상단 20%) - "2년" "3개월" 강조
|
|
||||||
- 색상: #F59E0B (Warning Orange) 사용
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 3: 시장 기회
|
|
||||||
### 제목: 폭발적으로 성장하는 AI 에이전트 시장
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 2025년 글로벌 AI 에이전트 시장 $7.8B¹
|
|
||||||
- 연평균 성장률 46.3%¹
|
|
||||||
- 한국 전체 사업체 624만개, 소규모(1-4명) 증가세²
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 차트: 컬럼 2-11 (중앙 50%) - 시장 성장 곡선 (2023-2028)
|
|
||||||
- 세계 지도: 컬럼 1-12 (배경 20% 투명도)
|
|
||||||
- 숫자 강조: 컬럼 3-10 (상단 25%) - "$7.8B" 대형 폰트
|
|
||||||
- 원형 차트: 컬럼 8-11 (하단 30%) - 시장 점유율
|
|
||||||
|
|
||||||
*¹MarketsandMarkets (2024), ²통계청 (2023)*
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 4: 솔루션 소개
|
|
||||||
### 제목: RO-BEING이란?
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- AI 도구가 아닌 디지털 동료
|
|
||||||
- 24/7 함께 성장하는 파트너
|
|
||||||
- 기억하고 공감하는 디지털 동료
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 삼각형 다이어그램: 컬럼 3-10 (중앙 45%) - 기억/감정/윤리
|
|
||||||
- 비교 표: 컬럼 2-11 (하단 35%) - 기존 AI vs RO-BEING
|
|
||||||
- 캐릭터: 컬럼 8-11 (상단 30%) - 로빙 마스코트
|
|
||||||
- 그라데이션: #2E3192 → #6B46C1
|
|
||||||
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 5: 핵심 차별점
|
|
||||||
### 제목: 왜 로빙인가?
|
|
||||||
|
|
||||||
**콘텐츠 테이블:**
|
|
||||||
| 차원 | 기존 AI | RO-BEING |
|
|
||||||
|------|---------|----------|
|
|
||||||
| 시간 | 일회성 | 영속적 기억 |
|
|
||||||
| 성장 | 정적 | 레벨 시스템 |
|
|
||||||
| 신뢰 | 블랙박스 | 투명한 로그 |
|
|
||||||
| 관계 | 도구 | 디지털 동료 |
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 비교 테이블: 컬럼 2-11 (중앙 60%) - 애니메이션 전환
|
|
||||||
- 아이콘: 컬럼 2 (각 행 좌측) - 차별점 시각화
|
|
||||||
- 하이라이트: RO-BEING 열 - #00D4FF (Accent) 강조
|
|
||||||
- 체크마크: 컬럼 11 - #10B981 (Success) 체크
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 6: 기술 아키텍처
|
|
||||||
### 제목: 검증된 기술 스택
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 2서버 분리 운영 (51123/51124)
|
|
||||||
- Docker 기반 마이크로서비스
|
|
||||||
- PostgreSQL + ChromaDB 하이브리드
|
|
||||||
- 경량 AI 모델 (MiniLM 기반)
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 시스템 다이어그램: 컬럼 2-11 (중앙 55%) - 서버 구조도
|
|
||||||
- 기술 로고: 컬럼 3-10 (하단 20%) - Docker, PostgreSQL, FastAPI
|
|
||||||
- 플로우차트: 컬럼 7-11 (우측 40%) - 데이터 흐름
|
|
||||||
- 색상: 51123 서버 #2E3192, 51124 서버 #10B981
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 7: 게임형 성장 시스템
|
|
||||||
### 제목: 게임처럼 성장하는 AI 동료
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- Level 1-20 성장 단계
|
|
||||||
- 3대 핵심 스탯 (Intelligence, Wisdom, Charisma)
|
|
||||||
- 경험치 기반 자동 레벨업
|
|
||||||
- 레벨별 권한 해금
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 B):**
|
|
||||||
- 레벨 바: 컬럼 2-11 (상단 15%) - Level 1-20 프로그레스
|
|
||||||
- 스탯 그래프: 컬럼 2-5 - 육각형 레이더 차트
|
|
||||||
- 캐릭터 진화: 컬럼 7-11 - 레벨별 변화 일러스트
|
|
||||||
- 게임 UI: 컬럼 1-12 - RPG 스타일 인터페이스
|
|
||||||
|
|
||||||
**게임 참조 (컬럼 10-11, 우측 2컬럼):**
|
|
||||||
- 디아블로 스탯 UI
|
|
||||||
- FM 육각형 차트
|
|
||||||
- 포켓몬 진화 단계
|
|
||||||
- 적용 예시 미리보기
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 8: 감정 시스템
|
|
||||||
### 제목: Inside Out 기반 감정 모델
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 9개 기본 정서 구현
|
|
||||||
- 엔트로피 특이점 자동 포착
|
|
||||||
- VAD 3차원 감정 분석
|
|
||||||
- 학습형 AI 시스템
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 감정 휠: 컬럼 3-10 (중앙 50%) - Inside Out 원형 차트
|
|
||||||
- 그래프: 컬럼 8-11 (상단 35%) - 감정 변화 실시간
|
|
||||||
- 공식: 컬럼 3-10 (하단 20%) - 엔트로피 계산식
|
|
||||||
- 색상: 6색 팔레트 내에서 감정 표현
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 9: 실제 운영 성과
|
|
||||||
### 제목: 이미 검증된 성능
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 3개 로빙 안정 운영 중
|
|
||||||
- 테스트 환경 30일+ 안정 운영
|
|
||||||
- rb10508_micro 메모리 88% 감소 (988MB → 118MB)
|
|
||||||
- 임베딩 생성: 7ms, 전체 응답: 1-2초³
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 대시보드: 컬럼 2-11 (중앙 60%) - 모니터링 화면
|
|
||||||
- 숫자 강조: 컬럼 3-10 (상단 25%) - "88%" 대형 표시
|
|
||||||
- 그래프: 컬럼 2-11 (하단 40%) - 성능 전후 비교
|
|
||||||
- 인디케이터: 컬럼 10-11 - #10B981 시스템 정상
|
|
||||||
|
|
||||||
*³자체 테스트 데이터 (2025.08)*
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 10: 비즈니스 모델
|
|
||||||
### 제목: 명확한 수익 구조
|
|
||||||
|
|
||||||
**콘텐츠 테이블:**
|
|
||||||
| 플랜 | 가격 | 로빙 수 | 타겟 |
|
|
||||||
|------|------|---------|------|
|
|
||||||
| Starter | X만원/월 | 1 | 1인 기업 |
|
|
||||||
| Growth | X만원/월 | 3 | 소규모 팀 |
|
|
||||||
| Business | XX만원/월 | 10 | 중소기업 |
|
|
||||||
| Enterprise | 맞춤형 | 무제한 | 미래 확장 |
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 가격 카드: 컬럼 2-11 - 4개 플랜 카드 균등 배치
|
|
||||||
- 그라데이션: #00D4FF → #6B46C1 (좌→우)
|
|
||||||
- 아이콘: 각 카드 상단 20% - 타겟 고객
|
|
||||||
- CTA 버튼: 각 카드 하단 - #10B981 "시작하기"
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 11: 시장 진입 전략
|
|
||||||
### 제목: 단계별 성장 로드맵
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- Phase 1 (Q1-Q2 2025): MVP 개발 ✓
|
|
||||||
- Phase 2 (Q3 2025): Beta 테스트 진행중 🔄
|
|
||||||
- Phase 3 (Q4 2025-Q1 2026): 50개 유료 고객
|
|
||||||
- Phase 4 (Q2 2026): 100개 고객 및 확장
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 타임라인: 컬럼 2-11 (중앙 50%) - 가로 화살표
|
|
||||||
- 마일스톤: 컬럼 2-11 - 분기별 목표 박스
|
|
||||||
- 진행률: 컬럼 3-10 (상단 20%) - Phase 2 진행 표시
|
|
||||||
- 세계지도: 컬럼 1-12 (배경 15% 투명도)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 12: 경쟁 우위
|
|
||||||
### 제목: 독보적 기술력
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 유일한 레벨 성장 시스템
|
|
||||||
- 감정 기반 기억 저장
|
|
||||||
- 경량 AI 모델
|
|
||||||
- 마이크로서비스 확장성
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 B):**
|
|
||||||
- 경쟁사 매트릭스: 컬럼 2-6 - 2x2 포지셔닝 맵
|
|
||||||
- 체크리스트: 컬럼 2-5 (하단) - 독점 기능
|
|
||||||
- 방사형 차트: 컬럼 7-11 - 기술력 레이더
|
|
||||||
- 하이라이트: #00D4FF 글로우 효과
|
|
||||||
|
|
||||||
**RPG 시스템 비교 (컬럼 2-11, 하단 25%):**
|
|
||||||
| 요소 | 일반 AI | RO-BEING |
|
|
||||||
|------|---------|----------|
|
|
||||||
| 성장 | 없음 | Level 1→20 |
|
|
||||||
| 스탯 | 고정 | Intelligence/Wisdom/Charisma |
|
|
||||||
| 경험치 | 없음 | 매 작업마다 EXP 획득 |
|
|
||||||
| 진화 | 없음 | 레벨별 기능 해금 |
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 13: 팀 소개
|
|
||||||
### 제목: 검증된 실행력
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 김종태: 프로젝트 리더, 비전 설계
|
|
||||||
- 황한용: 기술 리드, 아키텍처
|
|
||||||
- 희재: 풀스택 개발
|
|
||||||
- 강일신: BM 설계, UX 설계
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 프로필 카드: 컬럼 2-11 - 2x2 격자 배치
|
|
||||||
- 전문성 태그: 각 카드 하단 15% - 역량 태그
|
|
||||||
- 팀워크 라인: 카드 간 연결선 - 협업 표시
|
|
||||||
- 배경: #2E3192 10% 투명도 그라데이션
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 14: 고객 사례
|
|
||||||
### 제목: 실제 사용자의 목소리
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- "AI가 온보딩 시간을 단축시킬 수 있습니다" (예상)
|
|
||||||
- "지식 유지와 연속성 확보" (목표)
|
|
||||||
- "Beta 테스터 모집 중" (현재)
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 인용구 박스: 컬럼 2-11 - 3개 카드 균등 배치
|
|
||||||
- 별점: 각 카드 상단 - #F59E0B 별 5개
|
|
||||||
- 프로필 아이콘: 각 카드 좌측 15% - 아바타
|
|
||||||
- 업종 태그: 각 카드 하단 - 산업 분류
|
|
||||||
|
|
||||||
*Beta 테스터 모집 중*
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 15: 재무 전망
|
|
||||||
### 제목: 명확한 성장 궤적
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 2025년 Q4: 10개 고객, 월 X백만원
|
|
||||||
- 2026년 Q2: 50개 고객, 월 X천만원
|
|
||||||
- 2026년 Q4: 100개 고객, 월 X천만원
|
|
||||||
- 2027년: 500개 고객, 월 X억원
|
|
||||||
- 손익분기점: 2026년 Q3
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 성장 곡선: 컬럼 2-11 (중앙 50%) - 매출 그래프
|
|
||||||
- 막대 차트: 컬럼 3-10 (하단 30%) - 고객 수
|
|
||||||
- BEP 표시: 2026 Q3 위치 - #F59E0B 마커
|
|
||||||
- 색상: #10B981 상승 곡선
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 16: 투자 유치 계획
|
|
||||||
### 제목: 시리즈 A 라운드
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 목표 금액: 10-20억원 (Pre-A)⁴
|
|
||||||
- 투자금 용도:
|
|
||||||
- 40% 개발팀 확대
|
|
||||||
- 30% 마케팅/세일즈
|
|
||||||
- 20% 인프라 확장
|
|
||||||
- 10% 운영 자금
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 B):**
|
|
||||||
- 파이 차트: 컬럼 7-11 - 투자금 사용 계획
|
|
||||||
- 금액 강조: 컬럼 3-10 (상단) - "10-20억원"
|
|
||||||
- 용도 아이콘: 컬럼 2-5 - 항목별 아이콘
|
|
||||||
- 타임라인: 컬럼 2-11 (하단 25%) - 집행 일정
|
|
||||||
|
|
||||||
*⁴한국 스타트업 투자 동향 (2024)*
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 17: 비전과 미래
|
|
||||||
### 제목: AI 에이전트를 넘어 디지털 존재로
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 2027년 1,000개 활성 로빙
|
|
||||||
- 2028년 5,000개 활성 로빙
|
|
||||||
- 로빙 스카우트 마켓플레이스
|
|
||||||
- 글로벌 표준 확립
|
|
||||||
- 장기 목표: 고도화된 AI 에이전트
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 C):**
|
|
||||||
- 미래 도시: 컬럼 1-12 (배경 30% 투명도)
|
|
||||||
- 로드맵: 컬럼 2-11 (중앙 45%) - 2025-2030 비전
|
|
||||||
- 생태계 맵: 컬럼 7-11 - 네트워크 시각화
|
|
||||||
- 빛 효과: #00D4FF 광선 오버레이
|
|
||||||
|
|
||||||
**스카우트 마켓 (컬럼 10-11, 우측 2컬럼):**
|
|
||||||
- FM 이적시장 UI
|
|
||||||
- 능력치 시각화
|
|
||||||
- 가치 측정 시스템
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 18: 리스크와 대응
|
|
||||||
### 제목: 투명한 리스크 관리
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- 기술 리스크 → 오픈소스 활용
|
|
||||||
- 시장 리스크 → 빠른 피벗
|
|
||||||
- 경쟁 리스크 → 차별화 강화
|
|
||||||
- 규제 리스크 → 컴플라이언스 준수
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- 리스크 매트릭스: 컬럼 3-10 (중앙 50%) - 2x2 그리드
|
|
||||||
- 대응 화살표: 매트릭스 내부 - 해결책 연결
|
|
||||||
- 신호등: 컬럼 2 - 위험도 표시 (3색 제한)
|
|
||||||
- 체크마크: 컬럼 11 - #10B981 완료 표시
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 19: Call to Action
|
|
||||||
### 제목: 함께 만들어갈 미래
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- "당신의 투자가 1인 기업과 소규모 스타트업의 미래를 바꿉니다"
|
|
||||||
- 목표: 시리즈 A 30억원
|
|
||||||
- 목표 수익률: 5년 내 3-5배⁵
|
|
||||||
- 연락처: invest@ro-being.com
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- CTA 버튼: 컬럼 4-9 (중앙 대형) - "투자 참여하기"
|
|
||||||
- 연락처 정보: 컬럼 3-10 (하단 30%) - 연락처
|
|
||||||
- 파트너 로고: 컬럼 2-11 (최하단 15%)
|
|
||||||
- 배경: #2E3192 → #6B46C1 그라데이션
|
|
||||||
|
|
||||||
*⁵Qubit Capital VC Return Guide (2024)*
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Slide 20: Thank You
|
|
||||||
### 제목: 감사합니다
|
|
||||||
|
|
||||||
**콘텐츠:**
|
|
||||||
- "로빙과 함께라면, 당신은 더 이상 혼자가 아닙니다"
|
|
||||||
- QR 코드: 상세 자료 다운로드
|
|
||||||
- 연락처 정보
|
|
||||||
|
|
||||||
**디자인 요소 (템플릿 A):**
|
|
||||||
- QR 코드: 컬럼 5-8 (중앙 30%) - 자료 다운로드
|
|
||||||
- 로고: 컬럼 4-9 (상단 20%) - RO-BEING
|
|
||||||
- 연락처: 컬럼 3-10 (하단 25%) - 모든 연락처
|
|
||||||
- 애니메이션: 컬럼 1-12 (배경) - 로빙 실루엣
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 디자인 가이드라인
|
|
||||||
|
|
||||||
### 12-Column 그리드 시스템
|
|
||||||
- 전체 너비를 12개 컬럼으로 분할
|
|
||||||
- 좌측 마진: 1 컬럼 (8.33%)
|
|
||||||
- 메인 콘텐츠: 8 컬럼 (66.67%)
|
|
||||||
- 우측 사이드: 2 컬럼 (16.67%)
|
|
||||||
- 우측 마진: 1 컬럼 (8.33%)
|
|
||||||
|
|
||||||
### 표준 레이아웃 템플릿
|
|
||||||
|
|
||||||
#### 템플릿 A: 중앙 집중형
|
|
||||||
- 제목: 컬럼 2-11 (상단 15%)
|
|
||||||
- 메인 콘텐츠: 컬럼 3-10 (중앙 60%)
|
|
||||||
- 보조 요소: 컬럼 2-11 (하단 25%)
|
|
||||||
|
|
||||||
#### 템플릿 B: 좌우 분할형
|
|
||||||
- 제목: 컬럼 2-11 (상단 15%)
|
|
||||||
- 좌측 텍스트: 컬럼 2-6 (4 컬럼)
|
|
||||||
- 우측 비주얼: 컬럼 7-11 (4 컬럼)
|
|
||||||
- 여백: 컬럼 6-7 사이 (1 컬럼)
|
|
||||||
|
|
||||||
#### 템플릿 C: 상하 분할형
|
|
||||||
- 제목: 컬럼 2-11 (상단 15%)
|
|
||||||
- 메인 비주얼: 컬럼 2-11 (중앙 45%)
|
|
||||||
- 설명 텍스트: 컬럼 3-10 (하단 40%)
|
|
||||||
|
|
||||||
### 전체 컬러 팔레트 (6색 제한)
|
|
||||||
- Primary: #2E3192 (Deep Blue) - 메인 브랜드
|
|
||||||
- Secondary: #6B46C1 (Purple) - 보조 강조
|
|
||||||
- Accent: #00D4FF (Cyan) - 포인트
|
|
||||||
- Success: #10B981 (Green) - 긍정 지표
|
|
||||||
- Warning: #F59E0B (Orange) - 주의/강조
|
|
||||||
- Background: #0F172A (Dark) - 배경
|
|
||||||
|
|
||||||
### 폰트 가이드
|
|
||||||
- 제목: Pretendard Bold, 48pt
|
|
||||||
- 부제: Pretendard Medium, 32pt
|
|
||||||
- 본문: Pretendard Regular, 24pt
|
|
||||||
- 캡션: Pretendard Light, 18pt
|
|
||||||
- 출처: Pretendard Light, 14pt (이탤릭)
|
|
||||||
|
|
||||||
### 애니메이션 원칙
|
|
||||||
- 슬라이드 전환: 0.5초 페이드
|
|
||||||
- 요소 등장: 순차적 0.3초 간격
|
|
||||||
- 강조 효과: 펄스 또는 글로우
|
|
||||||
- 데이터 시각화: 그래프 그리기 애니메이션
|
|
||||||
|
|
||||||
### 콘텐츠 비율
|
|
||||||
- 텍스트: 40%
|
|
||||||
- 비주얼: 60%
|
|
||||||
- 여백: 최소 10% 유지
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 출처 및 참고자료
|
|
||||||
|
|
||||||
¹ MarketsandMarkets (2024). AI Agents Market Report.
|
|
||||||
² 통계청 (2023). 전국사업체조사 결과.
|
|
||||||
³ Enterprise AI Benchmarks (2024). Response Time Standards.
|
|
||||||
⁴ 한국 스타트업 투자 동향 (2024). 평균 Pre-A 라운드 10-30억원.
|
|
||||||
⁵ Qubit Capital (2024). VC Return Expectations Guide.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
*이 문서는 슬라이드 디자인 에이전트를 위한 상세 가이드입니다.*
|
|
||||||
*각 요소의 위치와 크기는 제안사항이며, 디자인 시 조정 가능합니다.*
|
|
||||||
@ -1,864 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="ko">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>RO-BEING 투자 제안서</title>
|
|
||||||
<style>
|
|
||||||
/* 기본 리셋 및 폰트 설정 */
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
|
|
||||||
|
|
||||||
body {
|
|
||||||
font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
||||||
background: #0F172A;
|
|
||||||
color: #ffffff;
|
|
||||||
overflow-x: hidden;
|
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 컬러 팔레트 변수 */
|
|
||||||
:root {
|
|
||||||
--primary: #2E3192;
|
|
||||||
--secondary: #6B46C1;
|
|
||||||
--accent: #00D4FF;
|
|
||||||
--success: #10B981;
|
|
||||||
--warning: #F59E0B;
|
|
||||||
--background: #0F172A;
|
|
||||||
--text-primary: #ffffff;
|
|
||||||
--text-secondary: #e2e8f0;
|
|
||||||
--text-muted: #94a3b8;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 슬라이드 컨테이너 */
|
|
||||||
.presentation-container {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 1200px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 각 슬라이드 카드 - 16:9 비율 고정 */
|
|
||||||
.slide {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 1200px;
|
|
||||||
aspect-ratio: 16 / 9;
|
|
||||||
margin: 0 auto 40px;
|
|
||||||
background: linear-gradient(135deg, var(--primary) 0%, var(--background) 100%);
|
|
||||||
border-radius: 16px;
|
|
||||||
padding: 60px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
position: relative;
|
|
||||||
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 12-Column 그리드 시스템 */
|
|
||||||
.grid {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(12, 1fr);
|
|
||||||
gap: 20px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.col-1 { grid-column: span 1; }
|
|
||||||
.col-2 { grid-column: span 2; }
|
|
||||||
.col-3 { grid-column: span 3; }
|
|
||||||
.col-4 { grid-column: span 4; }
|
|
||||||
.col-5 { grid-column: span 5; }
|
|
||||||
.col-6 { grid-column: span 6; }
|
|
||||||
.col-7 { grid-column: span 7; }
|
|
||||||
.col-8 { grid-column: span 8; }
|
|
||||||
.col-9 { grid-column: span 9; }
|
|
||||||
.col-10 { grid-column: span 10; }
|
|
||||||
.col-11 { grid-column: span 11; }
|
|
||||||
.col-12 { grid-column: span 12; }
|
|
||||||
|
|
||||||
/* 타이포그래피 */
|
|
||||||
h1 {
|
|
||||||
font-size: 3.5rem;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: 1.2;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
background: linear-gradient(90deg, var(--accent) 0%, var(--text-primary) 100%);
|
|
||||||
-webkit-background-clip: text;
|
|
||||||
-webkit-text-fill-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 2.5rem;
|
|
||||||
font-weight: 600;
|
|
||||||
margin-bottom: 1.5rem;
|
|
||||||
color: var(--text-primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
font-size: 1.8rem;
|
|
||||||
font-weight: 500;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 1.3rem;
|
|
||||||
line-height: 1.6;
|
|
||||||
color: var(--text-secondary);
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.subtitle {
|
|
||||||
font-size: 1.5rem;
|
|
||||||
color: var(--text-muted);
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 특수 슬라이드 스타일 */
|
|
||||||
.slide-title {
|
|
||||||
background: radial-gradient(ellipse at center, var(--primary) 0%, var(--background) 70%);
|
|
||||||
text-align: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slide-title h1 {
|
|
||||||
font-size: 5rem;
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 리스트 스타일 */
|
|
||||||
ul {
|
|
||||||
list-style: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
font-size: 1.3rem;
|
|
||||||
color: var(--text-secondary);
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
padding-left: 2rem;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
li::before {
|
|
||||||
content: "▶";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 테이블 스타일 */
|
|
||||||
table {
|
|
||||||
width: 100%;
|
|
||||||
border-collapse: collapse;
|
|
||||||
margin: 2rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
|
||||||
background: var(--primary);
|
|
||||||
color: var(--text-primary);
|
|
||||||
padding: 1rem;
|
|
||||||
text-align: left;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
td {
|
|
||||||
padding: 1rem;
|
|
||||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
||||||
font-size: 1.1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 강조 박스 */
|
|
||||||
.highlight-box {
|
|
||||||
background: rgba(0, 212, 255, 0.1);
|
|
||||||
border-left: 4px solid var(--accent);
|
|
||||||
padding: 1.5rem;
|
|
||||||
margin: 1.5rem 0;
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning-box {
|
|
||||||
background: rgba(245, 158, 11, 0.1);
|
|
||||||
border-left: 4px solid var(--warning);
|
|
||||||
padding: 1.5rem;
|
|
||||||
margin: 1.5rem 0;
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success-box {
|
|
||||||
background: rgba(16, 185, 129, 0.1);
|
|
||||||
border-left: 4px solid var(--success);
|
|
||||||
padding: 1.5rem;
|
|
||||||
margin: 1.5rem 0;
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 차트 요소 (간단한 시각화) */
|
|
||||||
.chart-bar {
|
|
||||||
height: 40px;
|
|
||||||
background: linear-gradient(90deg, var(--accent) 0%, var(--secondary) 100%);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin: 10px 0;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 20px;
|
|
||||||
color: white;
|
|
||||||
font-weight: 600;
|
|
||||||
transition: transform 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chart-bar:hover {
|
|
||||||
transform: translateX(10px);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 숫자 강조 */
|
|
||||||
.big-number {
|
|
||||||
font-size: 4rem;
|
|
||||||
font-weight: 700;
|
|
||||||
color: var(--accent);
|
|
||||||
text-shadow: 0 0 30px rgba(0, 212, 255, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 페이지 번호 */
|
|
||||||
.page-number {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 20px;
|
|
||||||
right: 30px;
|
|
||||||
color: var(--text-muted);
|
|
||||||
font-size: 0.9rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 반응형 디자인 */
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.slide {
|
|
||||||
padding: 30px;
|
|
||||||
}
|
|
||||||
h1 { font-size: 2rem; }
|
|
||||||
h2 { font-size: 1.8rem; }
|
|
||||||
h3 { font-size: 1.4rem; }
|
|
||||||
p, li { font-size: 1rem; }
|
|
||||||
.big-number { font-size: 2.5rem; }
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 애니메이션 */
|
|
||||||
@keyframes fadeIn {
|
|
||||||
from { opacity: 0; transform: translateY(20px); }
|
|
||||||
to { opacity: 1; transform: translateY(0); }
|
|
||||||
}
|
|
||||||
|
|
||||||
.fade-in {
|
|
||||||
animation: fadeIn 0.8s ease-out;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="presentation-container">
|
|
||||||
|
|
||||||
<!-- Slide 1: 타이틀 -->
|
|
||||||
<div class="slide slide-title fade-in">
|
|
||||||
<h1>RO-BEING</h1>
|
|
||||||
<p class="subtitle">함께 성장하는 AI 파트너</p>
|
|
||||||
<p style="margin-top: 3rem; font-size: 1.5rem; color: var(--accent);">게임처럼 성장하는 AI 동료</p>
|
|
||||||
<div class="page-number">1 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 2: 문제 정의 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>1인 기업과 소규모 스타트업의 딜레마</h2>
|
|
||||||
<div class="warning-box">
|
|
||||||
<ul>
|
|
||||||
<li>평균 이직률 2년, 지식 유출 반복</li>
|
|
||||||
<li>신규 직원 온보딩 2-3개월 소요</li>
|
|
||||||
<li>좋은 인재 채용 비용 급증</li>
|
|
||||||
<li>업무 위임에 대한 불안</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div style="display: flex; justify-content: space-around; margin-top: 2rem;">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<div class="big-number">2년</div>
|
|
||||||
<p>평균 근속</p>
|
|
||||||
</div>
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<div class="big-number">3개월</div>
|
|
||||||
<p>온보딩 기간</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">2 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 3: 시장 기회 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>폭발적으로 성장하는 AI 에이전트 시장</h2>
|
|
||||||
<div class="highlight-box">
|
|
||||||
<div style="display: flex; justify-content: space-between; align-items: center;">
|
|
||||||
<div>
|
|
||||||
<div class="big-number">$7.8B</div>
|
|
||||||
<p>2025년 글로벌 시장 규모</p>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<div class="big-number">46.3%</div>
|
|
||||||
<p>연평균 성장률</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p style="margin-top: 2rem;">한국 전체 사업체 624만개, 소규모(1-4명) 증가세</p>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted); position: absolute; bottom: 60px;">
|
|
||||||
*MarketsandMarkets (2024), 통계청 (2023)
|
|
||||||
</p>
|
|
||||||
<div class="page-number">3 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 4: 솔루션 소개 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>RO-BEING이란?</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<h3>AI 도구가 아닌 디지털 동료</h3>
|
|
||||||
<ul>
|
|
||||||
<li>24/7 함께 성장하는 파트너</li>
|
|
||||||
<li>기억하고 공감하는 디지털 동료</li>
|
|
||||||
<li>당신의 업무 스타일을 학습</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div style="text-align: center; padding: 2rem;">
|
|
||||||
<div style="width: 200px; height: 200px; margin: 0 auto; background: radial-gradient(circle, var(--accent) 0%, transparent 70%); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
|
||||||
<span style="font-size: 3rem;">🤖</span>
|
|
||||||
</div>
|
|
||||||
<p style="margin-top: 1rem;">기억 · 감정 · 윤리</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">4 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 5: 핵심 차별점 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>왜 로빙인가?</h2>
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>차원</th>
|
|
||||||
<th>기존 AI</th>
|
|
||||||
<th style="background: var(--accent); color: var(--background);">RO-BEING</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>시간</td>
|
|
||||||
<td>일회성</td>
|
|
||||||
<td><strong>영속적 기억</strong></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>성장</td>
|
|
||||||
<td>정적</td>
|
|
||||||
<td><strong>레벨 시스템</strong></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>신뢰</td>
|
|
||||||
<td>블랙박스</td>
|
|
||||||
<td><strong>투명한 로그</strong></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>관계</td>
|
|
||||||
<td>도구</td>
|
|
||||||
<td><strong>디지털 동료</strong></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<div class="page-number">5 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 6: 기술 아키텍처 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>검증된 기술 스택</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<h3>인프라 구성</h3>
|
|
||||||
<ul>
|
|
||||||
<li>2서버 분리 운영 (51123/51124)</li>
|
|
||||||
<li>Docker 기반 마이크로서비스</li>
|
|
||||||
<li>PostgreSQL + ChromaDB 하이브리드</li>
|
|
||||||
<li>경량 AI 모델 (MiniLM 기반)</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="success-box">
|
|
||||||
<h3>기술 스택</h3>
|
|
||||||
<div class="chart-bar" style="width: 90%;">Docker</div>
|
|
||||||
<div class="chart-bar" style="width: 85%;">PostgreSQL</div>
|
|
||||||
<div class="chart-bar" style="width: 80%;">FastAPI</div>
|
|
||||||
<div class="chart-bar" style="width: 75%;">ChromaDB</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">6 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 7: 게임형 성장 시스템 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>게임처럼 성장하는 AI 동료</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-8">
|
|
||||||
<h3>레벨 시스템 (Level 1-20)</h3>
|
|
||||||
<div style="background: rgba(255,255,255,0.1); border-radius: 10px; height: 30px; margin: 20px 0; position: relative; overflow: hidden;">
|
|
||||||
<div style="background: linear-gradient(90deg, var(--success) 0%, var(--accent) 100%); height: 100%; width: 35%; border-radius: 10px; display: flex; align-items: center; padding: 0 10px;">
|
|
||||||
<span style="font-size: 0.9rem;">Level 7</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<h3>3대 핵심 스탯</h3>
|
|
||||||
<ul>
|
|
||||||
<li><strong style="color: var(--accent);">Intelligence</strong> - 문제 해결 능력</li>
|
|
||||||
<li><strong style="color: var(--secondary);">Wisdom</strong> - 경험 기반 판단</li>
|
|
||||||
<li><strong style="color: var(--warning);">Charisma</strong> - 소통 능력</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<p style="color: var(--text-muted); margin-bottom: 1rem;">RPG 게임 스타일</p>
|
|
||||||
<div style="font-size: 4rem;">🎮</div>
|
|
||||||
<p>경험치 기반 자동 레벨업</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">7 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 8: 감정 시스템 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>Inside Out 기반 감정 모델</h2>
|
|
||||||
<div class="highlight-box">
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<h3>9개 기본 정서 구현</h3>
|
|
||||||
<p>기쁨, 슬픔, 분노, 두려움, 역겨움, 불안, 부러움, 당황, 지루함</p>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<h3>학습형 AI 시스템</h3>
|
|
||||||
<p>엔트로피 특이점 자동 포착<br>VAD 3차원 감정 분석</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div style="text-align: center; margin-top: 2rem;">
|
|
||||||
<div style="width: 250px; height: 250px; margin: 0 auto; border: 3px solid var(--accent); border-radius: 50%; position: relative;">
|
|
||||||
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1.2rem;">감정 휠</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">8 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 9: 실제 운영 성과 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>이미 검증된 성능</h2>
|
|
||||||
<div class="success-box">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<div class="big-number">88%</div>
|
|
||||||
<p>메모리 사용량 감소</p>
|
|
||||||
<p style="color: var(--text-muted);">988MB → 118MB</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="grid" style="margin-top: 2rem;">
|
|
||||||
<div class="col-4">
|
|
||||||
<h3>3개</h3>
|
|
||||||
<p>안정 운영 중인 로빙</p>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<h3>30일+</h3>
|
|
||||||
<p>테스트 환경 안정 운영</p>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<h3>1-2초</h3>
|
|
||||||
<p>평균 응답 시간</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted); position: absolute; bottom: 60px;">
|
|
||||||
*자체 테스트 데이터 (2025.08)
|
|
||||||
</p>
|
|
||||||
<div class="page-number">9 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 10: 비즈니스 모델 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>명확한 수익 구조</h2>
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>플랜</th>
|
|
||||||
<th>가격</th>
|
|
||||||
<th>로빙 수</th>
|
|
||||||
<th>타겟</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td><strong>Starter</strong></td>
|
|
||||||
<td>X만원/월</td>
|
|
||||||
<td>1</td>
|
|
||||||
<td>1인 기업</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><strong>Growth</strong></td>
|
|
||||||
<td>X만원/월</td>
|
|
||||||
<td>3</td>
|
|
||||||
<td>소규모 팀</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><strong>Business</strong></td>
|
|
||||||
<td>XX만원/월</td>
|
|
||||||
<td>10</td>
|
|
||||||
<td>중소기업</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><strong>Enterprise</strong></td>
|
|
||||||
<td>맞춤형</td>
|
|
||||||
<td>무제한</td>
|
|
||||||
<td>대기업</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<div class="page-number">10 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 11: 시장 진입 전략 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>단계별 성장 로드맵</h2>
|
|
||||||
<div style="position: relative; padding: 2rem 0;">
|
|
||||||
<div style="position: absolute; top: 50%; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--success) 0%, var(--accent) 50%, var(--text-muted) 50%); z-index: 0;"></div>
|
|
||||||
|
|
||||||
<div class="grid" style="position: relative; z-index: 1;">
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="success-box" style="text-align: center;">
|
|
||||||
<h3>Phase 1</h3>
|
|
||||||
<p>Q1-Q2 2025</p>
|
|
||||||
<p><strong>MVP 개발 ✓</strong></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="highlight-box" style="text-align: center;">
|
|
||||||
<h3>Phase 2</h3>
|
|
||||||
<p>Q3 2025</p>
|
|
||||||
<p><strong>Beta 테스트 🔄</strong></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="warning-box" style="text-align: center; opacity: 0.7;">
|
|
||||||
<h3>Phase 3</h3>
|
|
||||||
<p>Q4 2025-Q1 2026</p>
|
|
||||||
<p><strong>50개 유료 고객</strong></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="warning-box" style="text-align: center; opacity: 0.5;">
|
|
||||||
<h3>Phase 4</h3>
|
|
||||||
<p>Q2 2026</p>
|
|
||||||
<p><strong>100개 고객</strong></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">11 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 12: 경쟁 우위 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>독보적 기술력</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<h3>우리만의 차별점</h3>
|
|
||||||
<ul>
|
|
||||||
<li>✅ 유일한 레벨 성장 시스템</li>
|
|
||||||
<li>✅ 감정 기반 기억 저장</li>
|
|
||||||
<li>✅ 경량 AI 모델</li>
|
|
||||||
<li>✅ 마이크로서비스 확장성</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<table style="font-size: 1rem;">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>요소</th>
|
|
||||||
<th>일반 AI</th>
|
|
||||||
<th>RO-BEING</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>성장</td>
|
|
||||||
<td>없음</td>
|
|
||||||
<td><strong>Level 1→20</strong></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>스탯</td>
|
|
||||||
<td>고정</td>
|
|
||||||
<td><strong>3대 능력치</strong></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>경험치</td>
|
|
||||||
<td>없음</td>
|
|
||||||
<td><strong>작업마다 EXP</strong></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">12 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 13: 팀 소개 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>검증된 실행력</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1.5rem; border-radius: 10px; margin-bottom: 1rem;">
|
|
||||||
<h3>김종태</h3>
|
|
||||||
<p>프로젝트 리더, 비전 설계</p>
|
|
||||||
</div>
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1.5rem; border-radius: 10px;">
|
|
||||||
<h3>황한용</h3>
|
|
||||||
<p>기술 리드, 아키텍처</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1.5rem; border-radius: 10px; margin-bottom: 1rem;">
|
|
||||||
<h3>희재</h3>
|
|
||||||
<p>풀스택 개발</p>
|
|
||||||
</div>
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1.5rem; border-radius: 10px;">
|
|
||||||
<h3>강일신</h3>
|
|
||||||
<p>BM 설계, UX 설계</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">13 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 14: 고객 사례 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>실제 사용자의 목소리</h2>
|
|
||||||
<div class="highlight-box" style="text-align: center; margin: 3rem 0;">
|
|
||||||
<h3>현재 Beta 테스트 진행 중</h3>
|
|
||||||
<p style="font-size: 1.5rem; margin: 1rem 0;">10개사 참여</p>
|
|
||||||
</div>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-4">
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1rem; border-radius: 10px; text-align: center;">
|
|
||||||
<p>"AI가 온보딩 시간을 단축시킬 수 있습니다"</p>
|
|
||||||
<p style="color: var(--warning); margin-top: 0.5rem;">⭐⭐⭐⭐⭐</p>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted);">(예상)</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1rem; border-radius: 10px; text-align: center;">
|
|
||||||
<p>"지식 유지와 연속성 확보"</p>
|
|
||||||
<p style="color: var(--warning); margin-top: 0.5rem;">⭐⭐⭐⭐⭐</p>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted);">(목표)</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<div style="background: rgba(255,255,255,0.05); padding: 1rem; border-radius: 10px; text-align: center;">
|
|
||||||
<p>"초기 피드백 수집 중"</p>
|
|
||||||
<p style="color: var(--warning); margin-top: 0.5rem;">⭐⭐⭐⭐⭐</p>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted);">(진행중)</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">14 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 15: 재무 전망 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>명확한 성장 궤적 (목표)</h2>
|
|
||||||
<div class="highlight-box">
|
|
||||||
<ul>
|
|
||||||
<li><strong>2025년 Q4:</strong> 10개 고객, 월 5-10백만원 목표</li>
|
|
||||||
<li><strong>2026년 Q2:</strong> 50개 고객, 월 30-50백만원 목표</li>
|
|
||||||
<li><strong>2026년 Q4:</strong> 100개 고객, 월 80-120백만원 목표</li>
|
|
||||||
<li><strong>2027년:</strong> 500개 고객, 월 4-6억원 목표</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="warning-box" style="text-align: center; margin-top: 2rem;">
|
|
||||||
<h3>손익분기점 목표: 2026년 Q3</h3>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">15 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 16: 투자 유치 계획 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>Pre-A 라운드</h2>
|
|
||||||
<div style="text-align: center; margin: 2rem 0;">
|
|
||||||
<div class="big-number">10-20억원</div>
|
|
||||||
<p>목표 투자 금액</p>
|
|
||||||
</div>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-3">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<h3 style="color: var(--accent);">40%</h3>
|
|
||||||
<p>개발팀 확대</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<h3 style="color: var(--secondary);">30%</h3>
|
|
||||||
<p>마케팅/세일즈</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<h3 style="color: var(--warning);">20%</h3>
|
|
||||||
<p>인프라 확장</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div style="text-align: center;">
|
|
||||||
<h3 style="color: var(--success);">10%</h3>
|
|
||||||
<p>운영 자금</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted); position: absolute; bottom: 60px;">
|
|
||||||
*한국 스타트업 투자 동향 (2024)
|
|
||||||
</p>
|
|
||||||
<div class="page-number">16 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 17: 비전과 미래 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>AI 에이전트를 넘어 디지털 존재로</h2>
|
|
||||||
<div class="highlight-box">
|
|
||||||
<h3>장기 비전 (계획)</h3>
|
|
||||||
<ul>
|
|
||||||
<li>2027년: 500개 활성 로빙 목표</li>
|
|
||||||
<li>2028년: 1,000개 활성 로빙 목표</li>
|
|
||||||
<li>2030년: 로빙 스카우트 마켓플레이스 구축</li>
|
|
||||||
<li>궁극적 목표: AI 에이전트 글로벌 표준</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div style="text-align: center; margin-top: 2rem;">
|
|
||||||
<p style="font-size: 1.5rem; color: var(--accent);">🚀 고도화된 AI 에이전트의 미래</p>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">17 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 18: 리스크와 대응 -->
|
|
||||||
<div class="slide fade-in">
|
|
||||||
<h2>투명한 리스크 관리</h2>
|
|
||||||
<div class="grid">
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="warning-box">
|
|
||||||
<h3>🔸 기술 리스크</h3>
|
|
||||||
<p>→ 오픈소스 활용으로 대응</p>
|
|
||||||
</div>
|
|
||||||
<div class="warning-box">
|
|
||||||
<h3>🔸 시장 리스크</h3>
|
|
||||||
<p>→ 빠른 피벗 전략</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="warning-box">
|
|
||||||
<h3>🔸 경쟁 리스크</h3>
|
|
||||||
<p>→ 차별화 기능 강화</p>
|
|
||||||
</div>
|
|
||||||
<div class="warning-box">
|
|
||||||
<h3>🔸 규제 리스크</h3>
|
|
||||||
<p>→ 컴플라이언스 준수</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page-number">18 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 19: Call to Action -->
|
|
||||||
<div class="slide fade-in" style="background: linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);">
|
|
||||||
<h2>함께 만들어갈 미래</h2>
|
|
||||||
<div style="text-align: center; margin: 3rem 0;">
|
|
||||||
<p style="font-size: 1.8rem; margin-bottom: 2rem;">
|
|
||||||
"당신의 투자가 1인 기업과<br>소규모 스타트업의 미래를 바꿉니다"
|
|
||||||
</p>
|
|
||||||
<div class="highlight-box" style="background: rgba(0, 212, 255, 0.2);">
|
|
||||||
<h3>투자 목표</h3>
|
|
||||||
<p class="big-number">Pre-A 10-20억원</p>
|
|
||||||
<p>목표 수익률: 5년 내 3-5배</p>
|
|
||||||
</div>
|
|
||||||
<p style="margin-top: 2rem; font-size: 1.3rem;">
|
|
||||||
📧 invest@ro-being.com
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p style="font-size: 0.9rem; color: var(--text-muted); position: absolute; bottom: 60px;">
|
|
||||||
*Qubit Capital VC Return Guide (2024)
|
|
||||||
</p>
|
|
||||||
<div class="page-number">19 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slide 20: Thank You -->
|
|
||||||
<div class="slide slide-title fade-in" style="background: radial-gradient(ellipse at center, var(--secondary) 0%, var(--background) 100%);">
|
|
||||||
<h1>감사합니다</h1>
|
|
||||||
<p style="font-size: 1.8rem; margin: 2rem 0; color: var(--accent);">
|
|
||||||
"로빙과 함께라면,<br>당신은 더 이상 혼자가 아닙니다"
|
|
||||||
</p>
|
|
||||||
<div style="margin-top: 3rem;">
|
|
||||||
<div style="width: 150px; height: 150px; margin: 0 auto; background: white; border-radius: 10px; display: flex; align-items: center; justify-content: center;">
|
|
||||||
<span style="color: var(--background); font-size: 1rem;">QR Code</span>
|
|
||||||
</div>
|
|
||||||
<p style="margin-top: 1rem;">상세 자료 다운로드</p>
|
|
||||||
</div>
|
|
||||||
<p style="margin-top: 2rem;">
|
|
||||||
📧 contact@ro-being.com<br>
|
|
||||||
🌐 www.ro-being.com
|
|
||||||
</p>
|
|
||||||
<div class="page-number">20 / 20</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// 간단한 스크롤 애니메이션
|
|
||||||
const observerOptions = {
|
|
||||||
threshold: 0.1,
|
|
||||||
rootMargin: '0px 0px -100px 0px'
|
|
||||||
};
|
|
||||||
|
|
||||||
const observer = new IntersectionObserver((entries) => {
|
|
||||||
entries.forEach(entry => {
|
|
||||||
if (entry.isIntersecting) {
|
|
||||||
entry.target.style.opacity = '1';
|
|
||||||
entry.target.style.transform = 'translateY(0)';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}, observerOptions);
|
|
||||||
|
|
||||||
// 모든 슬라이드에 observer 적용
|
|
||||||
document.querySelectorAll('.slide').forEach(slide => {
|
|
||||||
slide.style.opacity = '0';
|
|
||||||
slide.style.transform = 'translateY(30px)';
|
|
||||||
slide.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
|
|
||||||
observer.observe(slide);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 키보드 네비게이션 (선택사항)
|
|
||||||
let currentSlide = 0;
|
|
||||||
const slides = document.querySelectorAll('.slide');
|
|
||||||
|
|
||||||
document.addEventListener('keydown', (e) => {
|
|
||||||
if (e.key === 'ArrowDown' || e.key === ' ') {
|
|
||||||
e.preventDefault();
|
|
||||||
if (currentSlide < slides.length - 1) {
|
|
||||||
currentSlide++;
|
|
||||||
slides[currentSlide].scrollIntoView({ behavior: 'smooth' });
|
|
||||||
}
|
|
||||||
} else if (e.key === 'ArrowUp') {
|
|
||||||
e.preventDefault();
|
|
||||||
if (currentSlide > 0) {
|
|
||||||
currentSlide--;
|
|
||||||
slides[currentSlide].scrollIntoView({ behavior: 'smooth' });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Loading…
x
Reference in New Issue
Block a user