Introduction to the SpriteKit Scene Editor

Creating a Dark Vibe using SKLightNodes

A game called Fear the Dead needs a spooky feel and so far it’s not very spooky. Change this by adding a SKLightNode to the player.

Because lights are nodes, you can move them or set them to perform actions. This means that if you add a light node to the player, it’ll follow the player around as it moves through the level – just the effect needed here.

The light node itself is invisible except for the effects you configure on the sprite nodes to interact with them.

Ah-ha!!! So that’s why I’ve had you setting the light, shadow cast and shadowed masks on all sprites throughout this tutorial. Each property has a different effect:

• Light Mask: The sprite is illuminated by the light with specular, diffuse and ambient lighting.
• Shadow Cast Mask: Whenever a sprite intersects with a light, a shadow projects past the sprite.
• Shadowed Mask: If the sprite is inside a shadow cast by a light, and the sprite has a lower z position than the light, the shadow affects how the sprite is lit.

Time to light it up!

In GameScene.sks, locate the Light object from the Object Library and drop it on top of the player sprite’s torch. Next, change the light’s Parent to player and change its Falloff to 2.

The Falloff denotes the exponent for the rate of decay of the light source, so the higher the number, the spookier and darker the level.

One more thing before you’re done: The outside of the level is still a very non-spooky gray color. To fix this, select the scene in the scene hierarchy, and change its Color to Black.

Note: At the time of writing, the iOS Simulator is having a hard time running the game without lag after implementing the light. I’d suggest running it on a device, where it shouldn’t cause any problems, or simply disable the light while you build your level.

Build and run the game, and as you move the player, the light will follow him and cast shadows as it moves.

Note: Xcode 8.3 crashes when SKLightNodes are used on top of Metal (i.e. when you run the game on a device). To overcome this until a further Xcode update, the starter project runs on top of OpenGL. To accomplish this, in Info.plist there is a key PrefersOpenGL set to to YES. You can test to see if the project runs on Metal in future updates by deleting this key.

Normal maps

One of the clever techniques in computer graphics is faking detailed textures by using normal maps. A normal indicates the perpendicular from a surface. This means that if you have a flat plane, the surface normal would point straight up from the plane. By indicating what the normal is at a certain pixel, you can manipulate how that pixel is lit.

Normal maps are RGB images, where red corresponds to the x value of the normal, green to y and blue to z.

Here is the background texture with a normal map. The lit result is on the right. You can see that the texture now appears bumpy and much more interesting.

The scene editor can automatically generate normal maps, so this effect is really easy to do. In GameScene.sks, select background in the scene hierarchy and change these Normal Map properties:

• Smoothness: 0.2
• Contrast: 0.2

Feel free to experiment with the Smoothness and Contrast values to make the cobbles more or less bumpy.

Note: In Xcode 8.3, the normal map value resets, and the normal map is created from the sprite’s own texture. In this case that is the desired effect.

That’s it! Now you’ve created a terrifying place where zombies run wild. Build and run the game, and you should see the following:

Where To Go From Here?

Congratulations! You’ve made it to the end of this tutorial and have now built a complete level for Fear the Dead. You have learned a ton of cool new features that you’ll be able to implement in your own projects going forward. You can download the final project here.

One of the best ways to make sure you remember what you’ve learned is to apply it in practice. For that reason, you should try and create another level or maybe even build your own game full of increasingly challenging levels.

We love seeing what you guys come up with, so make sure to share your creations in the comments below or on the forums.

If you want to learn more about SpriteKit, you should check out our book 2D iOS & tvOS Games by Tutorials. In this book we’ll teach you everything you need to know to make great games for iOS & tvOS – from physics, to tile maps, to particle systems, and even how to make your games “juicy” with polish and special effects.

Enjoy playing your new game; I look forward to hearing from you with comments below or questions on the forums. :]