# 🎨 Visual Feedback & Signal Pattern (시각적 피드백 및 신호 패턴)

> **카테고리**: [[Skybound]], [[UI-UX]], [[Graphics & Performance]]
> **상태**: 🔵 표준화 완료 (Standardized)
> **최종 업데이트**: 2026-04-22

---

## 📌 개요 (Overview)
Skybound의 렌더링 시스템은 게임 로직(ModularWeaponSystem 등)과 렌더러(GameRenderer) 간의 결합도를 낮추기 위해 'Auto-decay Signal Pattern'을 사용한다. 이를 통해 복잡한 애니메이션 상태 관리 없이도 화려한 특수 효과를 구현한다.

## 🛠️ 핵심 디자인 패턴 (Core Patterns)

### 1. Auto-decay Signal Pattern
- **작동 원리**: 로직 시스템에서 시각 효과가 필요할 때, 공유 `state` 객체에 짧은 생명주기(timer)를 가진 신호 객체를 기록한다.
- **예시 (Nova Burst)**:
  ```typescript
  state.novaBurstRingEffect = { x, y, radius, level, timer: 20 };
  ```
- **렌더러 동작**: `GameRenderer`는 매 프레임 해당 신호가 있는지 확인하고, 있으면 그림을 그린 뒤 `timer--`를 수행한다. 타이머가 0이 되면 신호는 자연 소멸한다.
- **장점**: 로직과 렌더링 레이어의 완벽한 분리, 시스템 간 의존성 최소화.

### 2. Multi-Layer Canvas Compositing
화려한 연출을 위해 단일 `arc`가 아닌 여러 레이어의 합성(Compositing)을 사용한다.
- **Base Layer**: 중심점에서의 강한 플래시 (Radial Gradient).
- **Shockwave Layer**: 시간에 따라 확장되며 얇아지는 메인 링.
- **Spike/Particle Layer**: 방향성을 가진 스파이크 라인 및 파티클 방출.
- **Color Branching**: 일반 스킬은 청록(#00e5ff), EVO 스킬(Nova Guardian)은 황금(#ffd700) 팔레트를 사용하여 위계 차별화.

### 3. Screen Shake & Damage Text
- **Shake Intent**: 강력한 타격 시 `SCREEN_SHAKE` 인텐트를 발행하여 카메라 좌표에 노이즈를 가산.
- **Floating Text**: 획득 보상(Gold, Pass Points)이나 데미지를 색상별로 구분하여 플로팅 텍스트로 처리.

## 💡 성능 최적화 (Optimization)
- 모든 렌더링은 `Canvas 2D API`의 `globalAlpha`와 `save/restore` 스택을 활용하여 상태 오염을 방지하고 성능 부하를 최소화함.

---
**승인인**: AI 개발부장 코다리 🫡
**관련 코드**: `GameRenderer.ts`, `ModularWeaponSystem.ts`, `useGameEngine.ts`
