We’ve tweaked some of the graphics and effects to work better in high-resolution, fixed some bugs with Achievements and the UI, and also made the character SFX more distinct. The response to the update has been very positive, with a great article by TouchArcade yesterday summarizing the changes. We’ve also started a sale – Beast Boxing 3D is now available at $0.99 to celebrate the update, so if you haven’t bought it yet, now’s a great opportunity!
Developing GUI for mobile apps in Unity3D is one of the harder issues to solve in a satisfactory manner. Drawing from my own experience, the main problems with the built-in GUI system (as of 3.4.1) are:
- Excessive draw calls, more of a problem for earlier devices
- Draws excessive processing power when using GUI, even worse with GUILayout
- Built-in text rendering system is quite limited, difficult to customize
- Not all controls work well out-of-the-box for mobile touch interfaces
To combat this, a variety of approaches have been created, most of which address some subset of the above problems. This blog post in particular will be about a free, relatively new solution called UIToolkit, created by prolific Unity tools developer Prime31, and posted on Github for the community to collaborate around. It’s not the only one, nor the most mature, but it’s been gaining popularity recently and improving significantly since it first launched. I am a contributor to the project, and have mostly worked on text rendering features and fixes.
Many of the various 3rd-party GUI solutions use texture atlases, or sprite sheets to combine multiple textures into one, and that allows for draw calls to be consolidated. Since the draw call budget is pretty limited in early devices, this was one of the biggest reasons to use 3rd-party GUI, but nowadays is less of a problem. In-game GUI still requires high performance, and the overhead of calling GUI, or GUILayout are just too big to overlook even on today’s high-powered phones.
UIToolkit works extremely well with freemium texture atlas generation software called TexturePacker, by Andreas Loew. TexturePacker can automatically fit and combine multiple GUI elements onto the same texture, and export the metadata in a format that is compatible with UIToolkit. Since UIToolkit also allows for automatic switching between 1x/2x textures, which you can get in TexturePacker by changing the scale from 1.0 to 0.5 prior to export. The one caveat is that you’ll need to ensure that your 2x filenames don’t include the “@” symbol, which is unfortunately a different standard than the iOS automatic switching. However, if you’re familiar with 2D game dev with Cocos2d, you might already have TexturePacker, and you’ll be happy to know that you can continue using this great tool for GUI with UIToolkit.
There are a couple of tips I’d offer to Unity devs trying out TexturePacker for the first time:
- Under texture format, just leave this at PNG. You’ll have to reset the texture import settings in Unity after you import it anyway.
- Since UIToolkit requires “2x” appended to the filename instead of “@2x”, you can’t use the SD option in TexturePacker. Instead, I save my file as “…2x”, and anytime I need to re-export, I delete the “2x”, then export at 0.5 scale manually.
- Inner padding of 2 can help eliminate bleed between textures.
- Imported font bitmaps can be confusing because of the extra layer of indirection. The bitmap textures for both SD and 2x sizes MUST have the same filename, so store them in different directories. The exported texture atlases from TP then have different names, and the Angelcode font files should have “2x” appended to HD exported font bitmaps as well.
To address font usage, you can also export bitmap fonts in the Angelcode format, store the bitmap textures in a texture atlas through TexturePacker, and then render out enhanced font glyphs with whatever features you’d like. To get gradients, outlines, and drop shadows easily, I’d also recommend looking into commercial software called Glyph Designer. It does a great job, and is pretty affordable.
UIToolkit is free and frequently improving. The author of TexturePacker also offers free licenses to bloggers if you email him, which is actually how I came about having my own licensed copy.
Beast Boxing 3D is our first-person boxing game with awesome character design, fun, lightweight RPG elements, an entertaining story with a twist, and (new in 1.2!) an Endless mode to keep the challenge going! Here are some of our best reviews so far: “You’ve got an iPhone, you gotta get this…” 9.5 / 10 – Scott @ G4 TV Canada’s Reviews on the Run!
“With great use of touch controls, an amusing storyline, and wonderfully illustrated beasts, Beast Boxing 3D is a K.O.” – Macworld
“Beast Boxing 3D is exactly the kind of boxing game I’ve been waiting for. ” – TouchArcade
I just learned today that there is a bug in Beast Boxing v1.2 that will prevent accurate syncing of the “Mad Skills” achievement to Game Center for winning Beast Boxing 3D on Hardcore difficulty mode. When a fix goes in, I will do my best to ensure that profiles who have this achievement locally will sync properly to Game Center without having to re-beat the game. It’s hard enough the first time! Thanks to Mark Simpson for reporting the problem.
UPDATE – This bug has been fixed! The free update is now available for download on the App Store.
Beast Boxing 3D version 1.2 got released today and is On Sale for 33% off ($1.99) for the holidays! Here's a quick list of updates:
- Brand new Endless mode improves replayability with GameCenter Leaderboards
- Two new hilarious holiday-themed opponents available in Rematch mode, along with a new arena (see the attached screenshot). That brings the total to 11 opponents and 5 arenas!
- More responsive and quicker controls
- Four awesome brand new arena music tracks from Last Cannon developer Shadi Muklashy!
- Loads of visual and performance improvements, along with some minor bugfixes The 1.2 update feels better than ever, and we hope you'll take a look and see how you like the latest additions!
Beast Boxing 3D is on sale for $1.99, or 33% off, for the holidays! It’s holiday season, and we’re celebrating and giving thanks for an awesome month and a half since we launched the game. We’ve been hard at work the entire time building more content and addressing customer feedback and suggestions for the game. Last week, I had to sneak a little time away from my beautiful honeymoon in Hawaii to get in some last-minute content and upload version 1.2 for review.
The 1.2 update has several awesome improvements in store for you Beast Boxers out there. First off, to give people some more stuff to do aside from the story mode, there’s a new Endless mode. We added two holiday-themed beastly fighters and a brand new fighting arena that will be available in Rematch mode and Endless mode. We tightened up the responsiveness of the controls – it doesn’t read your mind yet, but it does improve on the speed you’re able to chain attacks and blocks together, and it feels great! Oh, and we’ve got four brand new music tracks from multi-talented developer Shadi Muklashy! The update’s in review now and should be available as a free update in a matter of days. We can’t wait to share it with you!
Apple just approved our first update to Beast Boxing 3D this morning. Here’s what’s Included:
- Improved performance
- Reduced memory footprint that should help address some of the crash issues that users have been reporting
- Streamlined savegame UI
- Fixed tap-to-select problems on scrolling menus.
- A new icon!
Download it and enjoy! Next up is a new character and also the first challenge mode for players who finish the career story…
So you’re all done with your game (or nearly done!) and it’s time to show off all of your hard work! Just like with creating games, spending the time on making a polished trailer can be a great use of your time, but it can also feel like flailing about in the dark if you don’t know what you’re doing!
Luckily, I just went through this experience so you don’t have to! In this post, I’ll describe a general process that you can apply to make trailers of your game that communicate well and look semi-professional. You can also refer to my earlier post about creating Unity iPhone Trailers on a Budget to see the technical how-to that will let you capture your game with clarity for Youtube or other distribution methods.
Step 1. Understand your Appeal
This might seem obvious, but it’s easy to get mired in the technical details of trailer creation without considering what you want to communicate in the first place! So start with the basics. Open your text editor and answer the following questions:
- What are the 2 or 3 coolest short/quick visual features of my game?
- What sets my game apart from other look-alikes?
- What is the most common action that occurs in the game?
- What are the things that occur at the boundaries of levels in the game? (like story dialogue or intro/outro scenes)
- What is the most interesting special effect in my game?
- List 10-15 places/levels/characters in the game that exhibit one of the above characteristics, but are audiovisually distinct (or as distinct as possible). This is your scene list.
Step 2: Create a crude storyboard
From the scene list, order each of those listed “scenes” in a way that avoids direct repetition of things that look similar to one another. Don’t worry about exact composition – this is your time to try and mentally visualize the color or tone of your trailer so that it doesn’t feel repetitive.
Try your best to use some of these rules of thumb:
- Take the 2 most visually interesting things in your list and place them 1/3 and 2/3 of the way through your trailer. This creates space and provides peak excitement spread out.
- If you were able to find things that occur at the boundaries of levels, place them at the front and back of each third (or each half) of the trailer.
- If you have 2 scenes that share the same art or audio content, put them at least 2 scenes apart from one another.
Step 4. Start recording content
This part is easy – take your scene list, and use your vidcap software of choice to record LOTS of video of each of those scenes. Make sure to demonstrate a good amount of your functionality, and try to have action sequences that flow smoothly instead of taking actions slowly. For the most visually interesting things, record 4 instances (preferably with variety) for later use.
Step 5. Editing
Now you’ve got to fire up your video editor of choice. I use iMovie because it’s very affordable! Now, for each of the types of scenes I listed, you can try some of these approaches and see how they work for you:
- Start with a company / publisher logo, and end with the title of the game and the URL of your website.
- For really visually interesting scenes, cut up your 4 instances so that they hop between visually distinct styles and repetitively show the same thing. Your cuts should be really short for these – play with the start and end points and don’t use any transitions to get a punchy, rhythmic feel.
- In between those, use your more common scenes. These can last 3-4 seconds in length, which gives a break in the rhythm for your viewers.
- Use transitions only between action scenes and buffer scenes. Use cross and fade transitions but stay away from Wipe or other fancy transitions unless the scene you’re going to is scrolling, as it looks kind of home video-ish. When cutting between action scenes, just cut directly without a transition.
- If your character has actions that they go through, try placing the start of your clip at the first or second frame of the action taking place. Leaving space beforehand leads to a jerky feel when transitioning, and going with the first or second frame can feel more natural and give the sensation of action.
- Make sure you include unique or special features – if you can’t find a good place for them, try putting them at the end right before the final scene.
If you get lost, a great way to get restarted is to watch a trailer in the same game genre that gets you excited and try to discern its structure, then use it as a template.
Step 6: Publish!
The last step is just to publish! If you use Youtube, make sure to take advantage of linking to your promo website in your description, and use Annotations accordingly to have your viewers subscribe for future videos. If you followed this far, you obviously care about providing a good experience for your users, and that’s the most important thing! Keep on working hard, and good luck!
We’re finally live with Beast Boxing 3D! Get it on the App Store here! It’s been a long time coming, but we’re excited to get Beast Boxing in everyone’s hands, and to commemorate that, we’re releasing this background poster image from the game for your home screen.