1. Rhythm Game : Structure & Function

이번 포스팅에서는

리듬 게임 프로그램을 어떠한 구조로 만들었고

어떠한 기능들이 있는지

간단하게 설명해드리도록 하겠습니다.

=====================================================================

 Rhythm Game : Structure & Function

1. Rhythm Game : Summary?

 일단 리듬 게임을 만들면서 초기에 생각했던 계획과 구성에 대해서 알려드리도록 하겠습니다.

처음 하는 프로젝트라 어느 정도 기간에 얼마큼 기능을 구현할 수 있을지 감이 안왔었기 때문에 아이디어를 선정하는데도 고민이 많았습니다. 

프로그램을 설계하는데 기간은 총 1주일 그리고 3명에서 작업을 시작했습니다.

기본적으로 3명에서 서버, 클라이언트 GUI 파트로 나누고 서버와 클라이언트가 소통하면서 만들어야한다는 조건이 있었습니다.

그 때문에 3명 중에서 2명은 게임에 있어서 필요한 전반적인 기능을 담당하여 서버, 클라이언트로 나뉘어 작업하고, 나머지 한 명은 리듬 게임을 구현하기 위한 게임을 설계했습니다.

사실 처음 하는 프로젝트 이다 보니깐 기존 계획에서 기능이 추가되고 서로의 파트를 도와가면서 하다 보니깐 계획표가 의미가 없었던 것 같긴 하네요..ㅎ

2. Rhythm Game : Structure?

 이제 프로그램의 전체적인 흐름을 간단하게 소개하겠습니다.

최대한 실제 게임과 유사하게 만드는 것을 목표로 여러 가지 기능을 추가하였습니다.

기본적으로 로그인을 하고 방에 입장하는 것을 어느 게임과 같고 거기에 비밀번호, 1인용 or 2인용 등을 추가하였습니다.

또한 게임 대기 방 내에서도 1인용과 2인용, 비번방, 방 이름을 변경할 수 있도록 하였습니다.

채팅방이 게임 대기방 내에 밖에 없다는 점을 고려해서 쪽지기 능을 추가하였는데 이때 쪽지가 왔다는 알림 대신에 읽지 않는 쪽지의 개수를 화면에 출력하도록 구성하였습니다.

게임이 시작한 후에는 2인용일 경우 서로의 점수를 실시간으로 볼 수 있고, 1인용일 경우 자신의 최대 점수를 기준으로 판단하도록 설계했습니다.

물론 게임이 종료된 후에도 기존에 존재하던 방으로 돌아가게 되고 게임 결과에 따라 반영된 변경된 유저의 정보도 게임 대기 방에서 볼 수 있습니다.

3. Rhythm Game : Function?

 

이제 보다 자세하게 각 화면을 어떤 식으로 기능을 구현하였는지 살펴보겠습니다.

코드상으로 보기엔 너무 방대하여 코드는 나중에 파트별로 나누어 소개하도록 해보겠습니다.

 1) Login & Signup

[프로그램 실행 시 로딩화면]

사실 이 부분은 필요 없는 부분이기도 하지만 최대한 실제 게임과 비슷하게 만들어보고자 넣은 기능입니다. 아래 로딩 중을 나타내는 원도 움직이는 gif로 넣었습니다.

[로그인과 회원가입]

로그인과 회원가입 창은 심플하게 만들어보려고 했습니다. 

회원의 정보로는 아이디, 이름, 비밀번호 3가지를 취급하고 2개의 비밀번호가 일치하지 않거나 약관에 동의하지 않는다면 회원가입이 되지 않도록 하였습니다.

 2) UserList & RoomList

 로그인 화면 이후로부터는 최대한 많은 기능을 넣어보도록 노력했습니다.

[방 목록 화면 및 방 만들기 프레임]

좌측 상단에는 로그인한 사람의 아이디와 전적이 표시됩니다. 또한 아이콘 우측 빨간 버튼이 쪽지함 버튼으로 자신이 읽지 않은 쪽지의 개수가 나타나게 됩니다.

방 만들기의 경우 1인용과 2인용을 설정할 수 있도록 설계하였고 1인용의 경우에는 방 이름과 비밀번호 방을 설정할 수 없도록 하였습니다.

하지만 2인용의 경우 방 제목, 그리고 비밀번호 방을 선택적으로 만들 수 있고 방 제목의 경우 랜덤으로 특정 방 제목이 출력되도록 하였지만 사용자가 임의대로 재설정이 가능합니다.

빠른 입장은 특정 화면은 없지만 버튼을 누르면 방 목록에서 비밀번호 방이 아니고 유저의 수가 가득 차지 않은 방으로 자동 입장하게 됩니다.

[쪽지함과 쪽지 보내기]

내 정보 하단에는 로그인한 유저의 목록이 출력되는데 특정 유저를 클릭하면 쪽지를 보낼 수 있게 됩니다.

또한 자신의 쪽지함을 클릭하면 수신과 발신이 나뉘어 쪽지를 확인할 수 있고, 해당 쪽지를 읽었는지를 좌측에 표시했습니다.

 3) Game Room

[1인용 게임 대기룸]

[2인용 게임 대기룸]

방 만들기를 통해 게임 대기룸으로 입장하면 방 생성 시의 옵션에 따라 1인용과 2인용으로 따로 출력됩니다. 

왼쪽에는 정보에는 자신의 정보가 출력되고 오른쪽에는 상대방이 출력됩니다. 1인용을 경우 오른쪽 정보는 아예 출력되지 않습니다.

방장은 정보 위에 왕관 아이콘이 나타나게 됩니다.

또한 방장은 상대방이 준비 버튼을 눌렀을 때만 시작 버튼을 누를 수 있고 방장이 아닌 사람은 준비 버튼만 누를 수 있게 구현하였습니다.

노래 선택은 방장만 권한이 있고 상대방이 준비하지 않았을 때만 노래를 선택할 수 있습니다.

노래 선택 창 하단에는 두 유저끼리 채팅이 가능하고 추가로 준비나 사용자가 나가고 들어오는 상황을 채팅창에 출력되도록 설계했습니다.

[방 설정 변경 프레임]

[초대하기 프레임]

1인용, 2인용 또는 방 제목, 비밀번호 방 설정은 방에서도 설정할 수 있습니다.

1인용, 2인용으로 변경할 시 그에 알맞은 형태로 방의 정보가 재배치됩니다.

초대하기 버튼은 상대방이 없을 때만 사용 가능하도록 설계했습니다.

현재 로그인 중이고, 방에 들어가 있지 않은 유저에게 초대하기 메세지를 보낼 수 있습니다.

 4) Game Frame

[카운트 다운 및 게임화면]

게임이 시작되면 3초의 카운트 다운이 있고 그 후에 게임이 시작됩니다.

노트가 떨어질 때 정해진 범위에 따라 점수가 다르게 채점되고 해당 점수에 따른 결과가 출력됩니다.

또한 2인용일 경우 상대방의 점수가 오른쪽 하단에 실시간으로 출력됩니다. 

(사진 찍는 컴퓨터 폰트 문제로 보이지 않지만, 원래는 ㅁㅁㅁ가 아닌 상대방입니다)

이렇게 게임이 종료되면 다시 기존의 방으로 이동하게 되고 왼쪽 오른쪽에 각자의 전적이 갱신되어 표시됩니다.

이번에 프로젝트 한 내용을 간단하게 소개했는데 기회가 된다면 각 기능별로 어떻게 구현했는지도 올리겠습니다~