Archive for July, 2013

AS3 Starling Tower Defense Tutorial – Part 6 – Towers

This entry is part 6 of 11 in the series AS3 Starling Tower Defense Tutorial

After five long code-heavy tutorials, we finally arrive at the most central of components to the Tower Defense (TD) genre: Towers! Towers are crucial in your TD game. Now, by “towers” I don’t necessarily mean some phallic, stone structure jutting into the sky that rains death upon enemies nearby. “Towers” here could be any unit, object, creature, etc that the player can place on the map, that can impede the enemies from reaching their destination. Some games may have actual tower structures, some games may have army guys with bazookas, some games may have a house or spawning structure you place nearby and the player’s units spawn from there to stop enemies. The tower is the primary mechanic that empowers players with a way to experience strategy, tactics, accomplishment, and fun (not an exhaustive list of nouns!). That said, unfortunately I really don’t do the tower justice in this demo. If you’ve played the demo, you’ve seen that my two Towers are simply a blue and a red box. The enemies are animated and much much prettier than the towers. Hell, even the bullets have some particles with them and are prettier than the towers. Anyways, here’s the point. I showed you last time how I created the Enemy animations. You could do the exact same thing for Towers and have yourself some pretty animated towers with different states “reloading”, “firing”, etc. Before we start, feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket **Update 8/1/13 – abstracted out Tower’s enemy-finding strategy to a ITowerStrategy.as and TowerStrategyNearest.as. Also added some commentary on design patterns. Ok, like the previous […]

Read More…
FacebookTwitterGoogle+Share

AS3 Starling Tower Defense Tutorial – Part 5 – Enemies

This entry is part 5 of 11 in the series AS3 Starling Tower Defense Tutorial

It’s finally time to get into the good stuff!  In this post we’ll be looking at enemies and how they get set up, run through, and knocked down. We’ll look at how I’ve created some JSON metadata in the map JSON file to set up the types of enemies the map will contain, the sounds to use for those enemies, the different enemy groups that can be in a single wave, how those groups are defined, and how individual enemies are created inside those groups. Let’s take a quick high-level view at how I’ve structured my data and my classes. We’ll get to the actual JSON in a sec. Before you start, feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket JSON Data Structure I’m going to hit EnemyWaves first, since the other two relate more to each other. Enemy Wave data here doesn’t pertain to an actual class file in the project, but it is used by the classes as a sort of map/hash set. For example, when the user starts the game and the first wave tile at the bottom of the screen “spawns”, that wave tile has an id of “wave1”. So the EnemyManager class will go through and say, “Ok, ‘wave1’ needs to spawn, which groups should I use?” 1 2 3 4 { "id": "wave1", "groups":"group1", }, When ‘wave1’ spawns, the EnemyManager will check those “groups” which correspond to the ids of the EnemyGroups below. So ‘wave1’ spawns and EnemyManager goes to find EnemyGroup id ‘group1’ and tells it to begin spawning. An EnemyGroup is a collection of Enemy classes (and subclasses) that […]

Read More…

AS3 Starling Tower Defense Tutorial – Part 4 – Map Tiling

This entry is part 4 of 11 in the series AS3 Starling Tower Defense Tutorial

Map Tiling in AS3 was the first post of my short-lived AS3 Game Engine series before I found Starling. While the core tile drawing code remains mostly the same, there have been some changes. We saw from yesterday’s post that the Play State creates an instance of the Map class and passes it the map JSON data Object. Let’s take a look at the JSON file that holds the map data, then we’ll look at the Map class and see what it does. Feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket I’m not sure if I’ve mentioned this yet, but I am using TexturePacker to create my spritesheets/tilesheets (is there a difference? semantics?). TexturePacker makes creating these tilesheets stupid easy and quick. If you can save your png images into a folder, and if you can remember that folder so you can find that very same folder again… you can make tilesheets using TexturePacker. They have tons of tutorials for using the app, and Lee Brimlow makes a three-part excellent spritesheet/basics-of-blitting tutorials over at GotoAndLearn (part1, part2, part3) Map JSON Data We’re going to look at the map data from the second map I made. Here’s a screenshot of the map actually in the game, all drawn out, tile-by-tile. These are all tiles I made out of 24×24 tiles in Photoshop. Here’s a sample of the tiles that are in my tile sheet. This has clearly been enlarged and is a little pixelated, but it’s 24×24 pixel art, there’s really not a whole lot of room for smooth lines. This image is here to show that I’ve […]

Read More…

AS3 Starling Tower Defense Tutorial – Part 3 – Play State and Config

This entry is part 3 of 11 in the series AS3 Starling Tower Defense Tutorial

Last post we got into the various game States that I use in my AS3 Starling Tower Defense game demo. I left out Play because it’s pretty big and needed some cleaning up. Now I’ve got it all cleaned up and ready to go! Also, I had intended this post to get into Map Tiling at the end, but this ran long and I wanted to show the Config file since that’s used in so many places. So Map Tiling will come later. This is the Play State and my Config class. Quick note… I’ve removed all of the doc blocks from functions to conserve space here… Comment your code! Also, feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket Play.as The Play State (com.zf.states.Play.as) is the main point of the game. It’s the State where a map gets drawn, enemies spawn, towers get placed, and the player hopefully has a great time. After a player has selected a map from the MapSelect State, we know the map ID they chose and the MapLoad state actually loads in the map JSON file and gets it ready for Play to do something with it. Play is also the creator and maintainer of most all of the “Manager” classes used in the game. We’ll start off with the constructor and the addedToStage functions. Since this is such an important class, I included pretty much everything here. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 […]

Read More…

AS3 Starling Tower Defense Tutorial – Part 2 – Game States

This entry is part 2 of 11 in the series AS3 Starling Tower Defense Tutorial

In my previous post on External Loading using LoaderMax in Starling, I began going through the first State of the game, the GameLoad State. This post will go through each game state in detail as to why it’s there and what it does. Also, I show off and talk about a few UI components that I’ve created as they come up in the various States. Before you start, feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket **Updated 8/9/2013 – added the Upgrade State So, the following game states can currently be found in the com/zf/states/ folder: GameLoad – the very first state! This is in charge of loading all of the initial assets and sounds and was outlined in the previous post GameOver – this state provides post-battle/map feedback to players. Did they win? Lose? How many enemies did they kill? etc… MapLoad – this state is in charge of loading map-specific assets which I’ll cover later MapSelect – this state displays whatever “Map/Level Select” info, it also holds the Upgrades button to take you to the Upgrades State (when finished) Menu – this state is your main Title/Menu type state. It’s the first screen the player gets to after the main game loads Play – this state holds the actual action. It’s the biggest and most complex of the states. Test – this is just a dummy state I created when I wanted just a blank IZFState Sprite to load to. It provides a quick way to jump straight to an empty screen so you can test UI components by themselves without having to go all […]

Read More…

AS3 Starling Tower Defense Tutorial – Part 1 – External File Loading

This entry is part 1 of 11 in the series AS3 Starling Tower Defense Tutorial

I’ve finally finished (well… 95%) with my AS3 Starling Game Engine Demo so I can finally start writing tutorials on how you can create a Tower Defense (TD) style game using Starling. Since I have so much info planned, and there’s so much code, and I’m a developer, and I think there’s a vast lack of intermediate/advanced AS3 tutorials on the web, this will probably not be the best tutorial series if you are a beginning coder. None of this stuff is incredibly complex or “expert” or anything, but I’ll probably skip over a lot of the very basics with AS3 in general and Starling in specific. Before you start, feel free to check out the finished product of my AS3 Starling TD Demo. You can also find all of the code used in srcview. Or you can download the whole project zipped up. Or check out the repo on Bitbucket **Updated 8/9/13 added the ZFLoader.as class and commentary since I removed the old posts from my old engine series. If you’re a beginner, I would encourage you to use the resources I myself used to learn both AS3 (over the last 6ish years) and Starling (over the past 2 months): Lee Brimlow’s GotoAndLearn – hands-down one of the best sites that helped me learn AS3 way back. Starling’s Home – has links to tutorials, forums, docs, etc. Starling’s Forums Goals I really want this stressed heavily up front. I am not a designer. My photoshop skills extend about as far as T-Rex arms. I am a developer that loves to dabble in Photoshop. This does not make my dabbles “good.” My lady is the artsy designer type and has not had anything to do with this tutorial series or game demo except to mock my dropshadow/glow SKILLZ! The point […]

Read More…

Starling Demo Almost Ready

Hey guys, As of a few posts ago, I scrapped my by-hand blitting engine and decided to check out Starling. I’m happy to say that my little 2-map, 2-enemytype, 2-towertype demo is almost done. Tonight I was trying to finish up the map select screen, then I need to add JSON data for a second map, and I should have a tutorial up by early next week since I lose a day (thanks 4th of July) due to being social. It will be a full 2 level TD game. It will not be fun. It will not be balanced. But it will show a whole huge range of techniques and skills on how to develop a fully operational deathstar Game! I’ve spent quite a while converting what I had into a Starling TD game engine. I’ll save more of my specific critiques for the individual blogs, but, Starling is kindof an ass sometimes. I mean, it works well when it works well… but TouchEvents can GTFO. I hate that I had to use them. They’re horribly inefficient. I used AS3 Sockets as often as I could instead of Starling (or Flash) events. There’s a ridiculous amount of OOP packed in here with a touch of inheritance and a bit of composition… just enough hierarchy, where useful, to pass a compsci 200’s class. I possess the photoshop skills of a young walrus, so if you are a designer, feel free to scoff, point and laugh, and/or throw burritos in disgust, I have plenty of salsa. I have only the smallest amount of ego invested in the UI. When it comes to using this small little engine to make something bigger, then I’d care about the UI. But for me, photoshop is a time-suck playground. I have a great time in Photoshop, […]

Read More…