✔ 프로젝트명 : Rendez-Boo(랑데부)
✔ 한줄 소개 : Web RTC를 기반으로 한 1대1 / 3대3 블라인드 데이팅 웹 서비스
✔ 개발 기간 : 23.01.09 ~ 23.02.17 (6주)
✔ 팀원 : 이홍주 김명준 안예나 유선준 이재원 정훈
✔ 사용 기술스택 : SpringBoot, React, Docker, AWS + (4. 시스템 아키텍처 참고)
✔ 1대1 미팅
- 임의의 상대방과 1대1 미팅이 진행됩니다.
- 처음에 블라인드로 시작했다가 시간이 지날수록 (매 1분마다) 얼굴이 조금씩 공개됩니다.
- 미팅 중에 상대방이 느낀 감정을 알 수 있습니다.
- 정해진 시간이 끝나면 미팅이 종료되고 상대방과 친구를 맺을 수 있습니다.
✔ 3대3 미팅
- 방을 생성하거나 기존에 생성된 방에 입장해서 3대3 미팅을 진행할 수 있습니다.
- 미팅은 블라인드 상태로 진행되고 게임을 통해서 상대방의 얼굴이 공개됩니다.
- 게임을 일정 횟수 이상 하게 되면 사랑의 작대기를 통해 마음에 드는 상대를 지목할 수 있습니다.
✔ 채팅
- 1대1 혹은 3대3 미팅을 통해서 친구가 된 상대와 채팅을 나눌 수 있습니다.
✔ 프로필
- 1대1 미팅에서 상대방이 느낀 감정 데이터를 종합해 다이어그램 형태로 볼 수 있습니다.
- 활동 내역에 따른 뱃지가 지급됩니다.
-
WebRTC를 활용한 실시간 채팅 및 영상 공유 기능 구현
-
1대1과 3대3 두 가지 형태의 다른 서비스 통해 풍부한 사용자 경험 제공
-
블라인드 + 감정 데이터 분석 및 제공을 통해 사용자에게 차별화된 서비스 제공
-
Face API를 활용한 감정 인식
-
tf.js. facemesh를 사용하여 얼굴 인식 후 Three.js 활용한 블라인드 처리
-
-
각 데이터 형태에 적합한 3가지 다른 데이터베이스 적용(기본 - MySql, 채팅 이력 - MongoDB, JWT - Redis)
-
매칭이 된 상대와 Web RTC를 활용한 실시간 채팅 및 NoSql을 활용한 채팅 데이터 누적 및 저장
-
( Refresh - Acees ) JWT를 활용한 사용자 인증 및 cookie와 주기적 재발급을 통한 유저 보안
-
'우주(랑데뷰)'라는 테마를 활용한 통일성 있으며 컨셉츄얼한 디자인
-
유저의 서비스 이용 내역 (미팅 기록) 등에 따른 뱃지 부여 및 감정 데이터 다이어그램 형태로 제공
 이홍주 |
 김명준 |
 유선준 |
 안예나 |
 이재원 |
 정훈 |
✔ 이홍주
- 팀장
- 일정관리(Jira)
- Backend Entity 및 API 구현
- Backend 에러 및 예외처리 handler 설정 및 적용
- OpenVidu API 설정 및 적용
- Frontend 3대3 미팅방 구현
- Frontend 3대3 미팅 게임 구현
✔ 김명준
- Backend Entity 및 API 구현
- Docker 및 Jenkins를 활용한 CI/CD 구축
- Docker 및 AWS를 활용한 서버 배포
- Nginx를 활용한 프론트 웹서버 구축 및 리버스 프록시 설정 및 적용
- Facemash와 Three.js를 활용한 얼굴 인식 및 블라인드 설정 및 적용
- FaceAPI를 활용한 감정인식 설정 및 적용
- Frontend 1대1 미팅방 구현
- Frontend 3대3 미팅 게임 구현
✔ 안예나
- Figma를 활용한 Prototype 제작
- 서비스 화면 컨셉 구현
- 서비스 대표 로고 제작
- Frontend 화상 서비스 시각적 요소 구성
- Frontend Websocket 활용 요소 시각화
- Frontend 미팅 룸 구분 요소 구성 및 구현
- 서비스 시작 페이지, 화상미팅 서비스 페이지, 메신저 페이지 디자인
- 프로젝트 기록 정리
- UCC 제작
✔ 유선준
- Backend Entity 및 API 구현
- Backend NoSql(MongoDB) 적용
- WebRTC Stomp 서버 구축 및 클라이언트 생성&연결
- Frontend Redux 설정 및 적용
- Frontend JWT 보관 및 발급 구성 및 적용
- Frontend 로그인 및 로그아웃 구성 및 적용
- 산출물 문서화
- 프로젝트 발표
✔ 이재원
- Backend Entity 및 API 구현
- Docker 및 Jenkins를 활용한 CI/CD 구축
- Docker 및 AWS를 활용한 서버 배포
- Backend Redis 적용
- Backend JWT 발급 및 인증 로직 구성 및 적용
- 소셜 로그인 설정 및 적용
✔ 정훈
- Figma를 활용한 Prototype 제작
- Frontend 서비스 화면 컨셉 구현
- 페이지 에니메이션 요소 구현
- Frontend 소셜 로그인 프론트엔드 요소 구현
- Frontend 휴대폰 인증 프론트엔드 요소 구현
- Frontend 미팅용 게임 디자인 적용
- Frontend 이용자 통계 요소 시각화 및 디자인
- 페이지 구분 요소 구성 및 구현
- 회원가입 페이지, 회원정보 페이지, 메인 페이지 디자인