Intermediate Unity 3D for iOS: Part 1/3

This is a tutorial by Joshua Newnham, the founder of We Make Play, an independent studio crafting creative digital play for emerging platforms. Unity is arguably the most popular 3D game engine for iOS – and for many good reasons! Rapid development. Writing your game with Unity is far quicker than trying to write your […] By .

Leave a rating/review
Save for later
Share

This is a tutorial by Joshua Newnham, the founder of We Make Play, an independent studio crafting creative digital play for emerging platforms.

Unity is arguably the most popular 3D game engine for iOS – and for many good reasons!

  • Rapid development. Writing your game with Unity is far quicker than trying to write your own 3D engine, or than using lower level 3D frameworks.
  • Visual scene layout. Unity comes with a powerful 3D scene editor that you can use to design a huge part of your app – often without having to write code!
  • Cross platform. If you write your game with Unity, you can deploy it to iOS, Android, Windows, Mac, or even the web!
  • Easy to learn. Unity is far easier to learn than straight OpenGL or lower level frameworks. It’s friendly to beginners and is easy to get started!

We just released an epic three-part Beginning Unity 3D for iOS series, but if you’re itching to learn more, we’ve got you covered!

This time, you will create a simple but fun 3D basketball game called “Nothing but Net.” Along the way, you’ll cover the major concepts used in Unity and will be ready to create your own apps!

Some of this tutorial will be review, but you’ll learn a ton along the way since this game is much more complicated than the “Heroic Cube” game ;]

Note: This tutorial was made with Unity 3, so there may be some slight differences with Unity 4.

Shall we play a game? :]

Designing the App

As with any app, before you begin coding you should first determine what it is you’re making – and why! You should figure out your target audience, what your idea is and why it appeals to them, and what features the app should have.

Let’s give this a shot!

Introducing your target audience: Bryan!

Introducing your target audience: Bryan!

For this tutorial, let’s assume your target audience is a male between the ages of 12-35 – let’s call him Bryan. Bryan is:

  • a 33 year old Accountant
  • owns an iPhone
  • is interested in sports
  • is an office dweller with an average commute time of 20 min per day on public transport.

Like most smartphone users, Bryan’s iPhone is a regular form of entertainment during commuting, and in general, every spare moment when he is alone – and even sometimes when he’s bored at dinner, much to his wife’s annoyance!

Your goal will be to create something that offers Bryan a chance to escape for a few minutes during his day. You’ll create a very simple (but fun!) app with just a single and easy to learn mechanic. This way, it can be easily picked up and used in a noisy and disruptive environment, such as commuting.

As your target audience is males between the ages of 12-35, your theme for the game will be sport related. Mobile casual game play typically ranges between 4-8 minutes so aim for a complete gaming session — including loading and starting the game — to last 5 minutes.

So – you want a simple mechanic, and a quick sports-related game. How about shooting a basketball? Here’s a sketch of what it could look like:

Ah – you’re getting somewhere! Time to flesh out the functionality and components you will need!

Mechanic/Interaction:

  • Goal: score as many points as possible within the time limit
  • To throw the ball, the player taps and holds their finger on the screen. The longer their finger is held down the harder the ball will be thrown. Leaving it down too long will raise a foul.

Features:

  • Visually rich and engaging to attract the player
  • Simple support menu (overlay the game screen with the option to start the game)
  • Realistic physics to allow for rebounds
  • Increase the difficulty by moving the avatar around the court more frequently as time passes and the player gets more comfortable with the game).

Game assets and their features:

  • Environment
    • Hoop
    • Ring
    • Court
    • Skybox
  • Scoreboard
  • Avatar
    • Idle animation
    • Throw animation
    • Move animation
  • Hoop
  • Ring
  • Court
  • Skybox
  • Idle animation
  • Throw animation
  • Move animation

Okay, now that you have the basic design of the app down, it’s time to start creating! :]

Introducing Unity 3D

If you already have Unity, feel free to skip this section.

Otherwise, you need to download Unity before you can proceed! You can download a free trial at the Unity website. Simply run the installer, and you’ll be ready to start using Unity.

Unity is free for non-commercial use, but you do need to register it in order to use it for your projects — hence the Register button you will see on first use. Once Unity is launches, the AngryBots sample project will appear.

You want to start with a new project, so select File\New Project from the main menu and save it wherever you want. Don’t worry about selecting packages to import just now.

Your first time opening Unity (after having registered), you will probably see:

Unity Welcome Window

Note: The introductory videos and manuals listed here are helpful resources to check out after you finish going through this tutorial – they will give you a good overview of Unity and what it’s capable of. For a more comprehensive review, check out the official documentation at http://docs.unity3d.com/Documentation/Manual/LearningtheInterface.html.

Before you get started, have a quick look at Unity’s user interface, which will become the command center for all of your Unity projects! :]

The Unity Interface

Let’s do a quick review of the Unity Interface. If you’re already comfortable with this, feel free to skip to the next section.

Annotated Unity3D User Interface

Unity’s UI is made up of 5 individual panels, each tightly related, but giving you a different perspective of the project.

First, the Project panel provides you with an overview and quick access to all the assets of your game. “Assets” means any resources that your game will use, such as scripts, textures, sounds, and data files.

Note that some of the folder names that will appear in this panel are used for specific tasks. For instance, when using graphical elements for “Gizmos”, which are design time icons, you need to place them in a “Gizmo” folder so Unity knows where to search for them.

Second, the Hierarchy panel is a view of all assets that are in the current scene. This allows you to quickly select items without having to navigate through the 3D view or perform a multi-select. A quick tip — to get focus of a particular asset, hover your mouse over the item you want to focus on in the Scene panel and tap the ‘F’ key.

On to the Camera panel! This gives you the point of view of the camera(s) in the scene. Note the three toggle buttons at the top right. Maximize on Play maximizes the window when you select Play. Stats is handy when you are ready to optimize your app, as it will show you draw calls and other useful stats. Gizmos allows you to show and hide specific Gizmos in the game scene.

The panel above the Camera panel is where you’ll spend most of your time designing your levels. This is the Scene panel which allows you to visually design your level. If you’re familiar with 3D modeling tools, then you should feel pretty comfortable here! :] If not, don’t fret — Unity is pretty intuitive and easy to learn.

The selected item, including the camera, can be manipulated using the manipulation tools at the top of the window:

The hand tool allows you to pan around the scene. The translation tool will show handles on the selected item, allowing you to move, or translate, the item around the scene. Rotation and scale allow you to manipulate the selected item by rotating or scaling it.

Note: It’s worth getting comfortable with the short-cuts to these tools. It’s pretty easy to remember them; they’re the first four letters on the keyboard and they correspond in order to the four tools: Q (Hand), W (Translate), E (Rotate), and R (Scale). Don’t forget your good friend F to focus in on the selected item — you will use F a lot! :]

A quick note about Scale: it’s best not to manually scale things unless you are using it for a visual effect. Scale your models via the import options, which you’ll get into shortly, and leave the scaling to 1.0. This ends up being a lot more efficient.

The final panel is the Inspector panel – this gives access to all the publicly accessible properties of the selected object. This is an important concept to understand so take some time explaining what this means.

All elements in your game inherit from GameObject. Different Components, which derive from a component called MonoBehaviour, are attached to each GameObject. These Components determine how the GameObject will behave in your scene.

Each one of these Components is visible via the Inspector panel where you can tweak their properties. Components vary widely, and can range from anything from a simple script that you write, to a camera, physic properties, and more. Essentially, a Component provides you with a flexible way to build up your game elements in a modular fashion. It’s worth noting that all GameObjects have a Transform component – the Transform component determines where the GameObject lives in 3D space.

Note: If you’re familiar with iOS development think of your GameObject as an NSObject. Rather than inheriting functionality, you attach specialized classes to the object – each gives it different functionality but they are bundled together as one unit.

Below is a screenshot of the Inspector panel when the camera is selected.

The components here include: Transform (attached to all GameObjects), Camera, GUILayer, Flare Layer, and Audio Listener. Don’t worry about what they mean yet – I just wanted to show an example of how you can see components on an object and configure its settings.

Along with the panels, Unity exposes a host of functionality via the toolbar. The two items you’ll be most interested in are the Game Object and Component items.

The Game Object menu item provides you with a list of items you can add to the current scene. The submenu items you’ll be interested in are Create Empty and Create Other -> GUI Texture. Create Empty places a new (empty) GameObject onto the scene. Create Other -> GUI Texture creates a GameObject with the GUITexture component attached and the currently selected texture as its texture, or the default Unity logo if a texture is not selected.

At this point, you have a basic understanding of the Unity interface. You’ll get a chance to start playing around with it in the next section, where you’ll start creating your Unity scene!