C2S - webRTC 화상회의 모의 전술 시뮬레이터

💡 프로젝트 소개

C2S(Command Control Simulation)는 WebRTC 기술을 활용하여 화상 회의, 단계별 시나리오에 따른 실시간 전술 훈련을 진행할 수 있고, stt를 활용하여 훈련로그를 기록하고 전술 유사도를 정밀 분석을 할 수 있는 웹 서비스입니다.

📅 프로젝트 기간

2026.01.12 ~ 2026.02.08 (5주)

✨ 주요 기능

실시간 인터랙션

• 동적 위치 동기화: 지도 위 유닛의 실시간 이동 및 위치 공유
• 원격 전술 지도: 화상캠 연동과 실시간 드로잉 도구를 활용한 가시적인 전술 지시
• 실시간 협업: 원격지 간 끊김 없는 커뮤니케이션 환경 구축

AI 기반 지능형 분석

• 음성 텍스트화: 훈련 중 발생하는 모든 음성 지시를 데이터로 기록 및 로그화
• 전술 유사도 검증: 학습된 표준 전술 모델과 실제 수행 데이터를 비교 분석
• 맞춤형 피드백: 데이터 분석에 기반한 객관적인 훈련 성과 리포트 제공

스마트 리플레이

• 챕터별 하이라이트: 주요 상황별로 인덱싱된 다시보기 기능으로 효율적인 복기 가능
• 훈련 아카이브: 수행한 모든 훈련 이력을 시각화하여 데이터 시트 형태로 한눈에 확인

🛠️ 기술 스택

Backend - Spring

Frontend

Infrastructure & DevOps

Communication & Collaboration

📁 프로젝트 구조

Backend

펼쳐보기

backend/src/main/java/com/ssafy
└── main
    ├── api
    │   ├── controller/
    │   │   ├── AuthController.java
    │   │   ├── ChatController.java
    │   │   ├── MapController.java
    │   │   ├── ResultController.java
    │   │   └── ...
    │   ├── service/
    │   │   ├── AuthService.java
    │   │   ├── ChatService.java
    │   │   └── ...
    │   ├── entity/
    │   ├── dto/
    │   │   └── request/
    │   └── repository/
    ├── config/
    │   ├── JpaConfig.java
    │   ├── MinioConfig.java
    │   ├── OpenViduConfig.java
    │   ├── PasswordEncoderConfig.java
    │   ├── RedisConfig.java
    │   ├── SecurityConfig.java
    │   ├── SwaggerConfig.java
    │   ├── WebMvcConfig.java
    │   └── WebSocketConfig.java
    ├── common/
    │   ├── auth/
    │   ├── exception/
    │   ├── interceptors/
    │   ├── model/
    │   └── util/
    ├── GroupCallApplication.java
    └── HashUtil.java

Frontend

펼쳐보기

frontend
├── public/
│   └── vite.svg
├── src/
│   ├── components/
│   │   └── ui/
│   │       └── button.tsx
│   ├── services/
│   │   ├── api.ts
│   │   ├── openvidu.ts
│   │   ├── websocket.ts
│   │   └── index.ts
│   ├── stores/
│   │   ├── index.ts
│   │   ├── useAuthStore.ts
│   │   └── useRoomStore.ts
│   ├── types/
│   │   └── index.ts
│   ├── hooks/
│   │   └── index.ts
│   ├── assets/
│   ├── lib/
│   │   └── utils.ts
│   ├── App.tsx
│   ├── main.tsx
│   └── index.css
└── @/
    └── components/
        └── ui/

🎯 팀원 소개

신우혁	이효은	변현준	양제욱	정혜주	노현민
FrontEnd / AI	BackEnd / Infra	FrontEnd	FrontEnd	BackEnd	BackEnd

🎯 협업 방식

• Git

  • MR시, 팀원이 코드리뷰를 진행하고 피드백 게시

• JIRA

  • 작업 단위에 따라 Epic-Story-Task 분류
  • 업무의 할당량을 정하여 Story Point를 설정하고, In-Progress -> Done 순으로 작업

• 회의

  • 데일리 스크럼 10시 전날 목표 달성량과 당일 업무 브리핑
  • 모르는 부분이 있으면 주저 없이 팀원에게 질문

• Notion

  • 회의록 기록하여 보관
  • 컨벤션, 트러블 슈팅, 개발 산출물 관리

🎯 프로젝트 산출물

• 요구사항명세서
• API명세서
• ERD
• 아키텍처

💛 프로젝트 결과물

• 포팅메뉴얼

💛 화면 구성

로그인페이지

• 군번, 비밀번호를 통해 로그인 진행

회원가입

• 이름, 계급, 소속부대, 비밀번호, 군번 정보 기입
• 군번 중복확인을 위한 조회 후 사용가능 여부 확인

메인 페이지

• 방 리스트 출력
• 대기중, 진행중, 습격전술, 전술통제, 방어준술, 자율훈련에 따라 필터 처리
• 네비게이션 메뉴바에 훈련, 평가, 결과, 설정으로 구성
• 방 번호 검색 가능
• 입장시 otp 입력

로비 페이지

• 방장은 인원의 역할을 각각 할당가능(다른 인원은 불가)
• 방장만 시작 가능
• 훈련모드, 평가모드에 따라 표시
• 시나리오에 대한 내용을 간략히 표시
• 맵에 대한 정보 표시
• 시작전 카메라, 음성 상태 여부 체크, 활성화 선택가능
• 채팅 가능
• 방장만 otp 재발급가능 밎 표시

방 만들기

• 방 제목 기입
• 작전 전술 선택
• 훈련모드 선택시 돌발상황 여부 선택 가능
• 평가모드 선택시 돌발상황 필수 선택 됨

훈련 페이지

• 핑, 마커, 움직임 실시간 통신
• 화상 회의
• 단계별 전술 가이드 제공
• 돌발상황 랜덤 제공

설정 페이지

• 설정 페이지에는 프로필(이름, 이미지, 계급, 소속부대, 비밀번호) 정보 수정 가능
• 비디오, 오디오 설정 가능