AR Madness — our open source ARKit game tutorial! Part Four — Sounds, Music and Explosions!

Welcome to part four of a remarkably long tutorial into how to make an awesome AR game!

• Part One — Game Design and First ARKit app
• Part Two — Building the Game
• Part Three — Collision Detection
• Part Four — Sounds, Music and Explosions!
• Part Five — Game Management

TL:DR

If you want to skip the tutorial and just get the code to run on your phone — get it here on Github.

In part four, we’re going to improve the game by adding some sound and visual effects.

Sounds, Music and Explosions!

We now should add some sounds effects, background music and an explosion effect when objects collide.

Sound first — add a new folder to your project directory called Sounds:

add by right-clicking and selecting New Group

In here, drag from your Mac these sound effects that you can obtain here:

To play these audio files we create a new function in ViewController.swift:

This takes in two parameters — “sound” and “format” i.e. you call the function like this:

playSound(sound: "explosion", format: "wav")

Note that we also created an instance of AVAudioPlayer:

var player: AVAudioPlayer?

Now we go back and change our fireMissile function to include sounds when the missiles are fired, add the code in bold:

case "banana":
   nodeDirection  = SCNVector3(direction.x*4,direction.y*4,direction.z*4)
node.physicsBody?.applyForce(nodeDirection, at: SCNVector3(0.1,0,0), asImpulse: true)
playSound(sound: "monkey", format: "mp3")
case "axe":
   nodeDirection  = SCNVector3(direction.x*4,direction.y*4,direction.z*4)
   node.physicsBody?.applyForce(SCNVector3(direction.x,direction.y,direction.z), at: SCNVector3(0,0,0.1), asImpulse: true)
playSound(sound: "rooster", format: "mp3")

WAIT!! Play a rooster sound when an axe is fired?!

It is called AR Madness!

And we couldn’t find and axe sounds!

Ok … also add this line in bold to the physicsWorld function:

playSound(sound: "explosion", format: "wav")
    }
} //end of function

Run the app again, fire some missiles and listen to the sounds!

What about some cool background music?

A bit of good background music makes all the difference in a game. Drag into the sounds folder the file “overtake.mp3” from here:

I obtained this from here and you must give the owner credit via a link if you use it, like I’m doing now!

Now, let’s add a playBackgroundMusic function:

Then, in viewDidLoad add these lines in bold to call it:

//add objects to shoot at
   addTargetNodes()
//play background music
   playBackgroundMusic()
}

Run the app again and listen to the awesome music! It starts slow but kicks in about 17 seconds in!

Now for the explosion

Effects like explosions in ARKit can be achieved via Particle Systems. First, create a new folder called Particles, and drag into it the two files “Explode.sncp” and “spark.png” from here:

Click on Explode.scnp and you’ll see something like this:

This is basically taking a small image “spark.png” and applying various animations to it, to create an explosion style effect. I’ve given you a finished particle system, but you could create a new one by right-clicking on the Particles folder, selecting New File, then selecting “SpriteKit Particle System File”:

After that, you could play around with the various settings and change the default effect, but this tutorial is long enough as it is so we’ll leave it for another day!

Ok, we have a particle system called “Explode”, let’s show it whenever there’s a collision between two objects.

Back in our physicsWorld function, add these lines in bold:

}
playSound(sound: "explosion", format: "wav")
let  explosion = SCNParticleSystem(named: "Explode", inDirectory: nil)
contact.nodeB.addParticleSystem(explosion!)
}
} //end of function

Run the app again and you should see something like this on a collision:

On a side note, it’s really hard to take a screenshot of a quick explosion!!!

And we’re done with Part Four of the Tutorial that Time Forgot

• Part One — Game Design and First ARKit app
• Part Two — Building the Game
• Part Three — Collision Detection
• Part Four — Sounds, Music and Explosions!
• Part Five — Game Management

If you find this useful, please feel free to hit that little clap button below, countless times, and also share if you’d like! Thanks, Andy