캐릭터 카메라 이동방식

2020. 5. 31. 23:25·Study/Unreal Engine

드디어 2단계 강좌 마지막까지 도달했습니다. 이번 강좌에서는 지금까지 배운 내용들을 조합해 3인칭 시점에서 많이 사용되고 있는 두 가지 캐릭터 컨트롤 방식을 직접 구현하는 것으로 2단계 과정의 대미를 장식하려고 합니다. 

 

1. GTA 스타일로 조작하기 

 

처음은 GTA 스타일로 캐릭터를 조작하겠습니다. ( 물론 세밀함에 있어서는 차이가 많이 큽니다만 디테일은 생략합니다. )  사실 이 조작 방식은 저희가 사용한 흰색 마네킹 캐릭터와 동일합니다. 그러므로 흰색 마네킹에 있던 로직을 복사해 옮겨올 수 있겠지만 그러면 학습 효과가 전혀 없겠지요? 컨트롤 기능 하나 하나를 직접 만들어보겠습니다.  

 

GTA 컨트롤 스타일을 분석해보면 다음과 같습니다.  

 1. 마우스를 움직이면 캐릭터는 그대로 있고 카메라만 회전함.

 2. 앞으로 가는 키를 누르면 현재 카메라 구도의 정면 방향으로 캐릭터가 회전하면서 이동

 3. 오른쪽으로 가는 키를 누르면 현재 카메라 구도의 오른쪽으로 캐릭터가 회전하면서 이동

 

1번을 만족하기 위해서는 이전 시간에 설정되어 있던 Use Controller Rotation Yaw 옵션이 활성화되면 안됩니다. 캐릭터가 컨트롤러의 회전에 따라 함께 돌아가기 때문이죠. 그래서 먼저 이 옵션을 꺼줍시다. 

[그림] 컨트롤러의 회전과 액터 회전의 동기화 제거

 

마우스가 움직이면 폰이 회전하는 것이 아니라 카메라가 회전해야 합니다. 1인칭이면 카메라를 바로 돌리면되는데 우리는 3인칭이기 때문에 카메라는 두고, 카메라 회전을 담당하는 스프링암 컴포넌트를 사용하는 것이 좋습니다. 스프링 암 컴포넌트의 Use Pawn Control Rotation이라는 설정이 있습니다. 스프링암의 회전을 컨트롤러의 회전에 맞추겠다는 설정입니다. ( 카메라 컴포넌트에도 Use Pawn Control Rotation이라는 동일한 설정이 있습니다만, 이는 1인칭 시점 게임을 제작할 때 사용하는게 좋습니다. )

 

[그림] 스프링암의 Use Pawn Control Rotation 설정

 

이를 활성화하면 마우스를 드래그하면 캐릭터는 가만히 있고, 스프링암이 대신 회전되 캐릭터의 얼굴을 볼 수 있게됩니다. 

[그림] 마우스 회전으로 캐릭터 얼굴을 본 결과  

 

하지만 캐릭터가 회전하지 않으니, 방향키를 눌러도 앞뒤으로만 이동하고 다른 곳으로 움직일 수가 없습니다. 카메라는 돌아가지만 저희 액터는 전혀 회전을 하지 않기 때문이지요. 그래서 현재 액터의 시선 방향(GetActorForwardVector)이 아닌 카메라의 시선 방향으로 캐릭터가 움직이도록 로직을 변경합시다. 

카메라의 회전은 현재 컨트롤러의 회전과 동일하므로, 카메라의 시선은 컨트롤러의 회전의 Forward 방향 벡터를 구해오면 됩니다. 액터의 전진 방향인 GetActorForwardVector를 없애고 아래와 같이 추가합시다. 이 때 X축과 Y축 회전은 큰 의미가 없으므로, 핀분할 기능을 사용해 Z축 회전 Yaw의 값만 전달하여 다른 축으로의 불필요한 회전이 일어나는 것을 방지합시다. 

 

[그림] 카메라 시선 방향으로 이동하기

 

그런데 이렇게 구현한 후 플레이를 눌러보면 카메라의 시선 방향으로 캐릭터가 잘 이동하지만, 캐릭터는 회전하지 않는 문제가 발생합니다. 이동 기능이 더 부자연스럽고 이상해졌습니다.  

 

추가로 카메라 시선 방향으로도 캐릭터를 같이 회전을 시켜줘야 합니다. 점점 더 복잡해지고 있지요? 하지만 언리얼이 제공하는 캐릭터 무브먼트의 기능을 사용하면 됩니다.  캐릭터 무브먼트 컴포넌트의 Rotation 섹션으로 가서 Orient Rotation Movement 기능을 체크합시다. 그러면 별도의 스크립팅 없이도 캐릭터는 자연스럽게 움직이는 방향으로 지정한 각속도로 회전합니다. 360도가 너무 느리다면 설정된 기본 회전 속도를 조금 더 올려봅시다. 

[그림] 캐릭터 무브먼트의 이동 방향으로 회전 설정 메뉴

 

이제 플레이를 눌러서 확인해봅시다. 드디어 우리가 원하는 방향으로 잘 이동하게 되었습니다. 한 가지만 빼고 말이죠.

 

카메라 높이인데요, 초기에 Y축으로 높여 둔 회전이 컨트롤러의 회전 값과 동일하게 되면서 구도가 낮아졌습니다. 그래서 LookUp 입력 이벤트를 사용해 마우스로 카메라 지지대를 위, 아래로도 조절할 수 있도록 기능을 추가합시다. 

[그림] 카메라 구도를 위아래로 움직일 수 있도록 추가한 기능 

 

이제 우리의 캐릭터가 처음 등장한 흰색 마네킹과 조작이 동일하게 되었습니다. 부연 설명을 드리면 위에서 사용한 AddControllerYawInput 명령과 AddControllerPitchInput 명령은 언리얼 엔진이 잘 알아서 입력 값의 크기에 비례해 컨트롤러의 회전이 움직이도록 설계되어 있습니다. 마우스 감도에 따른 회전 속도를 변경하고 싶으면, Axis Value 값을 증폭하기 보다 지난번에 제작한 플레이어 컨트롤러의 설정을 바꾸면 보다 체계적으로 조절할 수 있게됩니다. 

지난 강의에서 제작한 플레이어 컨트롤러 BP_PlayerController를 열고 오른쪽 상단에 있는 Input Yaw Scale 값과 Input Pitch Scale 값을 입맛에 맛게 조절합시다. 조절이 완료되면 현재 작업하는 월드의 게임 모드를 BP_WarriorGameMode로 변경해놓아야 우리가 만든 플레이어 컨트롤러가 시작할 때 스폰되 플레이어에 빙의를 하게 되겠지요~

[그림] 회전 속도의 조절

GTA 스타일의 제작은 여기까지 하겠습니다. 

 

2. Diablo스타일로 조작하기 

 

두 번째로는 디아블로 스타일로 캐릭터를 조작해봅시다. 기존에 열심히 만든 GTA 방식으로 움직이는 캐릭터는 남겨두어야 겠지요? 이를 위해 콘텐츠 브라우저에서 BP_Warrior를 선택하고 Ctrl+W 키를 눌러서 복제한 다음 복제된 캐릭터의 이름을 BP_WarriorDiablo로 바꿉시다. 그리고 레벨에서 BP_Warrior를 제거하고 BP_WarriorDiablo를 대신 드래그해 배치한 다음, 동일하게 자동으로 빙의되도록 Auto Possess Player 값을 Player 0로 설정하고 다른 이름으로 레벨을 저장합시다. 

[그림] 변경된 기본 작업 설정

 

디아블로 스타일의 조작법은 아래와 같은 특징이 있습니다.

 - 카메라는 회전이 아예 없다. 

 - 카메라 시선 방향을 기준으로 캐릭터 이동의 전후 좌우 방향이 결정된다.  

여기에 카메라가 플레이어를 따라다니되 한 박자 늦게 따라다니도록 추가로 설정해보겠습니다. 

 

먼저 카메라가 회전이 아예 없어야 하므로 스프링암 컴포넌트로 가서 카메라 세팅에 있는 회전 설정을 모두 끕시다. 그리고 멀리서 아래로 내려다보는 구도에서 캐릭터가 작게 보이도록 Y축 회전을 -45도, 길이에 해당하는 Target Arm Length는 1200으로 꽤 멀리 설정합시다. 

[그림] 스프링암 컴포넌트의 설정

 

플레이를 눌러보면 아래와 같은 구도가 나오는 것을 확인할 수 있습니다.  

[그림] 최초 설정한 카메라 구도 

 

이제 위 아래, 좌우 입력에 따라 캐릭터가 회전하도록 조절합시다. 이를 위해 [프로젝트 세팅 > 입력]으로 가서 Axis 매핑에 LeftRight를 추가하고 A키와 D키를 아래 그림과 같이 설정합시다. 

[그림] LeftRight 입력의 설정

 

이제 캐릭터 이동을 위해 기존의 제작한 로직을 다 제거합시다. 이전 까지는 하나의 이벤트에 대응되는 액션이 정해졌는데, 이번 로직은 LeftRight와 UpDown의 두 입력을 고려해 캐릭터의 최종 회전 방향이 정해져야 합니다. 따라서 Tick 이벤트에서 축 값 구하기 노드를 사용해 두 입력 축 값을 조합하도록 로직을 구성합시다. 이러한 방식에서 가장 많이 사용하는 노드로 Make Rot from X라는 노드가 있습니다. 이 노드의 X핀을 분할하고 분할된 X에 UpDown을 Y에 LeftRight을 연결합시다. 최종 모습은 아래와 같이 됩니다.  

[그림] 두 축 값을 혼합한 회전의 생성

 

Make Rot from X 노드는 캐릭터의 Yaw 회전을 계산하는데 편리한 노드입니다. X와 Y 값을 토대로 Yaw 회전을 생성해줍니다. 참고로 이 노드에서 Yaw 회전만을 보장받기 위해서는 Z 핀의 값은 0이 되어야 합니다. 아래는 Make Rot from X 노드를 도식화한 그림입니다.

[그림] Make Rot from X 노드의 예시

 

이제 플레이 버튼을 눌러봅시다. ASDW키에 따라 캐릭터는 회전하지만 키보드에서 손을 떼는 순간 캐릭터는 자동으로 월드의 X 축을 향하게 되는 현상이 발생합니다. 역시 한번에 되는 일은 없습니다. 

 

이는 입력이 없는 경우에도 로직이 실행되다보니 기본 회전 값( 월드의 X축을 바라보는 회전)이 캐릭터에 설정되기 때문입니다. 이를 보완하기 위해 입력이 있는 경우에만 회전하도록 != ( Not Equal ) 노드를 사용해 0이 아닌지를 비교하고, OR 노드를 사용해 두 축 값을 모두 검사하는 로직을 추가해줍시다.  OR 연산은 둘 중 하나라도 참이면 결과가 참으로 나오는 연산입니다. 그래서 아래 그림의 로직은 LeftRight 나 UpDown 둘 중 하나라도 0이 아닌 경우라면, 그 뒤에 연결된 로직이 수행되는 흐름을 가지게 됩니다. 

 

 

[그림] 입력이 들어왔는지 조건문을 추가한 결과 

 

이제 키 입력이 들어오지 않으면 캐릭터는 마지막에 회전된 방향에서 멈춰있게 됩니다. 이제 AddMovementInput 노드를 플로우 마지막에 추가해 입력이 들어오면 캐릭터가 보는 방향으로 이동하도록 기능을 추가합시다. 이미 목표 방향으로 캐릭터가 회전한 상태니 GetActorForwardVector를 사용해 연결하면 쉽게 구현이 가능합니다.. 아래는 이를 구현한 로직입니다. 

[그림] 캐릭터 이동 기능의 추가 

 

이제 캐릭터가 이동을 시작했으므로, 이전에 GTA 스타일을 설정하기 위해 캐릭터 무브먼트 컴포넌트에서 체크한 Orient Rotation to Movement 값은 이제 체크를 해제합시다. 

[그림] Orient Rotation to Movement 기능의 해제

 

이제 아래 그림처럼 완벽하지 않지만 디아블로 스타일로 맵을 돌아다닐 수 있게 되었습니다.  

[그림] 디아블로 스타일의 컨트롤 1차 구현 결과

 

이제 보다 완벽한 설정을 위해 카메라 관련해서 몇 가지 기능을 더 추가, 보완해봅시다. 현재 스프링암이 제공하는 충돌 처리 기능으로 인해 목표물과 스프링암 사이에 장애물이 있으면 자동으로 스프링 암이 카메라를 충돌된 물체 앞으로 당겨줍니다. 디아블로에는 카메라 당기는 기능이 없기 때문에 우리도 이 기능을 꺼줍시다. 그리고 카메라가 캐릭터를 한 단계 늦게 쫓아가도록 카메라 위치 이동 랙(Lag)을 추가로 걸어줍시다.  이는 스프링암 컴포넌트에서 모두 설정할 수 있는 기능입니다. 아래 그림을 참고해서 스프링암 옵션을 조정합시다. 

 

 

[그림] 스프링암의 충돌 테스트 해제와 이동 랙의 추가

 

아래는 결과 화면입니다.

[그림] 스프링암 부가 기능들을 실행한 결과. 더 이상 충돌처리가 발생되지 않는다. 

 

카메라 외에도 추가적으로 고민할 부분은 입력이 아무래도 키보드다보니 캐릭터의 회전이 45도 단위로 확확 꺾인다는 점입니다. 캐릭터가 회전할 목표 값으로 부드럽게 회전하도록 구현해봅시다. 이를 위해서 다시 컨트롤러의 회전을 사용하도록 기능을 부활시킵시다. 

입력을 받으면 SetActorRotation 명령을 사용해 액터를 바로 목표로 하는 값으로 회전시켰는데, 회전시키지 말고 컨트롤러의 회전 값으로 일단 저장하도록 로직을 변경합시다. GetController 명령을 사용하여 컨트롤러를 가져온 후 여기서 SetControlRotation를 검색해 명령을 호출합시다. 그리고 Make Rot from X 노드의 결과에 연결하면 액터는 회전하지 않고 일단 컨트롤러의 회전에 목표 회전 값을 저장해두게 됩니다. 

[그림] 컨트롤러의 회전에 회전의 목표 값을 저장한 로직. 

 

이제 다시 캐릭터 무브먼트 컴포넌트의 회전 속성으로 가봅시다. 아까 해제한 Orient 설정 바로 위에 Use Controller Desired Location 이라는 설정이 있는데 이를 체크하면 캐릭터가 컨트롤러의 회전에 설정되어 있는 값을 목표로 바로 위 Rotation Rate에 설정된 각속도로 서서히 회전하게 됩니다. 

[그림] Use Controller Desired Location 명령

 

지금까지 GTA와 디아블로 스타일, 두 가지 방식으로 캐릭터를 조작하는 방법에 대해서 살펴보았습니다. 따라해 보셨다면 상용 게임에 비해 디테일들은 다소 떨어지긴 하지만, 그래도 나름 괜찮은 결과물이 나오는 것을 볼 수 있을텐데요 앞으로 진행하면서 하나씩 업그레이드 해보시기 바랍니다. 

 

지금까지 Part2 강좌를 마칩니다. 중요한 부분만 추려서 아래에 영상으로 정리해보았습니다. 

 

[출처] [2-10] GTA와 디아블로 방식으로 캐릭터 조작하기 |작성자 이득우

 

'Study > Unreal Engine' 카테고리의 다른 글

Making a Volumetric Lighting  (0) 2020.12.30
안드로이드 패키징시 more than one device/emulator 오류  (0) 2020.08.09
안드로이드 패키징 오류 중  (0) 2020.08.07
언리얼엔진에서 협업시 관리해야 하는 디렉토리에 관해서  (0) 2020.08.02
PlayerController와 Pawn중 어떤곳에 코딩해야 할지 모를때  (0) 2020.07.19
'Study/Unreal Engine' 카테고리의 다른 글
  • 안드로이드 패키징시 more than one device/emulator 오류
  • 안드로이드 패키징 오류 중
  • 언리얼엔진에서 협업시 관리해야 하는 디렉토리에 관해서
  • PlayerController와 Pawn중 어떤곳에 코딩해야 할지 모를때
_WooHyun_
_WooHyun_
  • _WooHyun_
    Nerd
    _WooHyun_
  • 전체
    오늘
    어제
    • 분류 전체보기 (79)
      • Study (60)
        • Algorithm (24)
        • Unreal Engine (19)
        • C++ (1)
        • Maya (1)
        • GoLang (3)
        • Mysql (3)
        • Linux (7)
        • Server (2)
      • Projects (0)
        • Unreal Engine (0)
        • Server (0)
      • 개발일지 (8)
        • Unreal Engine (7)
        • Art (1)
        • Server (0)
      • 미래 (5)
      • 개발아이디어 (0)
      • 잡지식 (2)
  • 블로그 메뉴

    • 홈
    • 방명록
    • 글쓰기
    • 블로그설정
  • 링크

    • GitHub
  • 공지사항

  • 인기 글

  • 태그

  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
_WooHyun_
캐릭터 카메라 이동방식
상단으로

티스토리툴바