5부: 동전과 점수 추가하기 | hyperPad Documentation

Loading...

Logo
완벽한 가이드 - 플랫폼 게임 만들기

5부: 동전과 점수 추가하기

Last updated September 19, 2015

소개

4부 가 완료되면, 이제 레벨과 뛰고 점프할 수 있는 플레이어 캐릭터를 보유하고 있게 됩니다.

이제 플레이어에게 목적을 부여해야 합니다. 튜토리얼의 이 부분에서는 수집 가능한 동전과 이를 추적할 점수를 추가할 것입니다.

블록 안에 숨겨진 동전은 마리오의 가장 상징적인 특징 중 하나입니다. 이 튜토리얼은 해당 기능을 만들면서 시작하겠습니다.

벽돌에 동전 숨기기

벽돌 치기

첫 번째 벽돌을 만들 때, 필요한 만큼의 동전을 보관할 수 있도록 빠르게 수정할 수 있도록 만들 것입니다. 벽돌이 완성되면, 이를 복제하여 원하는 위치에 배치할 수 있습니다.

이 튜토리얼은 4부를 기반으로 하며, 허브에서 4부 프로젝트를 분기했다고 가정합니다.

먼저, 동전을 담을 벽돌 중 하나를 선택합니다. 객체 속성에서 "행동" 버튼을 눌러 행동 편집기를 엽니다.

객체 카테고리에서 충돌됨(Collided) 행동을 추가합니다. 충돌됨(Collided) 행동은 지정된 두 객체가 서로 접촉할 때마다 이벤트를 발생시킵니다.

추가한 충돌됨 행동을 눌러 그 속성을 봅니다. 선택 가능한 객체를 위한 2개의 상자가 있으며 (각각 객체 A, 객체 B 로 지칭됨) 첫 번째 상자( 객체 A )는 당신이 적용하는 행동을 가진 객체로 자동 선택됩니다. 이를 변경하고 싶으면 눌러서 수정할 수 있지만, 우리는 그대로 두겠습니다.

빈 상자는 두 번째 객체( 객체 B )를 위한 것이며, 충돌됨 행동이 검사할 객체입니다. 빈 상자를 눌러서 가이드를 4부에 추가한 플레이어 캐릭터를 선택합니다.

객체를 선택한 후, 객체 B 의 충돌 이벤트를 발생시키는 부분을 변경할 수 있습니다. 모든 토글을 꺼주고, "윗면(On Top)" 옵션만 켜줍니다. 이제 캐릭터의 머리가 벽돌에 닿을 때만 충돌 행동이 작동합니다.

이제 벽돌이 플레이어의 머리를 감지했으니, 벽돌이 위아래로 튕기도록 만들어 보겠습니다. 이를 위해 이동하기(Move By) 행동을 사용하여 위로 이동한 다음 다시 아래로 이동하게 합니다.

변환(Transform) 카테고리에서 이동하기(Move By) 행동을 추가하고 앞서 추가한 충돌됨 행동에 연결합니다.

이동하기(Move By) 행동을 클릭하여 속성을 봅니다. 플레이어가 벽돌에 닿을 때 벽돌을 올리기 원하므로, Y 값 을 변경합니다. 우리는 벽돌에 부드러운 튕김 효과를 주기 위해 소수의 값을 설정합니다. 나는 0.20 미터를 사용했습니다.

또한 **지속 시간(Duration)**을 변경해야 합니다. 지속 시간은 이동이 완료되는 시간을 의미합니다. 기본적으로 1초로 설정되어 있으나, 이는 벽돌이 1초에 0.2미터 이동한다는 의미입니다. 우리에게는 너무 느립니다. 따라서 지속 시간을 0.10 초로 변경합니다.

참고: 지속 시간을 0으로 설정하면 객체가 새로운 위치로 즉시 이동합니다. 부드럽게 애니메이션되진 않습니다. 또한 "선형(Linear)"이라는 텍스트가 있는 상자가 보입니다. 이는 이동에 적용되는 모션 트윈 효과입니다. 행위에 지속 시간이 있으면, 이 효과에 따라 이동하게 됩니다.

이제 벽돌이 위로 튕긴 후 다시 뒷쪽으로 떨어지게 하기 위해 또 다른 이동하기(Move By) 행동을 추가하고 이전 것에 연결합니다.

다시 한번 속성을 변경합니다. 이번에는 벽돌이 아래로 돌아가게 하고자 하므로, Y 값 을 음수로 변경합니다. 벽돌이 원래 위치로 돌아가도록 -0.20 미터로 이동하게 설정합니다. 지속 시간은 0.10 초로 변경해야 합니다.

지금까지 플레이 버튼을 누르면 캐릭터가 아래에서 벽돌을 치면 벽돌이 위아래로 튕기는 것을 볼 수 있습니다. 하지만 해결해야 할 몇 가지 문제가 있습니다.

  1. 로직에 작은 버그가 있습니다. 플레이어가 상자를 원래 위치로 돌아가게 하지 않고 매우 빠르게 점프하면 계속해서 위로 올라갑니다.

  2. 벽돌이 영원히 튕깁니다. 동전을 몇 개만 원하고 그 후 멈추고 싶을 때는 어떻게 하죠?

  3. 아직 동전을 주지 않습니다.

먼저 문제 1을 해결해보겠습니다. 사실 이는 간단한 버그로 수정을 위한 조치를 취할 수 있습니다. 플레이어가 충돌했을 때 즉시 충돌 행동을 끄고, 이동이 완료되면 다시 켜면 됩니다.

이렇게 하려면, 사용자 정의(Custom) 카테고리로 전환하고 **행동 끄기(Behavior Off)**를 추가한 후 충돌됨 행동에 연결합니다.

다음으로, 행동 끄기(Behavior Off) 속성에서 "행동 선택(Select Behavior)"이라는 텍스트가 있는 빈 상자를 누릅니다. 목록에서 올바른 충돌됨 행동을 찾아 선택합니다. 목록은 모든 객체에서 모든 행동을 보여주며, 객체 이름에 따라 정렬됩니다.

이제 튕김 완료 후 충돌 행동을 다시 켜야 합니다. 이를 위해, 사용자 정의(Custom) 카테고리에서 **행동 켜기(Behavior On)**을 추가하고 두 번째 이동하기(Move By) 행동에 연결합니다. 행동 속성에서 충돌된 행동을 다시 켜도록 선택합니다.

문제 2를 해결하기 위해 각 벽돌이 보유할 동전 수를 설정하기 위해 박스 컨테이너를 사용할 것입니다. 이렇게 하면 특정 벽돌이 많거나 적은 동전을 가질 수 있는지 쉽게 변경할 수 있습니다.

처음에 사용자 정의(Custom) 카테고리에서 박스 컨테이너를 추가합니다. 이 객체는 다른 객체와 연결되지 않으므로 화면 어디에든 추가할 수 있습니다. 그리고 이 박스 컨테이너의 이름을 "동전(Coins)"으로 바꾸면 나중에 찾기 쉽게 됩니다(행동의 이름 변경 방법은 4부에서 확인하세요).

동전 박스 컨테이너 의 행동 속성에서 **기본 값(Default Value)**을 3으로 설정합니다. 이는 벽돌이 보유할 동전의 수가 됩니다.

다음으로 논리(Logic) 카테고리에서 값 추가하기(Add Values) 행동을 추가하고 앞서 추가한 두 번째 **이동하기(Move By)**에 연결합니다. 이 값 추가하기(Add Values) 행동은 플레이어가 벽돌을 부술 때마다 이를 추적하기 위해 사용할 것입니다.

이제 값 추가하기(Add Values) 행동이 연결되면 이를 클릭하여 행동 속성을 봅니다. 속성에는 2개의 입력 필드가 있으며, 값 추가하기(Add Values) 행동은 입력된 값의 합계를 출력합니다.

우리의 경우, 플레이어가 벽돌을 부술 때마다 추적하기 위해, 상단 필드에 1을 입력하고 하단 필드에는 값 추가하기(Add Values) 행동의 출력을 다시 두 번째 입력 필드로 설정합니다.

이 동작은 행동이 실행될 때마다 값을 증가시킵니다. 첫 번째 실행 시, 값은 1+0 이 될 것이며 이전에 저장된 값이 없으므로, 두 번째 실행 시 1+1 로 계산됩니다.

다음으로, 추가된 값의 합이 이전에 추가한 동전(Coins) 박스 컨테이너의 값과 같은지 검사해야 합니다.

이를 위해, 논리(Logic) 카테고리에서 IF 행동을 추가하고 이전 단계의 **값 추가하기(Add Values)**에 연결합니다.

IF를 연결한 후, 이를 클릭하여 행동 속성을 봅니다. IF 행동은 특정 조건(두 개의 입력 필드를 기반으로 및 선택된 조건)이 충족되는지 검사합니다.

이 경우 우리는 값 추가하기(Add Values) 행동의 합을 첫 번째 필드에 출력하고, 박스 컨테이너의 값을 두 번째 필드로 출력합니다.

이 값을 입력함으로써 충전할 다음 행동은 값 추가하기(Add Values)의 합이 동전 박스 컨테이너의 값과 같은 경우에만 수행됩니다.

그 후, 충돌된 행동을 끄고 플레이어에게 더 이상 동전이 남지 않았음을 표시하기 위해 그래픽을 변경해야 합니다. 이를 위해, 사용자 정의(Custom) 카테고리에서 새로운 행동 끄기(Behavior Off) 행동을 추가하고 IF에 연결합니다. 이전과 마찬가지로, 끌 행동을 끌어옵니다.

더 이상 동전이 남지 않음을 보여주기 위해, 변환(Transform) 카테고리에서 그래픽 변경하기(Change Graphic) 행동을 추가하고 IF에 연결합니다.

연결한 후 행위 속성에서 새로운 그래픽을 선택하세요. 행위 속성의 두 번째 상자를 클릭한 후, 새 그래픽을 선택합니다.

이제 플레이 버튼을 누르면 벽돌을 3번 충돌시킬 수 있으며, 그 후 벽돌은 더 이상 동전을 주지 않게 됩니다.

점수 얻기

UI 설정하기

다음 남은 것은 실제 점수를 얻고, 벽돌을 칠 때 동전을 수집하는 것입니다!

가장 먼저 할 일은 화면 구석에 점수를 보여 줄 카운터를 추가하는 것입니다.

따라서 행동 편집기에서 뒤로 가서 메인 편집기로 돌아갑니다. 그런 다음 화면 오른쪽의 3개의 점을 눌러 레이어(Layers) 막대를 불러옵니다 (또는 화면 가장자리에서 스와이프합니다).

전역 UI(Global UI) 레이어를 선택합니다. UI 레이어는 씬의 다른 레이어 위에서 존재하며 일반적으로 버튼, 조이스틱 및 레이블을 위해 사용됩니다. 이들은 화면의 동일한 위치에 고정되어 있으며, 씬의 나머지 콘텐츠와 함께 이동하는 것처럼 보입니다.

참고: 전역 UI 레이어에 배치된 객체는 프로젝트 내 모든 씬에서 존재합니다. 특정 씬에만 존재하도록 하려면 씬 UI 레이어를 사용하세요.

전역 UI 레이어가 선택된 상태에서 특수 객체(Special Objects) 비커 아이콘을 도킹하거나 씬으로 드래그하여 추가합니다.

팝업에서 **레이블(Label)**을 선택하면 씬에 레이블이 배치됩니다.

새로 추가된 레이블을 클릭하여 객체 속성을 엽니다. 레이블 속성에서 텍스트 색상, 글꼴, 표시할 텍스트 등을 변경할 수 있습니다.

큰 텍스트 상자를 클릭하여 "포인트(Points):"로 변경합니다.

다음으로, "정렬(Alignment)"을 눌러 정렬 속성을 확장합니다. **너비(Width)**를 110 으로, **높이(Height)**를 64 로 설정합니다.

참고: 이 값을 0으로 설정하면 텍스트 영역이 제거되고 텍스트가 가로로 무한히 성장할 수 있게 됩니다.

레이블 속성이 모두 설정되면 이동/변환(Move/Transform) 도구를 사용하여 새 레이블을 화면의 구석에 배치하여 플레이어의 시야를 방해하지 않도록 합니다.

레이블 위치가 설정되면 씬에 또 다른 레이블을 추가합니다. 이번에는 이 레이블을 캐릭터의 포인트를 표시하는 데 사용할 것입니다. 이번에는 텍스트를 0 으로 설정합니다. 플레이어가 처음에는 포인트가 0이므로 여기서 지정된 너비와 높이를 설정합니다. 너비는 500pt, 높이는 64pt 로 설정합니다. 이는 텍스트가 표시될 특정 영역을 제공합니다. 이 영역에 맞지 않게 너무 많은 텍스트가 있으면 잘리게 됩니다.

또한, 수평 정렬을 **왼쪽 정렬(Flush Left)**로 설정합니다.

레이블 속성이 완료되면, "포인트(Points)" 제목 옆에 배치합니다.

점수 얻기

이제 동전을 얻을 때마다 점수를 증가시켜야 합니다. 주 레이어로 돌아가 동전이 있는 벽돌의 행동으로 돌아가 필요한 행동을 추가합니다.

UI 카테고리에서 점수에 추가하기(Add To Score) 행동을 드래그하여 이전 가이드에서 두 번째 이동하기(Move By) 행동에 연결합니다.

다음으로 점수에 추가하기(Add To Score) 행동을 클릭하여 무한 점수(Infinite Score) 토글을 켭니다. 이 토글이 꺼져 있으면, 다음 행동은 지정된 점수에 도달했을 때 트리거됩니다. 또한 0 레이블이 올바른 객체로 선택되었는지 확인합니다. 점수에 추가하기(Add To Score) 행동은 씬 내 임의의 레이블을 자동으로 선택합니다.

이제 플레이 버튼을 누르면 플레이어가 벽돌을 칠 때마다 1점을 얻습니다.

이제, 이 벽돌을 복제하고(3부에서 배운 방식으로) 레벨 전역에 배치할 수 있습니다.

개별 동전

첫 번째 동전

때때로 벽돌 안에 숨기지 않고 레벨 곳곳에 동전을 추가하고 싶을 수 있습니다. 이것은 비교적 간단하며, 지금 이에 대해 논의해 보겠습니다.

먼저, 동전 그래픽을 씬에 추가하고, 클릭하여 객체 속성을 봅니다.

객체 속성 하단에서 물리(Physics) 탭이 선택되어 있는지 확인합니다.

물리 탭에서 동전을 통과 가능하게 설정합니다. 이를 수행하면 플레이어가 동전과 상관없이 그대로 달려갈 수 있습니다.

다음으로, 동전의 **충돌 경계(Collision Boundaries)**를 조정합니다. 충돌 경계는 객체의 물리적 형상을 정의합니다. 충돌 경계는 객체의 시각적 모습과 다를 수 있습니다. 충돌 경계를 조정하려면 충돌 아이콘을 클릭합니다.

충돌 편집기에서 도구 팔레트를 사용하여 고유한 충돌 형상을 수정하고 만들 수 있습니다.

이번 가이드에서는 원(Circle) 옵션을 선택하여 원형 충돌 경계를 구현합니다.

그후 초록색 점을 끌어 원형 충돌 경계를 조정하여 동전과 동일한 크기로 설정합니다. 참고로, 충돌 경계가 객체보다 크면, 플레이어는 그래픽의 중앙에 접근하기도 전에 객체와 상호작용할 수 있습니다.

충돌 경계를 만드는 작업이 완료되면 도구 팔레트의 체크 표시 아이콘을 클릭하여 새로운 형상을 수락하고 저장합니다.

다시 동전을 클릭하여 객체 속성을 봅니다. 이번엔 동전을 위해 행동 편집기를 엽니다.

객체 카테고리에서 충돌됨(Collided) 행동을 추가합니다. 이전과 마찬가지로 충돌됨 행동 속성을 열어 녹색 우주인 플레이어를 객체 B 로 선택합니다.

다음으로 UI 카테고리에서 점수에 추가하기(Add to Score) 행동을 드래그하여 충돌됨 행동에 연결합니다. 또 다시 행동 속성에서 무한 점수(Infinite Score) 옵션을 켜고, 올바른 점수 레이블이 선택되었는지 확인합니다.

마지막으로, 객체(Object) 카테고리에서 객체 파괴(Destroy Object) 행동을 추가하고 충돌 행동에 연결합니다. 이렇게 하면 플레이어가 동전과 충돌할 때 동전이 완전히 사라집니다.

플레이 버튼을 누르면 이제 동전과 충돌하여 사라지게 할 수 있습니다.

그게 다입니다! 이제 당신의 플랫폼 게임에 수집 가능한 동전이 추가되었습니다. 이 시점에서 해야 할 일은 동전을 복제하여 레벨 전역에 배치하는 것입니다. 동전을 배치할 때 창의력을 발휘하십시오!

파트 5의 완성된 버전을 허브에서 다운로드하여 모든 것을 확인할 수 있습니다.

파트 6에서는 적을 도입하여 게임에 약간의 난이도를 추가하기 시작할 것입니다.