[쿼리도 슈팅 #05] 유니티 턴제 전투 타격감 — "밋밋하다"를 애니메이션·이펙트·UI 역할 분담으로 푼 방법

"밋밋하다"는 플레이 피드백을 관찰 가능한 문제로 쪼갠 뒤, 애니메이션·이펙트·UI의 역할을 나눠 전투 연출을 다시 설계한 과정을 정리했어요.

들어가며

안녕하세요, 쿼리도 슈팅에서 PO(프로덕트 오너, 제품의 방향을 책임지는 역할)와 프로그래밍을 맡고 있는 정회륜이에요.
이번 글에서는 추상적인 플레이 피드백을 관찰 가능한 문제로 바꾸고, 다시 구현 가능한 개발 태스크와 완료 조건으로 쪼갠 과정을 풀어볼게요.

플레이 장면을 나눠서 살펴보니 문제는 하나가 아니었어요.

• 공격이 적중한 시점을 알아보기 어려웠다
• 적이 공격받았다는 반응이 충분하지 않았다
• 공격마다 연출의 강도 차이가 크지 않았다

이런 상황을 겪고 있다면 도움이 될 거예요.

• "재미없다", "밋밋하다" 같은 피드백을 어떻게 처리할지 고민 중이다
• 기획 피드백을 프로그래밍 작업으로 구체화해야 한다
• 전투 타격감과 게임 정보의 판독성을 함께 개선하려 한다
• 아트·기획·프로그래밍이 함께 수정해야 하는 기능을 관리한다
• 작업 완료 기준이 모호해 수정이 반복된다

 

상황과 맥락

쿼리도 슈팅은 캐릭터를 이동시켜 적을 공격하면서, 벽을 설치해 전장의 구조를 바꾸는 턴제 전략 게임이에요.

플레이어는 적의 다음 행동을 확인하고, 이동·공격뿐 아니라 벽 설치로 적의 접근 경로까지 바꿀 수 있죠.
한 번의 입력과 공격 결과가 다음 턴 판단에 영향을 주기 때문에, 플레이어가 현재 상황을 빠르게 이해할 수 있어야 해요.

그래서 전투에서는 공격이 적중하는 것만으로는 부족했어요.
플레이어가 이런 정보를 자연스럽게 받아들일 수 있어야 했거든요.
공격이 실제로 적중했는지, 어느 대상이 피해를 입었는지, 공격이 얼마나 강한지, 적이 죽었는지, 그리고 다음 행동을 시작해도 되는지.

정리하면 전투 연출은 화려함을 위한 장식이 아니라, 전투 결과를 전달하는 인터페이스이기도 했어요.

내부 플레이 테스트에서 "밋밋하다"는 피드백이 반복해서 나왔어요.
문제는 이 말만으로는 어떤 코드를 고쳐야 하는지 알 수 없다는 점이었죠.

"타격감을 높인다"는 하나의 기능이 아니에요.
애니메이션, 이펙트, 카메라, 사운드, UI, 입력 제어, 턴 진행 타이밍이 전부 얽혀 있거든요. 그래서 피드백 문장을 바로 구현하려 들지 않고, 먼저 플레이어가 어느 순간에 어떤 정보를 못 받고 있는지부터 분석했어요.

 

왜 이 방법을 골랐나

저희는 후보로 3가지 방법을 생각해봤어요.

방법 1. 전투 이펙트를 중심으로 개선

공격과 스킬에 크고 화려한 이펙트를 얹어 생동감을 높이는 방식이에요.
시각적 변화를 빠르게 만들 수 있고, 스크린샷이나 영상에서도 개선 전후가 확 보여요.

하지만 쿼리도 슈팅은 전투 중에 캐릭터·적·벽·타일·행동 정보를 함께 확인해야 해요.

이펙트가 과하면 전략 정보를 가릴 위험이 있었죠.
게다가 공격 주체의 동작과 피격 대상의 반응이 없으면, 이펙트가 전투 위에 따로 재생되는 별도 영상처럼 붕 떠 보여요.

방법 2. UI 안내를 중심으로 개선

선택 상태, 공격 결과, 스킬 범위와 피해 정보를 UI에 더 자세히 표시하는 방식이에요.
전투 정보를 명시적으로 전달할 수 있지만, 모든 행동 결과를 텍스트나 아이콘으로 설명하면 플레이어가 화면을 읽는 부담이 커져요.

캐릭터 상태는 캐릭터 움직임으로, 공격 위치는 이펙트로, 선택 가능한 행동은 UI로 전달하는 게 더 자연스럽다고 봤어요.

방법 3. 애니메이션·이펙트·UI/UX의 역할을 나눠 함께 개선

플레이어에게 전달할 정보를 기준으로 각 요소의 역할을 나누는 방식이에요.

• 캐릭터 애니메이션: 누가 어떤 행동과 상태 변화를 겪는지 전달
• 공격·스킬 이펙트: 행동이 어느 위치와 범위에 영향을 줬는지 전달
• UI/UX: 현재 상태와 선택 가능한 행동, 다음 조작 흐름을 전달

하나의 요소가 모든 정보를 떠안게 하지 않고, 각자 가장 잘 전달할 수 있는 정보를 맡겼어요.

이 방식을 고른 가장 큰 이유는, 쿼리도 슈팅의 핵심 플레이가 전투 연출 자체가 아니라 전투 상황을 이해하고 다음 행동을 판단하는 과정이기 때문이에요. 생동감을 더하는 것도 중요하지만, 그 연출이 플레이어의 판단을 방해하면 안 됐죠.

UI 디자인만 갈아끼우는 것으로도 부족했어요.

플레이어가 어떤 순서로 정보를 보고 행동을 고르는지 검토한 뒤 UI/UX 기획을 바꾸고, 바뀐 기획에 맞춰 실제 UI 디자인과 프로그램 동작을 같이 손봐야 했거든요.

그래서 원칙을 하나 세웠어요.
캐릭터의 행동은 애니메이션으로, 공격의 영향은 이펙트로, 현재 상태와 다음 선택은 UI로 전달한다.

---

실제로 적용한 방법

전투 전체를 한 번에 뜯어고치지 않고, 플레이어가 결과를 이해하기 어려웠던 장면부터 나눠서 확인했어요.

• 캐릭터가 전투 대기 상태에 있는 장면
• 캐릭터가 일반 공격을 실행하는 장면
• 적 또는 캐릭터가 피해를 입는 장면
• 적이 사망해 전장에서 제거되는 장면
• 스킬을 사용해 여러 대상에게 영향을 주는 장면
• 행동을 선택하거나 취소하는 장면
• 행동 실행 후 다음 선택으로 넘어가는 장면

각 장면에서는 같은 질문을 던졌어요.
어떤 캐릭터가 행동하는지 알 수 있는가, 행동이 시작된 걸 알 수 있는가, 공격이 어느 위치에 적용됐는가, 어느 대상이 피해를 입었는가, 피해만 입었는지 죽었는지 구분되는가, 지금 입력이 가능한 상태인가, 다음에 뭘 고를 수 있는가.

이 과정을 거치니 "전투가 밋밋하다"가 캐릭터 표현·전투 결과·조작 흐름 문제로 갈라졌어요.

캐릭터 표현 애니메이션 4종

캐릭터의 전투 상태를 명확히 보여주려고 SD 캐릭터 애니메이션을 기본·공격·피해·사망 넷으로 나눴어요.

기본 애니메이션

기본 애니메이션은 캐릭터가 전장에 존재하고 지금 행동 가능한 대상이라는 느낌을 줘요.
완전히 멈춘 이미지보다 작은 호흡이나 움직임이 있으면 전장이 살아 보이고, 배경 오브젝트와도 구분되고요.

다만 움직임이 너무 크면 선택 표시나 공격 예고를 읽는 데 방해가 돼서, 반복해서 봐도 피로하지 않은 선에서 조정했어요.

공격 애니메이션

공격 애니메이션은 공격이 시작되는 시점과 실제로 적용되는 시점을 잇는 역할이에요.
공격 자세를 재생하고 끝내는 게 아니라, 어느 프레임에서 공격 판정과 이펙트를 실행할지 함께 잡았어요.

public void PlayAttack()
{
    animator.SetTrigger(AttackTrigger);
}

public void OnAttackHitFrame()
{
    attackController.ApplyDamage();
    effectController.PlayAttackEffect();
}

피해 애니메이션

피해 애니메이션은 어느 대상이 공격받았는지 보여줘요.

이펙트만으로는 여러 캐릭터가 겹친 상황에서 실제 피격 대상을 놓칠 수 있거든요.
피해 입은 캐릭터가 짧게 반응하면 공격과 결과의 인과가 또렷해져요.

여기엔 조건도 붙었어요. 

• 피해를 입은 대상에게만 재생되는가
• 회피 또는 무효 처리된 공격에는 재생되지 않는가
• 연속 피해가 들어올 때 애니메이션이 정상적으로 전환되는가
• 사망한 캐릭터가 다시 피해 애니메이션으로 돌아가지 않는가

사망 애니메이션

사망 애니메이션은 캐릭터가 더는 전투에 참여하지 않는다는 사실을 전달해요.

즉시 사라지면 결과를 놓치고, 반대로 연출이 너무 길면 턴이 늘어져요.
그래서 사망이 확정된 뒤 애니메이션을 재생하고, 전장에서 제거되는 시점을 조절했어요.

public async UniTask PlayDeath()
{
    animator.SetTrigger(DeathTrigger);

    await WaitForDeathAnimation();

    DisableInteraction();
    ReturnOrDestroyObject();
}

공격·스킬 이펙트

애니메이션이 행동의 주체를 보여준다면, 이펙트는 행동이 영향을 준 위치와 범위를 보여줘야 했어요.
일반 공격과 스킬은 규칙상 다른 행동이라, 화면에서도 차이가 느껴지게 구성했고요.

이펙트는 2D 시각 요소를 담당하는 작업자와 협업해 만들고, Unity에 적용할 때 크기·위치·재생 시간·정렬 순서를 실제 공격 판정과 함께 확인했어요.

일반 공격 이펙트

일반 공격은 반복해서 쓰는 행동이라 짧고 명확해야 했어요.

실제 적중 위치를 중심으로 재생하고, 피격 대상을 지나치게 가리지 않고, 다음 판단을 방해하지 않게 빠르게 끝내고, 캐릭터 공격 애니메이션의 적중 시점과 맞물리게요.

스킬 이펙트

스킬 이펙트는 일반 공격보다 넓은 범위나 특수 효과를 가지니 영향 범위가 느껴져야 했어요.
그런데 스킬 이펙트가 화면을 가리면 스킬 이후의 전장 변화를 읽기 어려워지죠.

그래서 기준을 뒀어요.

• 스킬 범위와 시각적 범위가 크게 어긋나지 않을 것
• 실제 피해를 입은 대상이 구분될 것
• 일반 공격보다 강한 인상을 주되, 너무 오래 남지 않을 것
• 타일과 벽의 위치를 완전히 가리지 않을 것
• 여러 적이 피격돼도 대상별 반응을 확인할 수 있을 것

실행 시점을 하나의 흐름으로

애니메이션과 이펙트를 각각 더하는 것만으로는 부족했어요.
실행 시점이 어긋나면 문제가 생기거든요. 

• 캐릭터가 공격하기 전에 적이 피해를 입는다.
• 공격 동작은 끝났지만 이펙트가 뒤늦게 나타난다.
• 피해 애니메이션이 이펙트보다 먼저 실행된다.
• 적이 사망했는데 피해 애니메이션이 다시 재생된다.
• 연출이 끝나지 않았는데 다음 행동 입력이 가능해진다.

 

이걸 막으려고 전투 흐름을 이렇게 정리했어요.

1. 공격 또는 스킬 선택
2. 대상·실행 가능 여부 검증
3. 공격 애니메이션 시작
4. 공격 프레임에서 판정 실행
5. 공격·스킬 이펙트 재생
6. 대상의 피해 또는 사망 애니메이션 결정
7. 필요한 연출이 끝나면 다음 전투 상태로 이동
8. UI를 다음 입력 가능한 상태로 갱신

public async UniTask ExecuteAttack(AttackContext context)
{
    uiController.SetInputEnabled(false);

    await attackerAnimation.PlayUntilHitFrame();

    AttackResult result = damageSystem.Resolve(context);

    effectController.Play(result);
    targetAnimation.PlayResult(result);

    await WaitForRequiredFeedback(result);

    uiController.RefreshCombatState();
    uiController.SetInputEnabled(true);
}

---

적용 결과

Before

개선 전에는 핵심 전투 기능은 정상 동작했지만, 그 결과를 플레이어가 체감하는 과정이 부족했어요

• 캐릭터의 기본·공격·피해·사망 상태가 충분히 구분되지 않았다.
• 공격 주체와 피격 대상의 관계가 약하게 전달됐다.
• 일반 공격과 스킬의 시각적 차이가 크지 않았다.
• 적의 피해와 사망 여부를 UI 정보에 의존해 확인해야 했다.
• 현재 선택한 행동과 다음 조작 흐름이 명확하지 않은 순간이 있었다.
• 필요한 정보를 기존 화면에 추가하면서 UI가 복잡해질 가능성이 있었다.

After

애니메이션·이펙트·UI/UX를 함께 개선한 뒤에는 전투 정보가 여러 단계로 나뉘어 전달됐어요

• 기본 애니메이션을 통해 캐릭터가 전장에 살아 있는 느낌이 강화됐다.
• 공격 애니메이션으로 누가 행동하는지 명확해졌다.
• 피해 애니메이션으로 공격받은 대상을 빠르게 확인할 수 있게 됐다.
• 사망 애니메이션으로 전투에서 제거되는 대상을 자연스럽게 인식할 수 있게 됐다.
• 공격과 스킬 이펙트를 통해 행동의 위치와 영향 범위가 드러났다.
• UI/UX 기획 변경을 통해 현재 상태와 다음 행동 흐름을 파악하기 쉬워졌다.
• 연출과 UI가 같은 전투 상태를 기준으로 갱신되면서 입력 결과가 더 자연스럽게 연결됐다.

가장 큰 변화는 전투가 단순히 화려해진 게 아니라, 플레이어가 행동과 결과를 이해하는 과정이 명확해졌다는 점이에요.

트러블슈팅 / 주의사항

문제 1. 애니메이션은 넣었는데 데미지 적용 시점이 어긋남

공격 애니메이션을 넣고도 데미지가 애니메이션 시작과 동시에 적용되면, 캐릭터가 공격하기 전에 적이 맞은 것처럼 보여요.
반대로 애니메이션이 끝난 뒤 적용하면 조작 반응이 느리게 느껴지고요.

해결. 공격 애니메이션 안에서 실제 타격이 일어나는 프레임을 지정하고, 그 시점에 피해 판정과 이펙트를 함께 실행하도록 연결했어요. 애니메이션 이벤트를 쓸 땐 이벤트 이름과 연결 메서드를 명확히 관리해야 사고가 안 나요.

문제 2. 피해 애니메이션과 사망 애니메이션이 충돌함

한 번의 공격으로 적 체력이 0이 됐을 때 피해와 사망 애니메이션을 둘 다 요청하면 상태가 꼬여요.
피해 재생 직후 사망으로 넘어가거나, 사망이 끝난 뒤 다시 기본 상태로 돌아가는 문제가 생기죠.

해결. 피해 결과를 먼저 계산한 뒤, 생존 여부에 따라 결과 애니메이션을 하나만 고르도록 했어요.

마무리

이번 작업에서 확인한 건 하나예요.
전투 경험이 부족하다는 문제는 특정 기능 하나가 없어서 생기는 게 아니라는 것.

캐릭터 애니메이션이 없으면 누가 무슨 행동을 했는지 전하기 어렵고, 이펙트가 없으면 공격이 어디에 영향을 줬는지 알기 어렵고, UI/UX 흐름이 정리되지 않으면 결과를 확인해도 다음 행동을 자연스럽게 고르기 어려워요.

쿼리도 슈팅에서는 이 셋을 각각 더하는 데서 끝내지 않고, 하나의 흐름으로 연결하려고 했어요.