본문 바로가기
프로그래밍/Portfolio Log

[Portfolio Log] WebRTC 기반 포폴 기록 1

by YuminK 2023. 9. 28.

 

최근에 미디어수프를 이용하여 1:N 화상통화까지 구현했고 디테일한 부분(장치 설정, 하단 컨트롤러)은 나중에 작업하려고 한다. 테스트가 필요한 부분까지는 충분히 작업했다고 본다. 

 

다음으로 Phaser를 이용하여 Tilemap 기반의 게임을 개발하는 부분을 작업하고 있다.

순수 javascript 기반으로 게임을 개발하지 않는 이유는 다음과 같다. 

 

1. 게임 프레임워크를 개발하는 시간이 들지 않는다.

게임 하나를 만드는 과정에서 사용자의 입력, 애니메이션 처리, 충돌, 렌더링 같은 다양하게 신경써야 할 요소들이 한 두 가지가 아니다. 근데 이미 만들어둔 게임 프레임워크가 있다면, 빠른 개발을 위해서 충분히 쓸만 하다고 판단했다.

 

2. 내 기준에서 게임 프레임워크 구현이 포트폴리오의 가치가 있는가? 

게임 프레임워크 개발하는 것도 실력이긴한데, C++기반 게임 프레임워크로 포폴 만든 게 너무 많아서 내 입장에서 굳이 프레임워크부터 개발할 필요성을 느끼기 어렵다. 

 

게임 프레임워크 개발로 인정을 받으려면 엔진 자체에 대한 깊이가 있어야 하는데, 그 정도 범위까지 개발 범위로 잡고 있지 않다. 게임은 서브 느낌으로 가고 WebRTC 기술과 융합하는 것에 초점을 두려고 한다.

 

3. Phaser에 대한 흥미

웹 기반에서 사용되는 게임 프레임워크인 Phaser 자체를 익혀보고 싶었다. 

 

=> 이러한 이유로 Phaser를 개발 스택으로 선정했다. 

 

프로젝트를 진행하며 얻을 수 있는 것

1. WebRTC에 대한 이해도

 - P2P 연결에 대한 이해

 - 미디어 서버에 대한 이해

 

2. Phaser 사용 경험

 - 웹 기반에서 게임 개발도 할 줄 안다.

 - 자바스크립트 이해도가 높아지는 것은 덤

 

3. 새로운 기술을 배우는 것에 주저하지 않는 사고방식

 - Phaser, Mediasoup 모두 최근에 접한 기술

 - 모든 기술은 배울수록 쉬워진다. 


앞으로 진행할 작업은.. 많이 남아있다. 

 

1. 타일맵 충돌체 개선

2. 타일맵 z-index 값 조정

3. 집 내부에 들어갔을 때 사용할 Scene 구현(문 오브젝트랑 상호작용)

4. 멀티플레이 기능 추가(오브젝트 이동, 채팅, Mediasoup ...)

5. 기타 UI 추가 작업(마이크/카메라 변경, 채팅 UI, 영상 UI, 하단 컨트롤러)

 

하루 8시간 작업시 예상 시간)

1~3: 1~2번은 그냥 노가다 작업, 3번은 검색하면 그냥 나올 거고. ( 1일 )

 

4 - 1: 오브젝트 이동: 적절한 퍼포먼스, 애니메이션 동기화 등을 생각해서 ( 1 ~ 1.5일 )

 

4- 2 채팅: 컨텐츠와 연동하여 Room 부분 연결/끊김 처리 진행, DB에 채팅 저장하는 로직은 처리하지 않을 것.

채팅 로직 자체는 하루 정도면 다 될 것 같은데 UI쪽을 깔끔하게 뽑으려면 빡셀 것 같다. ( 1.5 ~ 2일 )

(근데 또 은근히 canvas 밖에 없어서 쉬울 수도 있다.) 

 

4 - 3 Mediasoup 연동: 코드 자체는 이미 구현되어 있는데 다른 부분과 맞물려서 돌아가는 부분을 확인하는 게 중요할 것으로 보인다. (1.5일)

 

5. UI 추가 작업

하단 컨트롤러, 장치 설정 UI - ( 1.5 ~ 2일 )

내가 front 개발에 약해서 시간 오래 걸린다.

 

추석때 많이 해두면 금방 끝내겠네. 

댓글