Hello everyone! If you’re reading this, that means you haven’t given up on AS3GameTuts, despite my year-long hiatus. Thanks for your patience!
Today I’m going to start up a brand new tutorial series that I’m really excited about. How to make a top-down RPG shooter game! This tutorial is going to be slightly faster-paced than my previous tutorials. If you haven’t programmed before, I’d recommend starting with my Pong series, and then proceeding with the Platformer before you attempt this. We will be coding using AS3 in external .as files, instead of using the timeline.
What is a Top-Down RPG Shooter?
Personally, I think this is a pretty awesome game genre. I find these types of games to be genuinely fun to play.
In case you’re unfamiliar with the genre, let’s break it down:
Top-Down
Top-down refers to the perspective of the game. The world is seen from a bird’s-eye-view, and the player can move around horizontally and vertically. Prominent examples include early titles in the Legend of Zelda and Pokemon series. These games both use tile-based maps, which our game will not, for simplicity’s sake. Instead, we will draw each map individually, giving the game a more unique, hand-drawn look. (You are, of course, welcome to modify the game to use tiles, but I won’t be doing it in this tutorial.)
Our game won’t have a scrolling map. Instead, our map will be built from a series of screens that the player can walk through. When the player walks off one edge of the screen, the map will flip to the next screen.
Pokemon Ruby and Sapphire feature great tile-based top-down maps.
RPG
An RPG, or Role Playing Game, is often loosely-defined to describe games where you play as a character who can level-up or collect items to improve as you play. What will make our game an RPG? I plan to give our character EXP (experience points) when we kill enemies, and level up when we collect enough EXP. Depending on how long this tutorial series goes, I might also include power-up items and equipment, and perhaps a currency system.
The Legend of Zelda. A classic example of a top-down RPG.
Shooter
Shooter games are extremely popular. There is something inherently fun about aiming projectiles at enemies running around your screen. While “shooter” is a pretty broad category, including genres like the First Person Shooter, ours will be restricted to the top-down genre. We will move the player around the screen with the arrow keys, and use the mouse to aim and fire projectiles.
A perfect example of what we are trying to create is Robokill:
Robokill, an excellent top-down shooter.
Setting Up
Alright, I’m excited, and you should be too! Let’s get started!
I’m using Adobe Flash Professional CS6 to build this project. You can use any version of Flash Professional to make this. (You can also try building it with a free tool like FlashDevelop, but you’ll have to make some adjustments when I use the stage, timeline, and Movie Clips.)
Start by Creating a New Project, making sure to select AS3 as the programming language. Adjust the size of the stage to be 640px wide by 480px tall, and set your FPS to 60.
Create the Player
Start by drawing a main character for your game. Remember that we are using a top-down perspective. I made mine a 40×40 pixel circle, with a little personality.
This tough-guy is ready to take on some baddies!
Now convert your player to a Movie Clip Symbol, named Player (select all, then Modify –> Convert to Symbol). Make sure to center your Player using the little centered dot on the “Registration” option. In addition, in the Advanced options, check the box to “Export for ActionScript“, and give it the class: “Player“. Your options should look something like this:
Awesome! Your player should be all set now. You can remove it from your stage for now. We’ll add it again using code in the Main class.
Create the Main Document Class
Unlike my previous tutorials, we aren’t going to be writing our code on the timeline. Why? It is much easier for beginners to learn, but it isn’t best practice. Why? For larger projects, coding on the timeline can get pretty unorganized. It doesn’t take advantage of Object Oriented Programming (OOP), a pattern that people use when they code to do some pretty cool things, like reuse code, or have objects inherit properties from one-another. In order to do so, we need to write our code in external files rather than on the main timeline.
To start taking advantage of OOP, and to keep our project organized, we are going to make use of a Document Class. Every Flash project can have only one Document Class. This class is linked to the main project file, and its code is automatically executed when your project loads. You can think of it as a replacement for the code that would appear on the first frame of your timeline.
You can set the Document Class by typing a name into the “Class” text box on the Properties panel:
Set the Document Class to “Main” in the Properties panel.
Create a new Actionscript .as file (File –> New… –> ActionScript File). Now save this file as “Main.as” in the same folder as your Flash .fla file.
The file will probably start off completely blank.
You should add the following code to get things started:
package
{
import flash.display.Stage;
import flash.display.MovieClip;
import flash.events.Event;
public class Main extends MovieClip
{
public var player:Player;
public function Main():void
{
player = new Player(320, 240);
stage.addChild(player);
}
}
}
If you’ve never seen anything like this before, you should definitely check out my Platformer Tutorial on Shooting — I walk you through this basic code step-by-step.
You’ll notice that we declared a new variable called “player“, of type “Player“, which we then instantiate by passing in 320 and 240 as arguments. Finally, we add the player to the stage. Right now, this code won’t work. We haven’t created the Player class yet. Let’s do that now.
Create the Player Class
In the same way that you created the Main.as file, create a new AS3 file called “Player.as”. This class should already be linked to the player Movie Clip object we drew on the stage at the beginning of this tutorial.
Add this code to the file:
package
{
import flash.display.Stage;
import flash.display.MovieClip;
import flash.events.Event;
public class Player extends MovieClip
{
public function Player(X:int, Y:int):void
{
this.x = X;
this.y = Y;
}
}
}
This code doesn’t do anything too interesting. All it does is set the player’s position to two integers. Run your code and you should see something like this:
Get the Source Files here: https://www.box.com/s/5nkeyheudte4ehgb4ale
As always, I look forward to your comments, questions and suggestions.
It’s good to be back :-)
Ben
AS3 Game Tutorials 
Hey, welcome back, Ben.
I’m so happy you are able to make another tutorial.
I will off course still be on the forum, and I expect there will be more debugging for newbies for me in the future :D
To everyone who needs help: Best help is at the forum, here:
http://as3gametuts.forumatic.com/index.php
Hey Grambo! Thanks for all your help on the forum! Yup, I’m back. I’m working as a game developer at Gameloft this summer, but I hope to consistently put out new tutorials in this series. I just wrote Part 2, which is scheduled to be posted on May 30th! Stay tuned :-)
Welcome back!
Recently I had been looking for a tutorial along these lines and could not find much to help me, iv been through your other tuts in the past and I already know this will help me :)
Thanks so much! I hope you find the help you need in this tutorial.
Nice start to this tutorial. Glad you are making one that involves external actionscript.
I’m happy to be doing a project with external actionscript, too — it’s how I usually program. I’ve just been using the timeline to help beginner programmers :-)
Hooray! You’re finally making tutorials again! I’ve been looking for tutorials about programming in the document class, so this will be really helpful… I’ll be sure to follow along this entire series. Thanks again!
Hi Effsy! Thanks for your patience! I’ve been really busy this past year, but I hope to consistently publish tutorials in this series for the next few months. As always, I love to hear from my readers, so let me know if there’s anything you’d like to see.
Hooray! You’re finally back! I’ve been looking a for a tutorial on programming in the document class so I’ll be sure to follow along this entire series… Thanks again!
Thanks, Ben! I’ve been waiting on a new installment for awhile. It’s good to see you back. And awesomely enough, you’re doing a tutorial on the type of game I’m story boarding right now! Life is good. Welcome back, and thanks for your hard work.
Thanks Will! That’s awesome. Readers like you are the reason I keep coming back to the site to write more tutorials :-)
I love you so much..I knew you’d never give up on this blog. Thank you, thank you! You help me a lot!
Hi there! Thanks for not giving up on me, either :-) I’m really happy to help in any way I can.
Finally!!
I always check this website everyday for update and now…finally!
Please keep create more and more tutorials ! :D
Hey, just say thank you for this great help, I’m just getting started in the world of development and these tutorials are helping me a lot! thank you very much
Found your site in the last week, I’ve read all your tuts and they’re excellent. Good news that you’re back to make more tuts. Kudos for you and thanks for those awesome materials. I’m brazilian and I’m doing digital games as my course in the college, first semester and whenever I have a doubt I come here for help. :D
I’ve only just found your blog and I’m so happy I did and can’t wait to see the next update :D
Awesome, welcome back! Eagerly looking forward to this series as top down rpg shooters are a personal favorite and a ton of fun. Thank you for continuing your tutorials!
Hey I’ve been following your platformer tutorial! Looking forward to this one too!
I’ve been following your platformer tutorial and it’s just amazing! Thanks man. Look forward to this tutorial because it utilizes external as3 files (which increases the simplicity of the game)!
Oh thank you so much Ben Reynolds, i have been looking for a tutorial about Role Playing Game Flash AS3 for a long time, and you help me with this tutorial. I’m waiting for the next part. :)
Aha, I have been looking for the tutorial about this Role Playing Game with AS3 Flash, thank you Ben Reynolds, i am waiting for the next part. :)
I am new in as3, this tutorial is very helpful for me, you explain it so nicely, thanks for this tutorial
When i copy the main script into main.as, it comes up with this C:\Users\cottilo\Desktop\Game\Main.as, Line 13 1136: Incorrect number of arguments. Expected 0.
Line 13 is player = new Player(stage, 320, 240);
I didn’t change any of your scripts and followed it thoroughly from the start
Hi, when I tried the first part of the tutorial my character does not show up at the end was wondering if it was something I did with coding or if it was just I missed a step in changing the symbol to a movie clip?
I am new to flash and ActionScript and this is the best tutorial I could start with.
Thanks a ton :)
I am just moving from as2 to as3 and finding some changes a bit confusing so am going to follow this tut through.Thanks and welcome back.
Hey Ben good to see your back! Been a while! I know you said that this game wouldn’t be including a tutorial for scrolling or a tile based movement but do you think it would be possible to add that at a later date? Thanks!
[…] https://as3gametuts.com/2013/05/25/top-down-rpg-shooter-1/ […]
Thank You Ben Reynolds!!! Throu Your Tuts I´m starting to undersand AS3 (-: You wrote it so clearly. My brain is glad!
I’d like too see a top-down maze-type RPG game.
One that has only certain routes you can take & they lead out of the screen to different parts of the map.
[…] this tutorial in order to expand on another I have seen recently. This tutorial can be found here as3gametuts.com and will be needed in order to complete my […]