TIL

[TIL07]자바 스크립트를 사용한 플래피버드 만들기

explosion149 2024. 10. 21.

 

원래의 목적은 러닝게임을 만들던 중이었으나

 

해당 게임을 변형하여 서로 어떠한 배움이 있었는지에 대한 내용을 공유하기 위함이였다.

 

처음에는 해당 게임에서 추가적인 장에물 Obstacles 들을 만드는 것이었다.

https://codenamefdcc.github.io/rtanRun/

 

rtan is sparta! hu!

지옥에서 온 스파르타 인! Mute:false

codenamefdcc.github.io

해당게임에서 장애물의 등장시간 등장 패턴[크기, 속도, 위치] 등을 조절하였고 고정적인 움직임에 심심함을 느껴 math를 통한 sin, cos 를 사용한 원형 웨이브를 적용하였다.

해당 게임은 frame을 통한 강제적인 패턴이 진행되었고 키보드를 사용하는것은 불편함으로 보다 편한 마우스를 사용하는 꼼수를 적용하였다.

하지만 결국 문제점이 발생했는데 이 게임은 피지컬 보다 운에 많은 가중치가 발생하였기에 좀더 피지컬에 적합한 게임인 플래피 버드 형태의 게임으로 변경하기로 했다.

https://github.com/CodeNameFDCC/rtanRun

 

GitHub - CodeNameFDCC/rtanRun: RuningGame

RuningGame. Contribute to CodeNameFDCC/rtanRun development by creating an account on GitHub.

github.com

 

 

플래피 버드 형태의 게임은

모바일에서도 플레이가 가능하게 마우스 기능을 사용했으며 키보드도 물론 어느키를 누르든지 점프가 가능한 형태로 만들었다.

https://codenamefdcc.github.io/FlappyRtan/

 

Rtan Is Bird

_____________ Score: 0 Restart Game

codenamefdcc.github.io

 

하지만 해당 형태의 게임을 만들기 싫어지는 문제가 발생했다.

기존의 코드에서 Y좌표값에 꼼수를 부리다 충돌계산부분에서 아주 귀찮은 일이 발생했기 때문에 둘중 하나를 변경해야 하는 상황이 왔고 다시 러닝게임으로 돌아갔다 결국 위의 운 가중치 증가로 인하여 다시 만들게 되었다.

꼼수를 잘못 부리면 결국 제자리 걸음 이었다.

 

게임은 완성하여 게임 진행이 매우 만족스러웠으나

컴퓨터 마다 게임의 속도가 달라지는 문제점이 발생했다.

처음에 인지 하지 못하였지만 추후 다른 컴퓨터에서 테스트 결과 몇몇 컴퓨터에서 엄청난 속도로 게임이 진행되어 플레이가 어려울 지경이었고 몇몇 컴퓨터에서는 정상적인 속도로 진행이 되었다.

 

해당 정상적인 속도가 비정상 적인 속도라 판단하여 여러 방법을 사용해 보았지만 원인을 규명하기 힘들어 해당 지점에서 멈추게 되었다.

 

deltatime을 사용한 게임 진행으로 여러 쿨타임이 구현되었고 해당 deltatime에 gameSpeed를 곱하여 게임 속도를 평균적인 속도로 강제 하였다.

 

추후 해당 문제 해결 방안이나 원인을 알게 된다면 한번 수정 해보는것도 좋을것 같다.

https://github.com/CodeNameFDCC/FlappyRtan

 

GitHub - CodeNameFDCC/FlappyRtan

Contribute to CodeNameFDCC/FlappyRtan development by creating an account on GitHub.

github.com

 

 

댓글

💲 추천 글