게임 개발 일지 #10 - 게임 개선

매주 만나서 성과 공유하는 스터디를 하고 있는데 나의 경우에는 현재 만들고 있는 게임을 어느 정도 개발했는지 공유하고 있다. (다른 분은 게임이 아닌 앱 서비스를 개발하고 있다.) 매주 스마트 폰에 빌드를 해서 플레이하고 피드백을 받고 있는데 (피드백을 매우 잘 주신다. 다만 조금 매울 뿐..) 이번 일지부터는 개선한 내용도 같이 기록하려고 한다.

 

조이스틱 개선

플레이를 하다보면 손가락이 금방 피로해진다는 피드백이 있었다. 모바일 게임을 하다보면 조이스틱이 고정으로 있지 않고 터치한 곳을 기준으로 조이스틱이 따라오는데 내가 구현한 조이스틱은 한 위치에 고정되어 있어서 그런 것 같다. 터치한 위치로 조이스틱이 따라오도록 수정했다.

 

터치 영역 수정

아래와 같이 빈 공간에 터치가 되었을 때도 인식할 수 있도록 부모의 크기를 여유있게 설정했다. 자식 오브젝트의 경우 초기 위치가 왼쪽 아래에 오도록 수정했다.

Joystick 부모 크기 수정

Joystick 자식 오브젝트 위치 수정

스크립트 수정

PointerDown일 때 손가락 위치로 조이스틱(body)을 이동시키고 PointerUp일 때 조이스틱을 원래 위치로 되돌리는 코드를 추가했다.

private readonly Vector2 INITIAL_POSITION = Vector2.one * 240;
        
[SerializeField] private Transform body;

public void OnPointerUp(PointerEventData eventData) {
    body.position = INITIAL_POSITION;
    handle.SetActive(false);

    IsActive = false;
}

public void OnPointerDown(PointerEventData eventData) {
    body.position = eventData.position;
    IsActive = true;
    handle.SetActive(true);

    SetHandleAngle(eventData);
}

 

플레이어 공격 수정

몬스터를 공격하기 어렵다는 피드백을 받아서 공격 범위를 넓히기로 했다. (기존에는 범위가 좁아서 몬스터를 거의 정면으로 바라봐야 했다.. 범위를 조금 넓히고 나서는 공격하기 쉬워져서 좋다고 하셨다.) 

// 이전 코드: var halfExtents = new Vector3(1f, 0.5f, 1f);
// x 값을 2배 z 값을 1.5배 늘렸다.

var halfExtents = new Vector3(2f, 0.5f, 1.5f);

 

아이템 루팅 수정

아이템이 플레이어를 따라갈 때 궤적을 따라 효과를 주면 더 괜찮을 것 같아서 아이템에 Trail 오브젝트를 생성하고 Trail Renderer를 추가했다. 

 

Material을 하나 생성하여 아래와 같이 만들고 Trail Renderer의 Materials에 추가해주었다. 

 

맵, 카메라 수정

직사각형 모양이던 맵을 아래처럼 수정했다. 

 

맵이 45도 돌아간 모양이기 때문에 카메라의 Y Rotation을 45, X Rotation을 40으로 수정했다.

 

카메라의 Y Rotation이 45만큼 수정되었기 때문에 조이스틱으로 플레이어를 조작할때도 45도만큼 틀어져서 이동한다.

조이스틱을 오른쪽으로 움직여도 45도 기울어져서 이동한다.

Joystick Offset 값을 45만큼 더 돌려주었다. 

private readonly int ANGLE_OFFSET = 90; //45-> 90

...

public Vector2 Value {
    get {
        var angle = (handle.transform.localRotation.eulerAngles.z - ANGLE_OFFSET) % 360;
        joystickValue.x = Mathf.Sin(-angle * Mathf.Deg2Rad);
        joystickValue.y = Mathf.Cos(-angle * Mathf.Deg2Rad);

        return joystickValue;
    }
}

수정 후 조이스틱 방향으로 잘 이동한다.

 

Post-Processing

게임 화면이 좀 더 이쁘게(?) 보이도록 Post-Processing을 넣어주었다. 

 

Vignette

Vignette를 이용하여 화면의 가장자리를 어둡게 만들어 주었다. 

적용 전(왼쪽)과 적용 후(오른쪽)

Lift Gamma Gain 

색 보정을 위해 Lift, Gamma, Gain 효과를 넣어주었다. Game 화면을 보면서 적당히 조절해주었다.

적용 전(왼쪽)과 적용 후(오른쪽)

Bloom

Bloom 효과도 추가하여 아래와 같이 설정해주었다.

적용 전(왼쪽)과 적용 후(오른쪽)

적용 결과

Post-Processing이 없는 화면과 비교해보니 차이가 많이 난다. 

Post-Processing 적용 전(왼쪽) 적용 후(오른쪽)

 

사용 에셋

Character

POLYGON Modular Fantasy Hero Characters (Synty Studios)

POLYGON Fantasy Rivals (Synty Studios)

 

Animation

Oriental Sword AnimSet (wemakethegame)

DOTween (Demigiant)

 

VFX

Magic Arsenal (Magic Arsenal)

 

UI

GUI PRO Kit - Fantasy RPG (Layer Lab)

 

ETC

UniTask (neuecc - Yoshifumi Kawai)