캐릭터 도감 & 수영장 입수 물리 엔진 시뮬레이션

👤 4인 4색 캐릭터 도감 (Character Profiles)

플레이어는 로비에서 자신의 개성을 표현할 캐릭터를 자유롭게 선택할 수 있습니다. 각 캐릭터는 고유한 비주얼 스프라이트와 입수 애니메이션을 보유하고 있습니다:

👦

스탠다드 보이

클래식 MC 스타일

원조 예능 진행자의 정석을 보여주는 베이직 캐릭터. 단정하지만 날아갈 때의 허탈한 표정 변화가 일품인 국민 캐릭터입니다.

🐸

개구리 점퍼

공중 곡예사

초록빛 수영복을 입고 입수 시 특유의 공중 360도 텀블링 궤적을 선보이며 가장 높은 고도까지 도약하는 탄성형 캐릭터입니다.

🤖

메카 사이보그

중량급 거인

금속 장갑을 두른 미래형 안드로이드. 날아갈 때 제트 분사 잔상이 생기며 수면에 닿는 순간 가장 거대한 물보라 충격을 발생시킵니다.

🥷

닌자 섀도우

스텔스 마스터

검은 복면의 날렵한 암살자. 기습적인 발사에도 공중 제비를 돌며 착지하며, 물속으로 미끄러지듯 잠수하는 세련된 모션을 자랑합니다.

📐 캔버스 2D 물리 엔진의 수학적 원리

단순한 GIF나 스프라이트 반복 재생이 아닙니다. '위험한 초대'의 모든 발사 장면은 실시간 프레임 단위의 수학적 물리 모델에 따라 계산되어 그려집니다:

1. 2D 탄도학 포물선 궤적 (Projectile Trajectory)

의자가 격발되는 순간 캐릭터에게는 상향과 후방을 향한 초기 속도 벡터 \(v_0\)가 주어집니다. 이후 프레임마다 중력 가속도 \(g\)와 수평 감속 계수가 적용됩니다:

// 수평 위치: x(t) = x_0 + (v_0 * cos(θ) * t)
// 수직 위치: y(t) = y_0 - (v_0 * sin(θ) * t) + (0.5 * g * t^2)
// 초기 발사각 θ = 65° | 중력 가속도 g = 9.8 m/s²

2. 수면 충돌 및 물방울 파티클 시뮬레이션 (Water Splash Particles)

캐릭터의 \(y\) 좌표가 수면 레벨(Waterline)에 도달하면 입수 충돌 이벤트가 발생합니다. 이때 수면 중앙에서 총 32개의 독립적인 물방울 파티클이 방사형으로 생성되며, 각 파티클은 개별적인 수명(Life), 크기, 투명도, 비산 속도를 가집니다:

particle.vx = (Math.random() - 0.5) * splashForce;
particle.vy = -Math.random() * splashForce * 1.5; // 상향 비산
particle.alpha -= particle.decayRate; // 투명도 지수 감쇠

🦈 소환수(상어, 악어, 갈매기) 인터랙션 메커니즘

수영장은 안전한 곳만이 아닙니다! 아이템전을 활성화하면 소환된 수중/상공 동물들이 수영장을 휘젓고 다닙니다:

• 죠스 상어: 수면 위로 검은 삼각 지느러미를 드러내며 좌우로 순항하다가, 플레이어가 입수하는 지점으로 고속 돌진하여 거대한 물보라를 만듭니다.
• 늪지대 악어: 수면 아래 숨죽이고 있다가 플레이어가 착수할 때 턱을 쩍 벌리는 코믹한 특수 이펙트를 발생시킵니다.
• 부산 갈매기: 상공을 우아하게 선회하며 의자가 솟구칠 때 놀라서 깃털을 흩날리는 공중 앰비언트 효과를 연출합니다.

⚡ 브라우저 60 FPS 보장을 위한 최적화 기법

저사양 스마트폰이나 오래된 노트북 브라우저에서도 끊김 없이 부드러운 60 FPS를 유지하기 위해 다음의 엔지니어링 최적화가 적용되었습니다:

1. RequestAnimationFrame 동기화: 타이머(setInterval) 기반의 불규칙한 호출을 배제하고 디스플레이 주사율과 1:1로 일치하는 네이티브 렌더 루프를 사용합니다.
2. 파티클 풀링(Object Pooling): 가비지 컬렉터(GC) 부하를 방지하기 위해 입수 때마다 새 객체를 메모리에 할당하지 않고 사전 생성된 파티클 배열을 재사용합니다.
3. 뷰포트 상대 해상도(DPR) 보정: 레티나 디스플레이에서도 글자와 캐릭터가 선명하게 보이도록 디바이스 픽셀 비율(Device Pixel Ratio)을 동적으로 감지하여 캔버스 크기를 스케일링합니다.

🔄 캐릭터 8단계 상태 머신(PlayerState SSOT)과 피격 연출

각 캐릭터는 단순한 정지 이미지가 아니라, 게임 내 물리·전투 이벤트에 따라 실시간으로 표정과 자세가 변화하는 8단계 유한 상태 머신(Finite State Machine)으로 구동됩니다:

• 정상 착석 (idle): 데크 위 플라잉 체어에 단정하게 앉아 눈을 깜빡이며 말풍선을 띄우는 기본 상태입니다. 인벤토리의 모든 액티브 아이템을 사용할 수 있습니다.
• 포물선 비행 (flying): 금기어 발화 또는 침묵 페널티 발동 시 의자 등받이가 뒤로 젖혀지며 캐릭터가 놀란 표정(O_O)으로 공중 궤적을 그리며 날아갑니다.
• 수영 및 복귀 보행 (swimming / walking): 수면에 착수해 물장구를 치며 헤엄친 뒤, 데크 계단을 올라와 본인의 의자로 걸어 복귀합니다. 이 동안에는 금기어 판정으로부터 보호받습니다.
• 유도 미사일 피격 반전 (dead-missile): 적의 유도 미사일에 명중당하면 폭발 이펙트와 함께 캐릭터가 의자 위에서 180도 상하 반전(거꾸로 매달림)되며 두 눈이 X_X(죽은 표정)로 변합니다. 이 모습은 방 안의 모든 플레이어 화면에 100% 동일하게 동기화되며, 연속 피격 시 기절 시간이 30초씩 누적됩니다.
• 맹수 포획 기절 (dead / dead-gator / snatched): 상어에게 물려 심해로 가라앉거나(30초), 악어에게 물려 수면에서 허우적대거나(15초), 부산갈매기 발톱에 붙잡혀 하늘 밖으로 납치되는(60초) 특수 애니메이션이 재생됩니다.

🔊 무설치 Web Audio API 절차적 사운드 합성 엔진

외부 MP3 파일 로딩으로 인한 네트워크 지연을 없애기 위해, 플라잉 체어 온라인은 브라우저 내장 Web Audio API 오실레이터(Oscillator)와 노이즈 버퍼를 실시간으로 합성하여 효과음을 생성합니다. 의자가 튕겨 나가는 경쾌한 스프링 음, 수면에 부딪히는 화이트 노이즈 물보라 소리, 유도 미사일의 낙하 휘슬음, 침묵 타이머 5초 전의 긴박한 비프음까지 모두 코드로 실시간 합성되어 0ms의 즉각적인 타격감을 전달합니다.

사운드 파형별 물리적 주파수 설계 명세

각 이벤트 사운드는 직관적인 청각 피드백을 위해 서로 다른 주파수 대역과 파형(Waveform)으로 조율되어 있습니다. 플라잉 체어 발사음은 180Hz에서 880Hz로 급격히 상승하는 톱니파(Sawtooth) 주파수 스윕을 통해 공압 실린더의 폭발적인 도약감을 표현하며, 수면 입수음은 밴드패스 필터(Bandpass Filter)를 통과한 화이트 노이즈 버스트로 시원한 물보라 질감을 재현합니다. 반면 유도 미사일 피격음은 저음역 삼각파(Triangle)와 디스토션 엔벨로프를 결합해 묵직한 타격감을 주며, 이지스 방패 요격 시에는 맑은 고음역 사인파(Sine) 화음이 울려 퍼져 시각을 보지 않고 소리만으로도 전황을 즉각 파악할 수 있습니다. 모바일 브라우저의 오디오 자동 재생 정책(Autoplay Policy)에 대응하기 위해 사용자의 첫 터치 이벤트 시점에 AudioContext를 자동으로 잠금 해제하여 모든 기기에서 끊김 없는 사운드를 보장합니다.