본문 바로가기
도전! N잡러!/도전! 게임 개발!

TAP FLOAT 개발 일기 #10

by NAWE 2023. 9. 25.
반응형

안녕하세요. 나위입니다.

STUDIO NAWE의 첫 타이틀. TAP FLOAT의 개발 일기를 찾아주셔서 감사합니다.

 

벌써 개발 일기가 10회나 이어졌네요. 감개가 무량합니다.

이전 포스팅에서 이어지는 내용이오니, 못 보신 분들은 아래 링크로 앞 내용을 먼저 보고 오시는 게 좋겠어요!

 

어서오세요! TAP FLOAT 개발 일기입니다!


TAP FLOAT 개발 일기 #0 바로가기 ◀

TAP FLOAT 개발 일기 #1 바로가기 ◀

TAP FLOAT 개발 일기 #2 바로가기 ◀

TAP FLOAT 개발 일기 #3 바로가기 ◀

TAP FLOAT 개발 일기 #4 바로가기 ◀

TAP FLOAT 개발 일기 #5 바로가기 ◀

TAP FLOAT 개발 일기 #6 바로가기 ◀

TAP FLOAT 개발 일기 #7 바로가기 ◀

TAP FLOAT 개발 일기 #8 바로가기 ◀

TAP FLOAT 개발 일기 #9 바로가기 ◀

 

그럼, 10회 차도 시작합니다!


지난 포스팅에서 플레이어인 '조니'의 죽음을 개발했었습니다. (조니...ㅠ)

 

그 이후에 게임 오버 화면을 만들려다 보니, 점수 체계가 필요할 것 같았어요.

'직전 플레이의 기록은 몇이고, 넌 최고 잘한 기록이 몇몇이니 좀 더 노력해 봐.' 라는 말을 하려면 점수 체계가 필요한 건 당연한 이야기이죠.

 

뭐, 딱히 그런 이유가 아니더라도 게임에서 점수(Point)가 없는 경우는 드문 것 같아요.

플래피버드는 장애물 1개 = 1점이고, RIDER는 다이아를 먹으면 1점이었어요.

플래피버드에서는 장애물을 성공적으로 피한 횟수가 점수였죠.

그리고 제가 좋아했던 하이퍼캐주얼 게임인 RIDER에서는 게임 내 등장하는 다이아몬드를 획득한 개수가 점수였습니다.

...그렇다면, 제가 만들 TAP FLOAT에서는 뭐가 점수의 기준이어야 할까요?

제가 선정한 후보군은 아래와 같았습니다.

 

 

1. 플래피버드와 같이, 방해 요소를 피해낸 횟수를 점수로 하자.

2. RIDER와 같이, 점수 객체를 획득하는 걸로 하자.

3. 다 귀찮은데 플레이 시간을 기준으로 하자.

 

 

그래요...

미리 변명하자면, 여러분도 잘 아시다시피 저는 제가 만들 수 있는 수준대로 게임을 만들려는 사람이었죠.

그리고 저의 수준이란 것은 참으로 조야하기 그지없어서, 기껏해야 플레이 시간을 기준으로 점수를 매기는 정도밖에 할 줄을 모르는 수준이라 하겠습니다.

그래서 절대 귀찮은 건 아니고 3번으로 결정해버린 것이었죠.

 

ㅇㅇ 어쩔수 엄슴.

 

그리고.. 게임을 하다가 조니(플레이어)가 죽으면(=사라지면), 그 상태를 '게임 오버가 되었다.'라고 판단해서 앞으로 만들 게임 오버 화면을 띄워줄 친구가 필요하기도 해요.

 

저희야 조니가 게임 화면의 바깥으로 나가서 사라지든, 방해 요소에 부딪쳐서 사라지든 그렇게 사라지게 되면 '음 조니가 죽었군. 그렇다면 게임 오버야.' 라고 직관에 기대어 판단할 수는 있겠다만, 컴퓨터 입장에서는 그게 아니죠.

뭐가 게임 오버인지, 그래서 어떻게 할 건지. 하나하나 알려줘야만 하는 것입니다.

 

하나하나 알려주지 않으면 안되요!

 

요컨대 '점수'를 관리하고, 게임의 '종료 여부'를 판단해줄 수 있는 친구.

즉, GAME MANAGER가 필요하다는 것이죠.

 

그래서 저는 게임 오버 화면과 GAME MANAGER를 같이 만들려고 해요.

그전에, 게임 플레이 화면 상단으로 '점수'를 먼저 만들어서 표현해 볼까요?

 


 

UI. User Interface의 줄임말이죠. 사용자 인터페이스라는 의미이기도 합니다.

그걸 좀 더 이해하기 쉽게 말하자면 '컴퓨터와 사용자 사이의 대화수단'이라는 것이에요.

아! 당연히 전기톱 말고요.

전기톱은 훌륭한 대화수단이긴 합니다.

 

둠가이는 전기톱으로 대화를 한다지만, 컴퓨터와 사람은 키보드와 마우스로 대화를 하죠.

그렇다면, 게임을 만들 개발자는 키보드와 마우스를 사용해 게임과 플레이어가 나눠야 할 대화 내용들을 미리 마련해줘야 합니다.

 

제가 만들 TAP FLOAT에서 마련해 줄 대화 내용은 대략 이런 거였어요.

 

(게임 중일 때)

"지금 너 점수 n점이야."

 

(게임 종료 후)

"너 게임 오버야. 너의 점수는 n점이었어."

"너의 최고 점수는 n점이었어."

"게임 다시 하려면 이거 눌러."

 

다소 일방적인 대화이긴 하다만 필요한 내용은 다 있는 것 같아요.

그리고 우리의 Unity에서는 저렇게 게임과 플레이어가 대화를 나눌 화면을 UI라는 이름으로 쉽게 만들 수 있도록, 미리 마련해놨습니다.

UI 제작 도구들

Hierarchy에서 마우스 우클릭을 하면 나타나는 리스트 중, UI를 보면 유니티에서 제작 가능한 UI 오브젝트 도구들이 등장하게 됩니다.

종류가 상당히 많죠...? 저도 저것들이 다 뭔지는 잘 모릅니다. 헤헤.

다만, 지금 제가 써야 할 것은 잘 알고 있죠.

그 첫 번째가 바로 Panel. 즉, 판때기(?)...라고 할 수 있는 거에요.

 

이 패널 아닙니다.

제가 생각하고 있는 유니티의 패널이란, 화면의 각 구역(Layout)을 설정하는 용도입니다.

점수가 나오는 부분, 버튼이 모여있는 부분, 조작하는 부분, 정보를 표시하는 부분 등...

패널을 써서 구역을 구분해 놓은 뒤, 각 패널의 자식으로 필요한 내용들을 연결시켜 두는 것이죠.

요컨대 이런 겁니다.

원신의 플레이 화면입니다.

원신은 유니티로 제작된 게임이죠. 그래서 적절한 예시가 될 것 같아요.

저 화면을 기준으로 설명하자면...

 

좌상단 패널 : 미니맵 + 파티 및 맵 관련 기능 구역이고.

우상단 패널 : 기능 버튼 구역.

우하단 패널 : 전투 기능 버튼 구역.

중앙 하단 패널 : 타게팅된 적의 HP 표시 구역.

 

이렇게, 총 4개의 패널이 동작하고 있는 것으로 생각됩니다.

요컨데 게임의 플레이 환경이 바뀌어 해상도가 달라지더라도, 각 위치가 흐트러지지 않도록 하기 위해 구역을 설정하는 것.

그것이 진정한 패널의 효능이 아닐런지... 저는 그렇게 생각한다는 것이죠.

 

각설하고.

바로 패널을 생성시켜 봅시다.

Hierarchy 마우스 우클릭 - UI - Panel을 선택하여 패널을 생성시킨 뒤, 이름을 Point Panel이라고 정했어요. 점수가 표시될 영역이니까요.

그러면, 이렇게 Canvas 안에 자식으로 Point Panel이 생성된 것이 보일 것이고, 동시에 EventSystem이 함께 생성된 것을 확인할 수 있습니다.

Canvas안으로 패널이 생성되었습니다.

Canvas와 EventSystem은 UI를 만들면 자동으로 생성되는 것으로 알고 있어요.

그리고 모든 UI는 Canvas 안에 등록되어서 관리되게 됩니다.

 

저는 게임의 중앙 상단만 사용할 것이기에... 제가 원하는 크기를 이렇게 지정해봤어요.

원하는 만큼만 크기를 맞췄습니다.

그리고, 다양한 해상도에서도 흐트러짐 없이 저 위치에 붙어있을 수 있도록 기준점을 중앙 상단으로 맞춰주려고 해요.

Point Panel을 선택한 상태에서 Inspector - Rect Transform의 Anchor Presets을 설정합시다.

stretch를 클릭하면 저렇게 설정할 수 있어요.

게임 화면을 중심으로 각 어느 위치에 저 패널을 달라붙게 할 것인지를 지정하는 것입니다.

저는 Alt와 Shift를 누른 상태에서 중앙 상단을 선택하였어요.

Alt와 Shift를 동시에 누르면 모양이 변해요.

이제는 Point Panel안에 점수를 보여줄 Text 를 추가할 차례입니다.

UI - Legacy - Text를 선택했어요.

Point Panel에서 마우스 우클릭, UI - Legacy - Text 순서대로 선택합니다.

Text - TextMeshPro라는 것이 있긴 한데, 저는 저걸 어떻게 쓰는지, 그리고 저게 뭔지를 잘 몰라서...(ㅜㅠ) Legacy 안에 있는 Text를 쓰려고 합니다.

이름은 Point Text라고 정해줬어요.

Text가 추가된 모습입니다.

그런 뒤, Text의 기본 설정을 해 줍니다.

좌우 가운데 정렬 + 상하 가운데 정렬을 해 주고, Horizontal Overflow를 Overflow로, Vertical Overflow 또한 Overflow로 설정했어요.

Text 기본 설정입니다.

저걸 Overflow로 하는 것은 '내가 설정한 Text 박스의 크기를 벗어나는 글자여도 그냥 보여줘라.'라는 의미예요.

만일 Overflow가 아닌 Wrap로 설정되어 있을 경우에는, 글자가 Text 박스의 크기를 벗어나면 그냥 아무것도 표시되지 않아 버그처럼 보일 수 있습니다.

 

상황에 따라선 Wrap를 쓰는 경우도 있겠지만...

지금 저의 경우엔 점수로 보여줄 글자이니, 무조건 보여야만 할 거라고 생각되네요.

점수를 보여 줄 준비가 끝났습니다.

글자의 크기도 조절하고, 굵기도 설정해서 좀 더 눈에 잘 띄게 만들어 봤어요.

이제는 'New Text' 라는 글자 대신, 플레이 시간에 따라 점수가 표시되도록 만들어 보겠습니다.

 

 

<다음 편에 계속>

반응형

'도전! N잡러! > 도전! 게임 개발!' 카테고리의 다른 글

TAP FLOAT 개발 일기 #12  (109) 2023.10.04
TAP FLOAT 개발 일기 #11  (120) 2023.09.26
TAP FLOAT 개발 일기 #9  (82) 2023.09.23
TAP FLOAT 개발 일기 #8  (68) 2023.09.22
TAP FLOAT 개발 일기 #7  (76) 2023.09.20

댓글