game/prompt/40_ui_update_summary.md

40. UI Update Summary (Risky Attack Visual Effects)

39번 (Luck System) 이후 작업된 UI 및 시각 효과 관련 변경 사항 정리입니다.

1. Attack Animation & Visual Effects

공격 유형(Risk Level)에 따라 차별화된 애니메이션과 시각 효과를 구현했습니다.

BattleAnimationWidget (lib/widgets/battle/battle_animation_widget.dart)

animateAttack 메서드가 RiskLevel을 인자로 받아 각기 다른 동작을 수행합니다.

• Safe Attack:
  • 동작: 제자리에서 좌우로 살짝 흔들리는(Wobble) 애니메이션.
  • 느낌: 신중함, 머뭇거림.
  • 구현: Curves.elasticIn을 사용한 짧은 X축 이동 (200ms).
• Normal Attack:
  • 동작: 적에게 다가가서 가볍게 부딪히는(Dash) 애니메이션.
  • 느낌: 일반적인 타격.
  • 구현: 확대(Scale Up) 없이 Curves.easeOutQuad로 이동 후 복귀 (400ms).
• Risky Attack:
  • 동작: 몸을 크게 부풀린 후(Scale Up) 강하게 돌진(Heavy Dash).
  • 느낌: 강력한 한 방, 높은 리스크.
  • 구현: 1.2배 확대(600ms) -> Curves.easeInExpo 가속 돌진(500ms) -> 타격 -> 복귀.

ExplosionWidget (lib/widgets/battle/explosion_widget.dart) [NEW]

• 기능: 타격 지점에서 파편(Particle)이 사방으로 튀는 효과.
• 구현: CustomPainter를 사용하여 다수의 파티클을 효율적으로 렌더링.
• 트리거: Risky Attack 적중 시에만 발동.

ShakeWidget (lib/widgets/battle/shake_widget.dart)

• 기능: 화면(또는 위젯)을 흔드는 효과.
• 적용: Risky Attack 타격 시에만 발동.

2. BattleScreen Integration (lib/screens/battle_screen.dart)

• BattleAnimationWidget, ExplosionWidget, ShakeWidget을 조합하여 전투 연출 구성.
• _addFloatingEffect에서 공격 이벤트 수신 시 RiskLevel에 따라 적절한 애니메이션 메서드 호출.
• Risky Attack의 경우: Scale Up -> Dash -> Impact (Shake + Explosion) -> Return의 시퀀스로 동작.
• Timing Sync: 데미지 텍스트 표시 타이밍을 애니메이션 타격 시점(Safe: 200ms, Normal: 400ms, Risky: 1100ms)에 맞게 조정.
• Icon-Only Animation: 공격 시 전체 카드가 아닌 캐릭터 아이콘만 적에게 날아가도록 변경.
• Hide Stats: 공격 애니메이션 진행 중에는 HP, Armor 등 스탯 정보를 숨겨 시각적 혼란 방지.

3. 기타 UI 개선

• Floating Effects: 데미지 텍스트 및 이펙트 아이콘 위치 조정.
• Risk Level Selection: 다이얼로그 UI 개선.
• CharacterStatusCard: 애니메이션 키(animationKey)와 스탯 숨김(hideStats) 속성 추가.