사운드와 폴리싱 완벽 가이드

게임에 생동감을 불어넣는 사운드와 시각 효과의 모든 것을 다룹니다. 점프 효과음부터 파티클 이펙트, 화면 흔들림까지 게임을 더욱 풍성하게 만드는 폴리싱 기법을 배워봅니다.

---

목차

1. 점프_착지_효과음
2. 코인_수집_사운드
3. 배경음악_추가
4. 파티클_이펙트
5. 화면_흔들림_효과
6. 게임_피드백_개선

---

1. 점프 착지 효과음

김개발 씨가 만든 플랫폼 게임을 친구에게 보여줬습니다. "음...

캐릭터가 점프하는 건 알겠는데, 뭔가 허전하다?" 친구의 말에 김개발 씨는 고개를 갸웃거렸습니다. 분명히 점프 기능은 완벽하게 구현했는데, 무엇이 부족한 걸까요?

점프 효과음은 캐릭터의 행동에 청각적 피드백을 더해주는 핵심 요소입니다. 마치 운동화가 땅을 박차고 오를 때 나는 소리처럼, 플레이어에게 "지금 점프했다"는 확실한 신호를 보내줍니다.

이 작은 소리 하나가 게임의 몰입감을 크게 높여줍니다.

다음 코드를 살펴봅시다.

// 프리로드에서 효과음 파일 미리 불러오기
preload() {
    this.load.audio('jumpSound', 'assets/sounds/jump.wav');
    this.load.audio('landSound', 'assets/sounds/land.wav');
}

// 게임 시작 시 사운드 객체 생성
create() {
    this.jumpSound = this.sound.add('jumpSound', { volume: 0.5 });
    this.landSound = this.sound.add('landSound', { volume: 0.3 });
    this.wasInAir = false;
}

// 점프 실행 시 효과음 재생
jump() {
    if (this.player.body.onFloor()) {
        this.player.setVelocityY(-400);
        this.jumpSound.play();  // 점프 순간 소리 재생
    }
}

// 착지 감지 및 효과음
update() {
    const onFloor = this.player.body.onFloor();
    if (this.wasInAir && onFloor) {
        this.landSound.play();  // 착지 순간 소리 재생
    }
    this.wasInAir = !onFloor;
}

김개발 씨는 입사 후 첫 번째 개인 프로젝트로 간단한 플랫폼 게임을 만들고 있었습니다. 캐릭터가 뛰어다니고, 장애물을 피하고, 목표 지점에 도착하는 단순한 게임이었습니다.

기능적으로는 완벽했습니다. 하지만 무언가 2% 부족했습니다.

선배 개발자 박시니어 씨가 슬쩍 모니터를 들여다봤습니다. "게임 잘 만들었네.

근데 소리가 없으니까 좀 심심하지 않아?" 그 순간 김개발 씨는 깨달았습니다. 자신이 즐겨 했던 모든 게임에는 점프할 때마다 경쾌한 소리가 났다는 것을요.

점프 효과음이란 정확히 무엇일까요? 쉽게 말해, 캐릭터가 땅을 박차고 뛰어오를 때 재생되는 짧은 소리입니다.

마치 농구 선수가 덩크슛을 위해 도약할 때 운동화 바닥이 코트를 스치는 소리처럼, 행동에 현실감을 부여하는 역할을 합니다. 착지 효과음도 마찬가지입니다.

캐릭터가 공중에서 다시 땅으로 내려올 때 "쿵" 하는 소리가 나면, 플레이어는 "착지했구나"라고 본능적으로 인지합니다. 이 두 가지 소리가 없으면 캐릭터가 유령처럼 둥둥 떠다니는 느낌이 듭니다.

Phaser에서 효과음을 추가하는 방법은 생각보다 간단합니다. 먼저 preload 함수에서 오디오 파일을 불러옵니다.

this.load.audio 메서드는 첫 번째 인자로 식별자를, 두 번째 인자로 파일 경로를 받습니다. 다음으로 create 함수에서 사운드 객체를 생성합니다.

this.sound.add 메서드를 사용하면 됩니다. 여기서 중요한 것은 volume 옵션입니다.

점프 소리는 0.5, 착지 소리는 0.3으로 설정했는데, 착지 소리를 살짝 작게 한 이유가 있습니다. 점프는 플레이어의 의도적인 행동이고, 착지는 자연스러운 결과이기 때문입니다.

착지 감지는 조금 더 신경 써야 합니다. 단순히 "바닥에 닿았다"만 확인하면 게임 시작부터 소리가 날 수 있습니다.

그래서 wasInAir라는 변수를 만들어 "이전 프레임에서는 공중에 있었는데, 지금은 바닥에 있다"는 조건을 체크합니다. 실무에서 이 기법은 어떻게 활용될까요?

유명한 플랫폼 게임들을 떠올려 보세요. 마리오가 점프할 때 나는 "삐용" 소리, 소닉이 링을 먹을 때 나는 "띵" 소리.

이런 효과음들이 게임의 정체성을 만듭니다. 주의할 점도 있습니다.

효과음의 길이가 너무 길면 연속 점프할 때 소리가 겹쳐서 불쾌해집니다. 점프 효과음은 0.1초에서 0.3초 사이의 짧은 소리를 사용하는 것이 좋습니다.

박시니어 씨의 조언을 들은 김개발 씨는 바로 효과음을 추가했습니다. 다시 게임을 실행하니, 같은 게임이 훨씬 생동감 있게 느껴졌습니다.

"이게 바로 폴리싱의 힘이구나!"

실전 팁

💡 - 점프 효과음은 0.1초~0.3초 길이의 짧은 소리를 사용하세요

• 착지 효과음은 점프 효과음보다 볼륨을 낮게 설정하면 자연스럽습니다
• 무료 효과음은 freesound.org나 opengameart.org에서 구할 수 있습니다

---

2. 코인 수집 사운드

점프 효과음을 넣은 김개발 씨는 신이 나서 코인 수집 기능도 추가했습니다. 캐릭터가 코인에 닿으면 코인이 사라지고 점수가 올라갑니다.

하지만 뭔가 또 허전합니다. "코인을 먹었는데 왜 이렇게 보람이 없지?" 김개발 씨는 다시 한번 고민에 빠졌습니다.

코인 수집 사운드는 플레이어에게 보상감을 주는 핵심 피드백입니다. 마치 자판기에서 동전이 떨어질 때 나는 "딸깍" 소리처럼, 무언가를 얻었다는 만족감을 청각으로 전달합니다.

이 소리가 플레이어로 하여금 더 많은 코인을 수집하고 싶게 만듭니다.

다음 코드를 살펴봅시다.

// 프리로드에서 코인 사운드 불러오기
preload() {
    this.load.audio('coinSound', 'assets/sounds/coin.wav');
}

// 사운드 객체 생성 및 코인 그룹 설정
create() {
    this.coinSound = this.sound.add('coinSound', { volume: 0.4 });

    // 코인 그룹 생성
    this.coins = this.physics.add.group({
        key: 'coin',
        repeat: 9,
        setXY: { x: 50, y: 300, stepX: 80 }
    });

    // 플레이어와 코인 충돌 감지
    this.physics.add.overlap(
        this.player,
        this.coins,
        this.collectCoin,
        null,
        this
    );
}

// 코인 수집 함수
collectCoin(player, coin) {
    coin.disableBody(true, true);  // 코인 비활성화
    this.coinSound.play();          // 수집 소리 재생
    this.score += 10;               // 점수 증가
    this.scoreText.setText('Score: ' + this.score);
}

김개발 씨는 어렸을 때 오락실에서 했던 게임들을 떠올렸습니다. 코인을 먹을 때마다 "띵!" 하는 소리가 났습니다.

그 소리가 너무 좋아서 일부러 코인을 찾아다녔던 기억이 있습니다. 박시니어 씨가 설명해줬습니다.

"그게 바로 보상 피드백이야. 플레이어가 좋은 행동을 했을 때 즉시 칭찬해주는 거지.

소리로." 코인 수집 사운드는 단순한 효과음이 아닙니다. 심리학적으로 이것은 즉각적 보상의 역할을 합니다.

슬롯머신에서 돈이 쏟아질 때 나는 소리를 생각해보세요. 그 소리가 사람들을 더 열광하게 만듭니다.

게임에서도 마찬가지입니다. Phaser에서 코인 수집 시스템을 구현하는 방법을 살펴보겠습니다.

먼저 physics.add.group으로 코인 그룹을 만듭니다. repeat: 9는 총 10개의 코인을 생성한다는 뜻입니다.

stepX: 80은 코인 사이의 간격이 80픽셀이라는 의미입니다. 다음으로 physics.add.overlap을 사용합니다.

이 메서드는 두 객체가 겹칠 때 특정 함수를 실행합니다. 여기서는 플레이어와 코인이 겹치면 collectCoin 함수가 호출됩니다.

collectCoin 함수 내부를 보면, **disableBody(true, true)**가 핵심입니다. 첫 번째 true는 물리 엔진에서 비활성화, 두 번째 true는 화면에서 숨기기를 의미합니다.

이렇게 하면 코인이 완전히 사라집니다. 코인이 사라지는 동시에 **coinSound.play()**가 실행됩니다.

이 타이밍이 중요합니다. 코인이 사라지기 전에 소리가 나거나, 한참 후에 소리가 나면 어색합니다.

동시에 일어나야 자연스럽습니다. 실제 게임 개발에서는 코인 종류에 따라 다른 소리를 사용하기도 합니다.

금화는 묵직한 소리, 은화는 가벼운 소리, 보너스 코인은 화려한 소리. 이런 차별화가 게임을 더욱 풍성하게 만듭니다.

한 가지 주의할 점이 있습니다. 코인을 빠르게 연속으로 수집할 때 소리가 겹치는 문제입니다.

이를 해결하려면 detune 옵션을 활용할 수 있습니다. 매번 약간씩 다른 음높이로 재생하면 훨씬 자연스럽습니다.

김개발 씨는 코인 사운드를 추가하고 나서 테스트해봤습니다. "띵, 띵, 띵!" 코인을 수집할 때마다 나는 소리에 절로 미소가 지어졌습니다.

게임이 드디어 게임다워지고 있었습니다.

실전 팁

💡 - 연속 수집 시 음높이를 살짝 변경하면 지루함을 방지할 수 있습니다

• 코인 종류별로 다른 소리를 사용하면 수집의 재미가 배가됩니다
• 볼륨은 0.3~0.5 사이가 적당합니다

---

3. 배경음악 추가

효과음을 모두 넣은 김개발 씨의 게임은 이제 제법 그럴듯해졌습니다. 하지만 게임을 5분 정도 플레이하니 이상하게 지루해졌습니다.

"효과음만으로는 뭔가 부족해..." 그때 옆자리 동료가 이어폰을 빼며 흥얼거리는 노래가 들렸습니다. 바로 그거였습니다!

**배경음악(BGM)**은 게임의 분위기와 몰입감을 결정짓는 핵심 요소입니다. 마치 영화에서 음악이 감정선을 이끌어가듯, 게임에서도 BGM이 플레이어의 감정을 조절합니다.

적절한 배경음악은 지루함을 없애고, 긴장감을 높이고, 성취감을 배가시킵니다.

다음 코드를 살펴봅시다.

// 프리로드에서 배경음악 불러오기
preload() {
    this.load.audio('bgm', 'assets/sounds/background.mp3');
}

// 배경음악 설정 및 재생
create() {
    // 배경음악 객체 생성
    this.bgm = this.sound.add('bgm', {
        volume: 0.3,
        loop: true      // 무한 반복 재생
    });

    // 게임 시작 시 음악 재생
    this.bgm.play();
}

// 일시정지 시 음악도 일시정지
pauseGame() {
    this.bgm.pause();
    this.scene.pause();
}

// 재개 시 음악도 재개
resumeGame() {
    this.bgm.resume();
    this.scene.resume();
}

// 씬 전환 시 음악 정지
shutdown() {
    this.bgm.stop();
}

김개발 씨는 자신이 좋아하는 게임들을 떠올려봤습니다. 젤다의 전설, 마리오, 언더테일...

모든 게임에는 기억에 남는 배경음악이 있었습니다. 심지어 게임을 안 해도 음악만 들으면 그 게임이 생각날 정도였습니다.

박시니어 씨가 말했습니다. "BGM은 게임의 영혼이야.

아무리 그래픽이 좋아도 음악이 없으면 생명력이 없는 것 같거든." 배경음악은 효과음과는 다른 역할을 합니다. 효과음이 "지금 무슨 일이 일어났다"를 알려준다면, 배경음악은 "지금 어떤 분위기다"를 전달합니다.

긴장되는 보스전에서는 빠른 템포의 음악이, 평화로운 마을에서는 잔잔한 음악이 흐릅니다. Phaser에서 배경음악을 추가하는 것은 효과음과 비슷하지만, 몇 가지 중요한 차이점이 있습니다.

가장 중요한 것은 loop: true 옵션입니다. 이 옵션이 없으면 음악이 한 번 재생되고 끝나버립니다.

게임 중간에 갑자기 음악이 멈추면 얼마나 어색할까요? 볼륨 설정도 신경 써야 합니다.

배경음악은 0.2~0.4 사이가 적당합니다. 너무 크면 효과음이 묻히고, 너무 작으면 존재감이 없습니다.

효과음은 주연, 배경음악은 조연이라고 생각하면 됩니다. 게임 상태에 따른 제어도 중요합니다.

일시정지 메뉴를 열었는데 음악이 계속 나온다면? 일부 게임에서는 의도적으로 그렇게 하기도 하지만, 대부분은 pause() 메서드로 음악도 함께 멈춥니다.

그리고 재개할 때 **resume()**으로 이어서 재생합니다. 씬 전환 시에는 반드시 **stop()**을 호출해야 합니다.

그렇지 않으면 새로운 씬에서 새 BGM이 시작되어도 이전 BGM이 계속 재생되어 음악이 겹치는 끔찍한 상황이 벌어집니다. 실무에서는 상황별로 다른 BGM을 사용합니다.

스테이지 BGM, 보스전 BGM, 게임오버 BGM, 승리 BGM 등. 이런 음악의 변화가 플레이어의 감정을 효과적으로 이끌어갑니다.

브라우저 정책 때문에 주의할 점이 있습니다. 최신 브라우저들은 사용자 상호작용 없이는 오디오 자동 재생을 차단합니다.

따라서 게임 시작 전에 "클릭하여 시작" 버튼을 만들고, 그 클릭 이벤트에서 BGM을 시작하는 것이 안전합니다. 김개발 씨는 신나는 8비트 스타일의 BGM을 찾아 게임에 넣었습니다.

음악이 흐르니 게임이 완전히 달라 보였습니다. 5분이 아니라 50분도 플레이할 수 있을 것 같았습니다.

실전 팁

💡 - 브라우저 자동재생 정책 때문에 사용자 클릭 후 BGM을 시작하세요

• 볼륨은 0.2~0.4로 설정하여 효과음이 묻히지 않게 하세요
• 씬 전환 시 반드시 이전 BGM을 정지하세요

---

4. 파티클 이펙트

소리는 완벽해졌지만, 김개발 씨는 욕심이 생겼습니다. "코인을 먹을 때 뭔가 팡!

하고 터지는 효과가 있으면 어떨까?" 유튜브에서 본 인디 게임들은 코인을 먹을 때마다 반짝반짝 빛이 났습니다. 어떻게 하면 그런 효과를 낼 수 있을까요?

파티클 이펙트는 작은 입자들이 모여 만드는 시각 효과입니다. 마치 불꽃놀이처럼 수많은 작은 점들이 흩어지며 화려한 연출을 만들어냅니다.

게임에서 폭발, 마법, 수집 효과 등에 광범위하게 사용되며, 게임의 시각적 완성도를 크게 높여줍니다.

다음 코드를 살펴봅시다.

// 파티클 이미지 불러오기
preload() {
    this.load.image('particle', 'assets/images/particle.png');
}

// 파티클 이미터 설정
create() {
    // 파티클 이미터 생성
    this.coinParticles = this.add.particles(0, 0, 'particle', {
        speed: { min: 50, max: 150 },
        scale: { start: 0.5, end: 0 },
        lifespan: 500,
        gravityY: 200,
        quantity: 10,
        emitting: false  // 자동 방출 비활성화
    });
}

// 코인 수집 시 파티클 방출
collectCoin(player, coin) {
    // 코인 위치에서 파티클 방출
    this.coinParticles.emitParticleAt(coin.x, coin.y);

    coin.disableBody(true, true);
    this.coinSound.play();
    this.score += 10;
}

김개발 씨는 파티클이라는 단어를 처음 들었을 때 막연히 어려울 것 같았습니다. 하지만 박시니어 씨의 설명을 듣고 나니 생각보다 단순한 원리였습니다.

"파티클은 말 그대로 입자야. 아주 작은 이미지 조각들을 여러 개 뿌리는 거지.

각 입자가 조금씩 다른 방향으로 움직이면서 자연스러운 효과가 나는 거야." 파티클 이펙트의 원리를 불꽃놀이로 비유해볼까요? 폭죽이 터지면 수백 개의 작은 불꽃들이 사방으로 흩어집니다.

각 불꽃은 자신만의 속도와 방향을 가지고 있고, 시간이 지나면 서서히 사라집니다. 파티클 이펙트도 정확히 이와 같습니다.

Phaser에서 파티클을 사용하려면 먼저 작은 이미지가 필요합니다. 보통 8x8 또는 16x16 크기의 작은 원이나 별 모양을 사용합니다.

이 이미지가 수십 개 복제되어 흩어지는 것입니다. this.add.particles 메서드의 옵션들을 살펴보겠습니다.

speed는 입자가 퍼져나가는 속도입니다. min과 max를 다르게 설정하면 입자마다 다른 속도를 가져서 자연스러워집니다.

scale은 입자의 크기 변화입니다. start: 0.5, end: 0으로 설정하면 처음에는 제법 크다가 점점 작아지면서 사라집니다.

이것이 페이드아웃 효과를 만듭니다. lifespan은 입자의 수명입니다.

500밀리초, 즉 0.5초 후에 입자가 사라집니다. 너무 짧으면 효과가 안 보이고, 너무 길면 화면이 지저분해집니다.

gravityY는 중력입니다. 200으로 설정하면 입자들이 위로 솟았다가 아래로 떨어지는 자연스러운 움직임을 보입니다.

0으로 설정하면 입자가 직선으로 움직입니다. emitting: false는 중요한 옵션입니다.

이것을 true로 하면 파티클이 계속 방출됩니다. false로 하고 emitParticleAt 메서드를 직접 호출해야 원하는 순간에만 파티클이 나옵니다.

실무에서 파티클은 정말 다양하게 활용됩니다. 캐릭터가 뛸 때 발밑의 먼지, 총알이 맞았을 때 피 효과, 마법 시전 시 빛나는 입자들, 보스 처치 시 화려한 폭발 등.

파티클 하나로 게임의 품격이 달라집니다. 주의할 점은 성능입니다.

파티클을 너무 많이 사용하면 게임이 느려질 수 있습니다. quantity(한 번에 방출할 입자 수)와 lifespan을 적절히 조절해야 합니다.

김개발 씨는 노란색 작은 원 이미지를 만들어 코인 파티클로 사용했습니다. 코인을 먹을 때마다 반짝이는 효과가 나오니, 수집하는 맛이 두 배가 되었습니다.

실전 팁

💡 - 파티클 이미지는 8x8 또는 16x16 크기의 단순한 모양이 좋습니다

• quantity와 lifespan을 적절히 조절하여 성능 저하를 방지하세요
• 색상별로 다른 파티클을 사용하면 효과가 더 풍성해집니다

---

5. 화면 흔들림 효과

김개발 씨의 게임에 적 캐릭터를 추가했습니다. 플레이어가 적에게 닿으면 데미지를 입습니다.

하지만 체력 숫자가 줄어드는 것 외에는 아무런 피드백이 없었습니다. "맞았는데 왜 이렇게 안 아픈 것 같지?" 진짜 아픈 것처럼 느끼게 하려면 어떻게 해야 할까요?

**화면 흔들림 효과(Screen Shake)**는 충격이나 폭발 같은 강렬한 순간에 카메라를 흔들어 임팩트를 주는 기법입니다. 마치 지진이 났을 때 세상이 흔들리는 것처럼, 플레이어에게 "지금 큰일이 났다!"라는 메시지를 강렬하게 전달합니다.

액션 게임에서 빠질 수 없는 필수 효과입니다.

다음 코드를 살펴봅시다.

// 화면 흔들림 효과 함수
shakeScreen(intensity = 0.01, duration = 100) {
    this.cameras.main.shake(duration, intensity);
}

// 플레이어 피격 시 화면 흔들림
playerHit(player, enemy) {
    // 무적 상태면 무시
    if (player.isInvincible) return;

    // 체력 감소
    this.health -= 1;
    this.healthText.setText('HP: ' + this.health);

    // 화면 흔들림 효과
    this.cameras.main.shake(200, 0.02);

    // 플레이어 깜빡임 효과 (무적 시간)
    player.isInvincible = true;
    this.tweens.add({
        targets: player,
        alpha: { from: 0.5, to: 1 },
        duration: 100,
        repeat: 5,
        onComplete: () => { player.isInvincible = false; }
    });
}

// 강한 폭발 시 더 강한 흔들림
bigExplosion(x, y) {
    this.cameras.main.shake(500, 0.05);
    this.explosionParticles.emitParticleAt(x, y);
}

김개발 씨는 액션 영화를 떠올렸습니다. 폭발 장면에서 카메라가 흔들리면 그 충격이 고스란히 전해집니다.

게임에서도 이런 효과를 줄 수 있지 않을까요? 박시니어 씨가 웃으며 말했습니다.

"Screen Shake, 화면 흔들림이야. 간단하지만 효과는 엄청나지.

이거 하나로 게임의 타격감이 확 달라져." 화면 흔들림 효과는 Phaser에서 놀라울 정도로 간단하게 구현됩니다. this.cameras.main.shake 메서드 하나면 됩니다.

첫 번째 인자는 흔들림 지속 시간(밀리초), 두 번째 인자는 흔들림 강도입니다. 강도(intensity)는 0에서 1 사이의 값입니다.

0.01은 아주 살짝, 0.05는 꽤 강하게, 0.1 이상은 화면이 정신없이 흔들립니다. 상황에 맞게 적절히 조절해야 합니다.

피격 시에는 0.02 정도의 강도가 적당합니다. "아야, 맞았네" 정도의 느낌입니다.

반면 큰 폭발이나 보스 처치 같은 중요한 순간에는 0.05 이상의 강한 흔들림을 주면 좋습니다. 코드에서 주목할 부분은 피격 무적 시간입니다.

화면 흔들림만 있으면 안 되고, 플레이어가 잠시 무적이 되어야 합니다. 그렇지 않으면 적과 겹쳐 있는 동안 순식간에 체력이 바닥납니다.

this.tweens.add로 깜빡임 효과도 함께 추가했습니다. alpha 값을 0.5에서 1로 반복하면 캐릭터가 반투명해졌다 선명해졌다를 반복합니다.

이것이 "지금 무적이야"라는 시각적 신호가 됩니다. 실무에서 화면 흔들림은 정말 다양하게 활용됩니다.

플레이어 피격, 적 처치, 폭탄 폭발, 착지 충격, 문 부수기 등. 어떤 "충격"이 있을 때마다 화면을 살짝 흔들어주면 게임이 훨씬 역동적으로 느껴집니다.

주의할 점도 있습니다. 화면 흔들림을 너무 자주, 너무 강하게 사용하면 플레이어가 어지러움을 느낄 수 있습니다.

특히 멀미에 민감한 사람들을 위해 설정에서 화면 흔들림을 끌 수 있는 옵션을 제공하는 것이 좋습니다. 또 하나, 화면 흔들림 중에 스크린샷을 찍으면 이상하게 나옵니다.

이런 세세한 부분도 신경 쓰면 더 완성도 높은 게임이 됩니다. 김개발 씨는 피격 시 화면 흔들림과 캐릭터 깜빡임을 추가했습니다.

이제 적에게 맞으면 "아!" 하고 소리 지르게 될 정도로 임팩트가 느껴졌습니다.

실전 팁

💡 - 일반 피격은 강도 0.01~0.02, 큰 폭발은 0.05 이상으로 차별화하세요

• 접근성을 위해 화면 흔들림 on/off 옵션을 제공하면 좋습니다
• 깜빡임 효과와 함께 사용하면 피격 피드백이 더욱 명확해집니다

---

6. 게임 피드백 개선

모든 효과를 넣은 김개발 씨의 게임이 드디어 완성에 가까워졌습니다. 하지만 박시니어 씨가 마지막으로 한마디 했습니다.

"개별 효과들은 좋아. 근데 이것들을 하나로 묶어서 관리하면 어떨까?

나중에 수정하기도 쉽고, 다른 프로젝트에서도 재사용할 수 있잖아."

게임 피드백 시스템은 효과음, 파티클, 화면 흔들림 등 모든 피드백 요소를 통합 관리하는 구조입니다. 마치 오케스트라 지휘자처럼 각각의 악기(효과)들을 조화롭게 조율합니다.

이렇게 구조화하면 유지보수가 쉬워지고, 코드의 재사용성이 높아집니다.

다음 코드를 살펴봅시다.

// 피드백 매니저 클래스
class FeedbackManager {
    constructor(scene) {
        this.scene = scene;
        this.sounds = {};
        this.particles = {};
    }

    // 사운드 등록
    addSound(key, config = {}) {
        this.sounds[key] = this.scene.sound.add(key, {
            volume: config.volume || 0.5,
            ...config
        });
    }

    // 파티클 등록
    addParticle(key, textureKey, config = {}) {
        this.particles[key] = this.scene.add.particles(0, 0, textureKey, {
            emitting: false,
            ...config
        });
    }

    // 통합 피드백 실행
    play(type, x, y, options = {}) {
        // 사운드 재생
        if (this.sounds[type]) {
            this.sounds[type].play();
        }
        // 파티클 방출
        if (this.particles[type] && x !== undefined) {
            this.particles[type].emitParticleAt(x, y);
        }
        // 화면 흔들림
        if (options.shake) {
            this.scene.cameras.main.shake(
                options.shake.duration || 100,
                options.shake.intensity || 0.01
            );
        }
    }
}

// 사용 예시
create() {
    this.feedback = new FeedbackManager(this);
    this.feedback.addSound('coin', { volume: 0.4 });
    this.feedback.addSound('hit', { volume: 0.5 });
    this.feedback.addParticle('coin', 'particle', { quantity: 10 });
}

collectCoin(player, coin) {
    this.feedback.play('coin', coin.x, coin.y);
    coin.disableBody(true, true);
}

김개발 씨는 지금까지 배운 것들을 정리해봤습니다. 점프 효과음, 착지 효과음, 코인 사운드, 배경음악, 파티클, 화면 흔들림...

꽤 많은 코드가 여기저기 흩어져 있었습니다. 박시니어 씨가 말했습니다.

"지금은 작은 프로젝트라 괜찮지만, 게임이 커지면 이 코드들을 관리하기 힘들어져. 피드백 매니저를 만들어서 한 곳에서 관리하면 어떨까?" 피드백 매니저는 모든 피드백 요소를 통합 관리하는 클래스입니다.

마치 회사의 총무팀처럼, 필요한 자원을 요청하면 알아서 처리해주는 역할을 합니다. FeedbackManager 클래스의 구조를 살펴보겠습니다.

생성자에서 scene을 받아 저장하고, sounds와 particles 객체를 초기화합니다. 이 객체들이 모든 효과를 담는 창고 역할을 합니다.

addSound 메서드는 사운드를 등록합니다. 키(식별자)와 설정을 받아서 sounds 객체에 저장합니다.

나중에 이 키로 소리를 재생할 수 있습니다. addParticle 메서드도 비슷합니다.

파티클 이미터를 생성하고 particles 객체에 저장합니다. emitting: false로 설정해서 자동 방출을 막아둡니다.

핵심은 play 메서드입니다. 이 메서드 하나로 사운드, 파티클, 화면 흔들림을 모두 처리할 수 있습니다.

type에 해당하는 사운드가 있으면 재생하고, 파티클이 있으면 방출하고, options에 shake가 있으면 화면을 흔듭니다. 이렇게 구조화하면 어떤 장점이 있을까요?

첫째, 코드가 깔끔해집니다. collectCoin 함수를 보세요.

이전에는 사운드 재생, 파티클 방출을 각각 호출했지만, 이제는 this.feedback.play('coin', coin.x, coin.y) 한 줄이면 됩니다. 둘째, 수정이 쉬워집니다.

코인 소리 볼륨을 바꾸고 싶다면? FeedbackManager 초기화 부분 한 곳만 수정하면 됩니다.

모든 코인 수집에 동일하게 적용됩니다. 셋째, 재사용이 가능합니다.

이 FeedbackManager 클래스를 다른 프로젝트에 복사해서 사용할 수 있습니다. 사운드와 파티클만 새로 등록하면 바로 동작합니다.

실무에서는 이런 매니저 패턴을 많이 사용합니다. AudioManager, ParticleManager, UIManager 등 각 역할별로 매니저를 만들어 관리합니다.

코드가 체계적으로 정리되어 팀 작업 시에도 혼란이 줄어듭니다. 주의할 점은 과도한 추상화입니다.

작은 프로젝트에서 너무 복잡한 매니저 시스템을 만들면 오히려 개발 속도가 느려집니다. 프로젝트 규모에 맞게 적절히 구조화하는 것이 중요합니다.

김개발 씨는 FeedbackManager를 만들고 모든 효과를 이전했습니다. 코드가 훨씬 깔끔해졌고, 새로운 효과를 추가하는 것도 쉬워졌습니다.

"이게 바로 구조화의 힘이구나!" 김개발 씨는 또 한 단계 성장했습니다.

실전 팁

💡 - 프로젝트 규모에 맞게 적절한 수준으로 구조화하세요

• 매니저 클래스는 한 가지 역할만 담당하도록 설계하세요
• 설정값은 상수로 분리하면 나중에 밸런스 조절이 쉬워집니다

---

이상으로 학습을 마칩니다. 위 내용을 직접 코드로 작성해보면서 익혀보세요!