← 블로그로

플로팅 데미지 숫자: 핸드오프 승인과 엔진 구현

팝업이 흐려지거나, 글리프가 빠지거나, 정렬이 틀리거나, 끊길 때의 실패 기준; TMP vs 비트맵 숫자 선택, 풀과 Canvas 순서, Unity UGUI 승인 단계, 디자인 숫자 아트 연결법.

게시일
  • game-ui-design
  • game-dev-ai
  • ui-to-engine
  • bitmap-font
  • unity
  • godot
  • cocos
  • vberai
  • 2026
플로팅 데미지 숫자: 핸드오프 승인과 엔진 구현

한 초에 열 번의 타격이 들어올 때, 플로팅 텍스트 문제는 “폰트를 더 크게” 하는 것으로 거의 해결되지 않는다: 에디터에서는 선명한데 기기에서는 흐릿함; 크리티컬 색상은 작동하지만 “K”나 마이너스가 빠져 있음; 숫자가 HUD 버튼 위에 앉아 탭을 가로챔; 또는 Instantiate가 GC 스파이크를 일으킴. 팝업은 고빈도, 단명 UI다—정적 HUD와 별도로 승인하라.

아래는 Unity UGUI / TextMeshPro(RectTransform, Canvas, sortingOrder)에 초점을 맞춘다. Godot: Label + Theme / 비트맵; Cocos: Label + 비트맵 폰트 + 풀—기준과 단계 순서는 동일하다. 정적 HUD 셸: 엔진 + MCP 체크리스트. 출시 전 항목 3(“흐릿한 아트 / 데미지 숫자”)—Release 기기에서 재테스트하라.

실패 기준 (하나라도 해당 = 미통과): 가독성 저하(흐림, 잘림, 글리프 누락); 대상 기기에서 팝업 없는 기준선 대비 전투 프레임 타임이 명확히 악화; 레이캐스트가 켜진 채 팝업이 필수 탭을 차단; 크리티컬/힐/미스 비주얼이 데이터 기반 스펙과 불일치; 숫자 포맷이 디자인 표와 불일치(예: 1.2K와 1200 혼용).


먼저 선택: TMP 또는 비트맵 숫자

시나리오더 적합흔한 함정
숫자 + 소수 기호(0-9 . + - %)비트맵 / 커스텀 숫자 메시문자셋 누락; 잘못된 필터 → 흐림
완전한 현지화 문자열(“Critical”, “Immune”)TMP + 문자열 테이블숫자와 혼용 시 너비 흔들림
강한 외곽선, 그라디언트, 애니메이션 스타일비트맵 또는 프레임 시퀀스상태 누락 → 잘못된 색상 폴백
프로토타입기본 TMP SDF레퍼런스 해상도 없음 → 기기에서 흐림

기기 흐림이 지속되면: Canvas Scaler 레퍼런스, TMP 패딩/아틀라스, 비트맵 Filter Mode(보통 Point)—그다음 문자셋 또는 SDF 품질. 비트맵 폰트 문자셋 계획 및 출시 전 항목 3 참조.

Sharp in Editor vs soft on device

Bitmap digit atlas vs TMP/SDF text


Unity: 구축과 승인 (6단계)

1. 전용 Canvas 또는 명시적 정렬

  • 전용 Canvas(전투 카메라에 맞춘 Screen Space - Camera) 또는 HUD 자식 레이어를 사용하라.
  • **sortingOrder**를 월드 UI 위, 모달 팝업 아래로 설정하라; 팝업 그래픽에 raycastTarget = false.
  • 월드 팝업: 하나의 공유 World Canvas—숫자마다 Canvas 하나가 아님.

Popup Canvas sort above HUD, below modals, raycasts off

2. 오브젝트 풀

  • 화면 최대 개수 이상으로 예열하라(스킬로 인한 스트레스; 보통 최소 16–32).
  • 재활용 시: 위치, 알파, 스케일, 애니메이션 상태, 텍스트를 리셋하라.
  • 타격마다 Instantiate/Destroy 금지.

3. 데이터와 프레젠테이션 분리

  • 전투는 DamagePopupEvent(값, 타입, 월드 위치/부착 지점, 크리티컬 플래그)를 발생시킨다.
  • 프레젠테이션이 색상, 접두사, 축약(K/M/B), 커브를 선택한다.
  • 디자인 표가 타입 → 스타일 Prefab(Normal / Crit / Heal / Miss / Block)을 매핑한다.

4. 모션과 가독성

  • 일반적: 위로 떠오름 + 페이드 + 약간의 스케일; 0.4–0.8초; 같은 앵커에서 스태거 또는 큐잉.
  • 같은 프레임 다중 타격: 병합하거나 1–2프레임 오프셋으로 겹침 방지.
  • 크기가 카메라 거리를 따르면 하나의 월드 스케일 규칙을 사용하라—UI Canvas 스케일과 이중으로 혼용하지 마라.

Multiple popup states with horizontal stagger

5. 문자셋과 포맷팅

  • 비트맵: 0-9 . , + - % x K M B 및 프로젝트 축약 규칙을 검증하라.
  • TMP: 필드나 스프라이트를 분리하라—하나의 문자열로 폰트를 바꾸는 데 의존하지 마라.
  • 로케일 오버플로 시: 완전한 현지화 문장을 팝업 아트로 래스터화하지 마라.

6. 기기 스모크

  • Dev 및 Release: 30초 몹 무리, 다중 틱 보스 스킬, 저RAM 기기.
  • 팝업 있음 vs 없음 프레임 타임 비교; 크리티컬/힐/미스 각각 한 번 스크린샷.
  • 통과 기준은 Prefab + 풀 설정에 있으며 테스트 Scene에만 있지 않다.

디자인 핸드오프 (숫자와 상태)

전달물용도
상태별(Normal/Crit/Heal/Miss) 숫자 아트 또는 TMP 스타일표 기반 Prefab/Material
대상 해상도의 외곽선/그림자기기 선명도 검사
숫자 위 크리티컬/콤보 색상 + 아이콘코드에 하드코딩된 틴트 방지
문자셋 범위(숫자만 vs 현지화 단위)비트맵 또는 문자열 테이블

디자인 핸드오프 체크리스트: 팝업이 래스터라면 로케일별 여부를 명세하라; 기본은 비트맵 숫자 + TMP 라벨.


수정 라우팅

증상가능 원인조치담당
기기에서 흐림, 에디터에서 선명Scaler / SDF / 비트맵 필터레퍼런스 해상도 정렬; Point 필터; SDF 패딩엔지니어링
글리프 누락문자셋 / 기호문자셋 확장; 또는 TMP엔지니어링 + 디자인
버튼 차단정렬 / 레이캐스트순서 낮춤 또는 레이캐스트 비활성엔지니어링
끊김풀 없음 / 너무 많은 FX+텍스트풀; 같은 프레임 팝업 병합엔지니어링
잘못된 크리티컬 외형하드코딩 색상타입→Prefab; 디자인 상태엔지니어링 + 디자인
HUD 스타일과 분리두 개의 폰트 파이프라인폰트 소스 또는 Theme 통일디자인 + 엔지니어링

자주 묻는 질문

팝업이 반드시 World Space여야 하나?
아니다. 고정 2D는 보통 Screen Space - Camera; 자유 3D 카메라는 보통 World Canvas. 하나를 선택하고 문서화하라.

화려함을 위한 UI 파티클?
FX에는 괜찮다; 숫자는 로케일과 풀링을 위해 Label/TMP/메시로 유지하라.

데미지 로직과 하나의 스크립트?
로직에서 이벤트를 발생시켜라; 테스트와 접근성을 위해 프레젠테이션 토글(ShowDamageNumbers).

큰 숫자?
디자인에서 하나의 포맷터 규칙; 단일 구현—UI 스크립트에 복사-붙여넣기 금지.

이 글도 추천합니다