The UI Assets

We'll again create our UI assets relative to some target resolution. Our game will be run in landscape mode, so we simply choose a target resolution of 480x320 pixels. The screens in Figure 12-4 already show all the elements we have in our UI: a logo, different menu items, a couple of buttons, and some text. For the text we'll reuse the font we used in Super Jumper. We've already done the compositing of all these things in previous games, and you've learned that putting them into a texture atlas can be rather beneficial for performance. So here is the texture atlas we'll use for Droid Invaders, containing all the UI elements as well as the font we'll use for all the screens in the game, shown in Figure 12-6.

Figure 12-6. The UI element atlas with buttons, the logo, and our font. It is stored in the file items.png, 512x512 pixels

It's essentially the same concept as we used in Super Jumper. We also have a background that will be rendered in all screens. Figure 12-7 shows the image.

Figure 12-7. The background, stored in background.jpg. 512x512 pixels

As you can see back in Figure 12-4, we'll only use the top-left region of this image to render a full frame (480x320 pixels).

That's all the UI elements we need. Let's look at our 3D models and their textures.

As I said in Chapter 11, this book can't possibly go into detail how to create 3D models with software like Wings3D. If you want to create your own models, you'll have to choose an application to work with and plow through some tutorials, often freely available on the net. For the models of Droid Invaders I used Wings3D and simply exported them to the OBJ format we can load with our framework. All models are composed of triangles only and have texture coordinates and normals. For some of them we don't need texture coordinates, but it doesn't hurt to have them.

The ship model and its texture are illustrated in Figure 12-8.

Figure 12-8. The ship model in Wings3D (ship.obj) and its texture (ship.png, 256x256 pixels)

The crucial thing is that the ship in Figure 12-8 does roughly have the "radius" we outlined in the previous section. We don't need to scale anything or transform sizes and positions from one coordinate system to the other. The ship's model is defined with the same units as its bounding sphere!

Was this article helpful?

0 0

Post a comment