Giter Club home page Giter Club logo

dasoni's Introduction

다소니 로고

☝로고를 클릭하면 UCC로 이동합니다


프로젝트 소개

💗 프로젝트 개요

  • N:N 랜덤 화상 미팅 / 매칭 서비스
  • 서비스 명 : 다소니

📆 프로젝트 일정

  • 2023.7.4 ~ 2023.8.18 ( 7주)

✨팀

강한(팀장) 이명우 권현우 김유진 김선희 민경현

Backend

Backend

Backend
DevOps

Backend

Frontend

Frontend

WebSocket
채팅,매칭,알람 서비스
매칭, 레이팅 알고리즘
REST API
CI/CD
프로필 사진 API
CI/CD
회원 API
반응형 CSS
WebSocket 대기방, 미팅 시스템
WebRTC
UX / UI
회원가입 및 로그인
모달 및 컴포넌트
CSS
@27kanghan @Fishphobiagg @mycodeisnoob @Yujin830 @KimSeonHui @minaldo15



🔧 기술 스택

Back-end & Front-end

Java Spring Spring Boot Spring Security

React TypeScript Redux

DataBase

MySQL Redis

CI/CD & Infra Tools

Jenkins Docker Nginx

Collaboration Tools

Notion Mattermost

Issue & Configuration Management

GitLab Jira




목차

  1. 기획 배경
  2. 기능 소개
  3. 시연 영상
  4. 트러블 슈팅
  5. 프로젝트 산출물



🎉기획 배경

배경

일반적으로 미팅/소개팅을 할 때는 상대방의 사진과 간단한 정보 등을 전달 받게 됩니다. 하지만 막상 실제로 만나보면 이전에 받은 사진과 실물이 달라 실망할 때 많습니다.

그래서 다소니는 미리 주고받는 정보 없이 다양한 사람들과의 랜덤 미팅으로 실망감 대신 설레고 즐길 수 있는 미팅을 만들고자 했습니다.


의의

랜덤 미팅을 통해 3가지 기대를 할 수 있습니다.

  1. 미팅 전 상대방에 대한 아무런 정보가 없어 선입견을 가지지 않게 됩니다.
  2. 미팅을 진행하면서 얼굴, 직업, 나이 정보 등이 공개되어 정보가 공개될수록 다른 사람들과 소통 했을 때 호기심이 극대화 되고 설렘을 느낄 수 있습니다.
  3. 미팅과 매칭 서비스를 통해 돈과 시간 소비하는 것을 줄이고 다양한 사람들과 만남을 가질 수 있습니다.



🔗기능 소개

시스템 아키텍쳐

image



핵심 기능

레이팅 시스템

  • 미팅 내 퍼포먼스(시그널 수신 횟수 및 매칭 여부)에 따른 등수 산출
  • 등수에 따른 레이팅 변동값 부여
  • ELO 알고리즘 적용
  • K 가중치 40
  • 내 레이팅 vs 상대 레이팅(미팅 방의 평균 레이팅)을 통해 기대 승률 계산
  • 가중치와 기대 승률을 통해 가중 레이팅 변동값에 추가적인 변동값 합산

실시간 매칭

16 매칭 버튼 클릭

  • 빠른 매칭 버튼, 메기 매칭 버튼 클릭 시 매칭 중 모달창 등장
  • 매칭 완료 되면 안내 문구 출력 후 미팅 페이지로 이동

매칭 알고리즘

  • Redis에 성별 및 레이팅에 따른 대기열 큐 구현
  • 각 레이팅 별로 들어갈 수 있는 큐가 두개씩 존재 ex) 600~900점 큐, 750~1050점 큐
  • 자신의 레이팅에 맞는 큐 중, 인원이 적은 큐에 매칭 신청자를 Push
  • 들어간 큐의 인원이 3명 이상일 경우 상대 성별의 동일 레이팅 대 큐 인원 확인
  • 상대 큐의 인원 또한 3명 이상일 경우 매칭!
  • 매칭 완료 알림 -> 매칭시 SSE 구독, 매칭 완료시 서버에서 알림을 보냄

메기 매칭 알고리즘

  • 성별, 레이팅에 따른 대기열 큐, 방 대기열 큐 존재

성별 , 레이팅 큐

  • 큐의 인원이 1명 이상일때 상대 성별 큐 확인 및 매칭 절차 진행

방 대기열 큐

  • 방의 점수에 따라 들어갈 수 있는 큐가 한개씩 존재
  • 일반 매칭으로 방이 생성되었을 떄 매칭된 유저들의 대기열 큐 점수의 중간값(ex 600~900 큐이면 750)이 방 대기열 큐의 레이팅

알고리즘

  • 해당 레이팅 대에서 매칭이 되었을 경우 이에 해당하는 방 대기열 큐에서 메기 매칭이 가능한 방이 있는지 확인
  • 메기 입장 가능한 방이 있을 경우 메기 투입, 큐에서 방과 유저 삭제
  • 방이 대기열에 등록 되었을 경우에도 방의 점수대에 맞는 메기 대기열 큐에서 인원 확인 및 매칭 절차 진행
  • 알맞은 인원이 큐에 있을 경우 메기를 방에 투입, 큐에서 모두 삭제

다대다 화상 미팅

8 미팅방페이지 - 미팅 시작

9 미팅방페이지 - 참여자 화면

10 미팅방페이지 - 첫인상 투표

11 미팅방페이지 - 정보 공개

12 미팅방페이지 - 질문

13 미팅방페이지 - 최종 시그널



🎵시연 영상

핵심 기능

실시간 매칭

짱구빠른매칭-online-video-cutter com

다대다 화상 미팅

미팅방 입장

짱구사설방-online-video-cutter com

첫인상 투표

첫인상 투표

정보 공개

정보 공개

질문 공개

질문 공개

메기 입장

메기 입장

최종 투표

최종 투표

매칭된 둘만의 채팅방

매칭된 둘만의 채팅방



⚽트러블 슈팅



🎈프로젝트 산출물

dasoni's People

Contributors

27kanghan avatar fishphobiagg avatar kimseonhui avatar minaldo15 avatar mycodeisnoob avatar yujin830 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.