본문 바로가기
Develop Story/Game Engine

Unreal 4 - Puzzle game 개발 - 01 캐릭터와 카메라

by 늘상의 하루 2020. 10. 16.

neulsang-day.tistory.com/15

 

Unreal 4 - 블루프린트로 퍼즐 게임 만들기

이번에 이력서를 준비하면서 많은 회사들이 언리얼을 다루는 것을 알게 되었습니다. 문제는 제가 언리얼을 제대로 다뤄본 적이 없다는 사실입니다. 문제가 있으면 고쳐야죠. 바로 언리얼 공부��

neulsang-day.tistory.com

제가 언리얼 블루프린트로 짧은 시간동안 개발한 퍼즐 게임을 만드는 강좌를 쓰려고 합니다.

해당 게임에 필요한 블루 프린트만 구성하여 최대한 간결하게 쓰겠습니다.

- 오브젝트의 디테일 항목은 필요한 파트만 언급하겠습니다. -

 

우선 블루프린트는 쉽다고는 하는데 코딩 지식이 없으면 어려울 수 있습니다.

그리고 코딩하고는 작업 방식이 역순입니다.

 

코딩은 사과를 만들 때 사과를 정의하고 그 세부 내용을 집어넣지만

블루 프린트는 반대로 세부 내용을 집어넣고 그것을 사과라고 정의합니다.

의견차는 있을 수 있겠으나 제가 개인적으로 느낀 바는 그랬습니다.

 

오늘 이 장에서는 3가지를 구현할 겁니다.

 

1. 캐릭터의 이동

2. 폰 빙의(조종 캐릭터 변경)

3. 카메라 설정

 

 

먼저 언리얼을 시작하면 새 프로젝트를 만드실 수 있습니다.

블루프린트와 C++ 중에 맞는 개발환경을 고르시면 됩니다.

블루프린트 개발이기에 블루프린트를 선택합니다.

 

그 안에서도 여러 선택지가 있지만 지금은 Blank 깨끗한 프로젝트로 진행하겠습니다.

저장 위치와 프로젝트 이름을 바꿔주시면 됩니다.

- 이름은 나중에 바꿀 수 있습니다. -

 

언리얼의 기본 화면입니다.

시작을 하면 의자 두개와 테이블이 있는 씬이 생성될 수 있습니다만 신경쓰지 마시고

상단의 [파일-새 레벨]을 통해 새로운 레벨을 만들어주시면 됩니다.

- 콘텐츠 브라우저의 리소스들은 나중에 다 만드려고 하니 신경쓰지 마세요. -

- 개발 화면을 움직이는 방법은 게임이랑 비슷합니다. 화면에 우클릭을 누른 상태로 마우스와 WASD를 통해 조종 가능합니다. -

 

바로 캐릭터부터 만들겠습니다.

콘텐츠 브라우저의 빈 공간을 우클릭 하여 블루프린트 클래스를 클릭합니다.

여기서 여러 가지가 뜨는데 캐릭터를 선택하시면 됩니다.

그러면 파일이 하나 생성되는데 이것을 드래그 앤 드롭으로 필드에 배치를 하면 투명한 캡슐이 하나 만들어집니다.

 

네, 그 캡슐이 캐릭터입니다.

 

그럼 콘텐츠 브라우저에 생성된 블루프린트 파일을 더블 클릭해 주세요.

뷰포트는 해당 오브젝트가 어떻게 보이는지를 보여줍니다. 여기서 수정한 것들은 일괄 적용됩니다.

컴포넌트 인터페이스에 컴포넌트를 추가하는 식으로 그래픽을 씌울 수 있습니다.

인스펙터[디테일]은 캐릭터 블루프린트로 생성되었기에 해당하는 항목을 자동으로 생성해 줍니다.

 

바로 블루프린트를 사용하기 위해 컴포넌트에서 구체를 생성한 뒤 이벤트 그래프를 선택해 봅시다.

- 구체의 위치는 임의로 조정하시면 됩니다. -

- 컬라이더가 구체 밖으로 튀어나올 겁니다. 컴포넌트에서 CapsuleComponent를 선택한 뒤 우측 디테일에서 Shape 영역을 조절합시다. -

여기가 진짜 블루프린트입니다. 노드 형식으로 코드를 작성하기 때문에 코딩 개념을 모르면 매우 어렵습니다.

빈 화면을 우클릭을 하면 뭐가 많이 나오는데 초보자에게 과도한 정보는 오히려 독이 됩니다.

바로 이동하는 것 부터 만들겠습니다.

 

기본적으로 붉은색 노드 박스가 존재합니다. 붉은색 노드 박스는 프로그램 실행 이벤트입니다.

BeginPlay : 시작하자마자 1회 동작.

ActorBeginOverlap : 트리거 컬라이더에 진입시 1회 동작.

Tick : 매 초마다 동작.

 

그 전에 앞서 입력값을 어떻게 처리할 것인지 세팅을 하나 해야 합니다.

지금 블루프린트 창은 잠시 아래로 닫아 주시고 엔진 메인 화면으로 돌아갑시다.

상단의 [세팅-프로젝트 세팅-엔진-입력] 으로 들어가면 Bindings라는 항목이 있습니다.

여기서 Axis Mapping을 추가하여 LeftRight를 작성하고 키 할당을 AD를 주도록 합시다.

이것들은 좌우로 움직일 것이기 때문에 A는 1.0 D는 그 반대인 -1.0 값을 입력합시다.

-왜 1.0 이랑 -1.0 인지는 4분면을 가진 그래프를 생각해 보시면 쉽습니다. -

 

설정이 끝나면 컨트롤+S 키를 눌러 저장해 주시고

잠시 내려뒀던 블루프린트 창을 다시 띄워 줍시다.

이동 블루프린트가 완성된 노드 이미지를 올렸습니다.

빈 공간에 우클릭을 누르고 방금 설정 창에 입력한 축 값 LeftRight을 써 주시면 목록에 뜨는 것을 확인할 수 있습니다.

나머지 앞뒤로 갈 변수값도 똑같이 만들어 주시면 됩니다.

- 참고로 노드 뒷배경에 반투명한 흰색 박스는 최하단에 있는 코멘트 추가... 노드입니다. -

 

이건 입력을 판단하고 실행하는 노드이기에 이것만 있어서는 움직일 수 없습니다.

(붉은 색은 이벤트 노드로 프로그램 실행을 담당합니다.)

Add Movement Input 이라는 노드를 만들어 줍시다. 이 녀석이 캐릭터를 움직일 수 있게 도와주는 녀석입니다.

 

하얀 선은 실행 순서를 의미합니다. LeftRight에서 입력을 받은 다음 그것을 어떻게 실행할 것인지 Add Movement Input으로 전달해야 하기 때문에 이미지와 같이 선을 이어 주시면 됩니다.

 

초록 선은 숫자값을 전달합니다. 셋팅 항목에서 입력했던 (1.0,-1.0)과 같은 값들을 전달합니다.

A를 누르면 1이 전달되고 D를 누르면 -1이 전달됩니다.

 

Add Movement Input에서 World Direction 항목이 있습니다.

이건 입력값을 받으면 타겟을 해당 방향으로 이동시키는 일을 담당합니다.

타겟은 할당된 값이 없으면 블루프린트가 씌워진 오브젝트 Self를 할당합니다.

 

World Direction 항목에서 움직이고 싶은 방향으로 입력해 주시면 됩니다.

일반적으로 위 이미지와 같이 진행해 주시면 됩니다. 임의로 설정을 바꾸셔서 만져 보셔도 좋습니다.

그리고 모든 작업이 끝나면 상단의 컴파일 버튼컨트롤+S 버튼으로 저장을 해 주시기 바랍니다.

 

노드 작성에 문제가 있다면 컴파일 버튼 입력시 해당 문제점을 확인하여 안내해 줍니다.

그리고 문제가 없다고 나온 뒤 플레이 버튼일 눌러 보면...

- 플레이 버튼 옆에 빌드 버튼이 있습니다. 엔진이 라이팅을 다시 빌드해야 한다고 하면 눌러 주시면 됩니다. -

- 라이트맵을 굽는 버튼인데 쉽게 말해서 움직이지 않는 오브젝트의 그림자를 그려주기 위한 버튼입니다. -

이런 화면이 뜨면서 캐릭터는 움직이지 않고 카메라만 움직이는 것을 볼 수 있습니다.

조종할 액터 설정카메라 설정을 하지 않았기 때문에 정상입니다.

먼저 정지 버튼을 누르고(ESC를 눌러도 됩니다.) 조종할 액터 설정을 하겠습니다.

 

방금 필드에 배치했던 블루프린트 캐릭터를 선택하고 디테일 항목에서 Pawn을 찾습니다.

다른거 건드릴 필요 없이 Auto Possess Player 항목을 선택하고 Disabled0번으로 바꿔주시면 됩니다.

이제 플레이를 해 보면 1인칭으로 움직이는 것을 확인할 수 있습니다.

카메라를 조정하는 것 역시 심플합니다.

 

블루프린트의 뷰포트 항목에서 컴포넌트 인터페이스컴포넌트 추가를 누르고 Camera 입력 후 추가해 주시면 됩니다.

카메라 위치를 조정해서 컴파일 버튼을 누른 뒤 다시 엔진 화면으로 돌아가 플레이해 봅시다.

 

블루프린트로 작성한 기본적인 캐릭터 이동 완성입니다.

카메라는 원하시는 뷰로 바꿔 주시면 됩니다.

- 만드는 게임은 탑뷰 게임이니 탑뷰로 바꾸겠습니다.-


하지만 아직 조종하는 캐릭터를 바꾸는 방법카메라 설정이 남아 있습니다.

블루프린트를 설정하기에 앞서서 필드에 3개의 캐릭터가 필요하니 캐릭터를 선택하고

Alt를 눌러 위치를 바꾼 다음 3개로 복사해 줍시다.

 

다음으로 기본 화면의 상단 블루프린트 버튼을 눌러 레벨 블루프린트 열기를 선택합니다.

- 레벨 블루프린트는 따로 배치하지 않아도 해당 레벨에서만 작동하는 블루프린트입니다. -

 

완성본부터 들고 왔습니다.

아까 이야기했듯이 붉은색 노드는 이벤트 실행 노드입니다.

빈 공간에 우클릭을 한 뒤 [Input-키보드 이벤트]에서 찾거나 필요한 키 값을 입력하면 알아서 찾아 줍니다.

3개의 캐릭터를 조종할 계획이니 1~3번 까지 이벤트를 생성해 줍니다.

 

실행 이벤트를 만든 다음에는 무엇을 할 것인지를 정해 줍니다.

Possess 노드는 번역하면 소유를 의미합니다. 노드 안에 들어있는 값을 보면 타겟In Pawn이 있습니다.

소유를 하는데 어떤 부분을 소유할 것인지(타겟) 어떤 대상을 소유할 것인지(In Pawn)으로 해석하면 됩니다.

 

Get Player Controller 노드를 생성해 줍니다. 이름만 봐도 알 수 있듯이 플레이어의 제어권을 참조하는 노드입니다.

Return Value는 어렵게 생각할 것 없이 반환값, 즉 이걸 어디다 사용할 것인지 연결해주는 파츠입니다.

방금 만든 Possess 노드에 연결해 줍시다.

 

이제 마지막으로 어떤 놈들을 컨트롤할 것인지를 정하는 Possess의 In Pawn이 있습니다.

에셋 선택을 눌러봐도 나오는건 없고 우클릭을 하면 변수 승격이 있습니다.

- 물론 이 방법도 가능합니다. -

쉬운 방법으로는 잠시 블루프린트 창을 내리고 조종할 캐릭터들을 모두 선택해 주는겁니다.

다시 블루프린트로 돌아갑시다.

 

빈 공간에 우클릭을 하면 3개의 선택된 액터에 대한 레퍼런스 생성이라는 명령이 생깁니다.

선택해 주면 방금 선택한 3개의 캐릭터에 대한 캐릭터노드가 생성됩니다.

이제 적절한 위치에 배치해 주시고 PossessIn Pawn 항목에 연결해 주시면 됩니다.

 

이제 컴파일을 누르고 실행해 봅시다.

1~3 키를 누르고 조작하면 대상이 바뀌는 것을 확인할 수 있습니다.

- 실제로는 카메라가 캐릭터를 따라 바뀔 겁니다. 정상입니다. 이건 제가 카메라를 고정시켜서 그렇습니다. -

 

만약 움직이지 않는다면 [캐릭터-디테일-Auto Possess Player] 항목을 선택하고

Disabled 0번으로 바꿔주시면 됩니다.


위 움짤을 보고 뭔가 이상할 겁니다. 내꺼는 캐릭터 따라서 카메라가 움직이는데...

카메라를 필드에 배치해서 상단에 고정하신 분도 있을 겁니다.

하지만 실행을 해 보면 저절로 1인칭으로 바뀌어 버립니다.

- 저도 처음에 겁나 당황했습니다.-

 

언리얼에서는 카메라를 독립 배치하려면 역시 블루프린트를 작성해서 배치해 주어야 합니다.

그렇지 않으면 플레이어 캐릭터에 자동으로 카메라가 생성됩니다.

일단 캐릭터 블루프린트뷰포트 항목에서 카메라를 제거해 줍시다.

다음으로 필드에 카메라를 배치하는데 좌측의 검색창에서 Camera를 검색하거나 찾아 배치해 주시면 됩니다.

배치된 카메라를 선택하면 카메라 뷰를 확인할 수 있습니다.

 

블루프린트를 작업하기에 앞서 카메라에 Tag를 붙여줄 계획입니다.

Tag를 붙여두면 차후 블루프린트에서 카메라가 필요할때 Tag를 호출하는 것으로 사용할 수 있습니다.

[디테일-Actor]의 하단 확장 버튼을 눌러 주시고 Tags탭을 추가해서 Cam을 적어줍시다.

 

이제 다시 레벨 블루프린트를 들어가 봅시다. 상단의 [블루프린트-레벨 블루프린트 열기]를 누르면 됩니다.

저장도 한번 해 줍시다.

 

결과는 이렇습니다.

우선 카메라를 사용하려면 필드에 있는 카메라를 찾아야 합니다.

방금과 같이 캐릭터를 선택해서 자체적으로 끌어오는 방법도 있지만 Tag라는 기능을 써 보도록 하겠습니다.

-Tag는 오브젝트마다 이름표를 붙여 줄 수 있는데 해당 이름표를 호출해 사용할 수 있는 기능입니다.-

 

Get All Actor Tag 노드를 생성해 줍니다. 이제 방금 만들어 두었던 카메라의 태그네임을 써 주면 됩니다.

저는 Cam을 사용했으니 Cam 입력해 줍니다.

- 해당 노드를 Possess와 연결해 주는 것을 잊으면 안 됩니다. -

 

재미있게도 카메라를 다룰 수 있는 전용 노드가 있습니다. (언리얼의 블루프린트는 그런게 많이 있습니다.)

Get All Actor Tag의 진행방향 파츠를 끌어다가 빈 공간에 Set View Target With Blend 함수를 만들어 줍시다.

해당 노드의 항목에는 어떤 부분을 다룰 것인지(타겟) 어떤 대상을 조종할 것인지(new view target)로 해석하면 됩니다.

 

플레이어가 조작을 다룰 것이기 때문에 Get Player Controller 노드를 생성해서 타겟에 연결해 줍시다.

 

new view target 은 그냥 연결되지 않습니다. 해당 노드가 Tag 노드로부터 파생되었기 때문에 바로 받아주지 않습니다.

- 빈 공간에  Set View Target With Blend 쳐도 해당 노드는 나오지 않습니다. -

Tag는 단수의 오브젝트를 부르는게 아닌 태그를 달고 있는 복수의 모든 오브젝트를 다룰 수 있습니다.

1보다 높은 수는 곧 배열 Array 입니다. 

 

Get All Actor Tag의 Out Actor 항목을 끌어다가 [Utilities-Array-Get] 노드를 생성해 줍니다.

이제 해당 노드를 다시 new view target 에 연결해 주면 잘 작동하는 것을 볼 수 있습니다.

 

이제 플레이를 해 봅시다!

('ㅅ' )

1~3 버튼을 누르니까 탑뷰로 전환되는데 이유는 간단합니다.

앞서 이야기했듯이 붉은색 노드는 실행 노드입니다.

이건 게임을 시작하자마자 카메라 제어권을 가져오지 않았기에 발생하는 일입니다.

 

해결 방법은 간단합니다. 다시 레벨 블루프린트로 돌아가 봅시다.

시작하자마자 카메라 제어권을 획득해야 합니다.

BeginPlay 이벤트 노드를 생성합니다. 해당 노드는 게임이 시작될 때 한번 실행됩니다.

이제 해당 노드를 Get All Actor Tag로 연결해 줍시다.

- 이벤트 노드를 제외한 노드들은 복수 연결이 가능합니다. -

 

만약 Get All Actor Tag를 Possess와 연결하지 않았다면

1~3 을 눌렀을 때 다시 1인칭으로 돌아가는 일이 발생할 수 있습니다.

 

이제 게임을 실행해 본다면 아래 이미지와 동일하게 나오는 것을 확인할 수 있습니다.

 

 

다음은 발판과 블럭 이동을 구현할 겁니다.