One of the most useful ways to use class extensions in game development is to extend the MovieClip class, and that’s just what we’re going to do now!

MovieClips are a built in class type, so you can add all sorts of custom functionality to them.

To start, open up a new Flash Movie and just make a circle about 100 pixels wide/tall.

Select the circle then press F8 to bring up the ‘convert to symbol’ panel. Call the symbol ‘ball’ and select ‘MovieClip’. Press the ‘Advanced’ button, then check ‘Export for ActionScript.

In the AS 2.0 class box, type ‘BouncingClip’ and hit OK.

If you test your movie now you will get an error: “The class or interface ‘BouncingClip’ could not be loaded.”

I guess we better create the class then.

Save your Flash Movie somewhere like C:\flash_tutorial\bouncing_ball.fla

Open up a new ActionScript File, and put the following code in:

class BouncingClip extends MovieClip {

var gravity:Number = 10;
var velocity:Number = 0;
var terminal_velocity:Number = 100;
var friction = 90;

function onEnterFrame()
{

this._y += this.velocity
if (this._y + (this._height/2) > Stage.height) {

this._y = Stage.height - (this._height/2);
this.velocity *= -(this.friction/100);

}

this.velocity += this.gravity;
if (this.velocity > this.terminal_velocity) {

this.velocity = this.terminal_velocity;

}

}

}

As you see in the first line, we are extending the MovieClip class. All of the properties of movieclip can be accessed by our new class, but for this example all we are using is _y. We can also override any of the built-in methods. In this case we are overriding onEnterFrame, the function that is called on every frame of a movieclip.

Looking at the code you have probably figured out that we are telling this movieclip to fall and bounce when it hits the bottom of the stage.

Save the file in the same folder as your FLA and call it BouncingClip.as (C:\flash_tutorial\BouncingClip.as in this example).

Now when you test your movie, your ball will bounce.

For shits and giggle, go ahead and drag some more balls from your library.. maybe scale them do different sizes…. put them at different heights on the stage… then test again.

All the balls just work with that one common class!

So now that you have extended the MovieClip Class, let’s kick things up a notch.

In your Flash Movie, make a new circle, preferable a different color. Select it and hit F8… do the whole instance name deal again… hit advanced… etc etc…

This time, make the ActionScript 2.0 class “FlyingClip”.

Save your file, then open a new ActionScript File.

In the AS file, put the following code:

class FlyingClip extends BouncingClip {

var propulsion:Number = 12;

function onEnterFrame()
{

if (Key.isDown(Key.SPACE)) {

this.velocity -= this.propulsion;

}

}

}

Now we are extending the BouncingClip class. This means FlyingClip will have the same properties (velocity, gravity etc..) as BouncingClip, and will have access to all the MovieClip properties as well.

In this class we are overriding the onEnterFrame function again. In this function we are having the ball’s velocity decrease when the space bar is pressed making it go up.

Test your movie… you will see the ball does go up when you press space, but that’s all it does. This is because we overwrote the onEnterFrame function. Fortunately, this doesn’t completely eliminate the onEnterFrame function from the BouncingClip class, we can still call that using ’super’.

If you update your code to look like:

class FlyingClip extends BouncingClip {

var propulsion:Number = 12;

function onEnterFrame()
{

if (Key.isDown(Key.SPACE)) {

this.velocity -= this.propulsion;

}
super.onEnterFrame();

}

}

Now we are telling the clip to run the onEnterFrame function from the super class (the class that this class is extending), BouncingClip.

Test your movie now, and the new ball will fly when you press space, and will fall and bounce when you let go.

As you can imagine, extending classes this way can be very useful for developing game sprites that share common functionality such as collision detection, hit points, etc…, while having the freedom to add custom AI and user input as needed.

So there is your primer on using AS2 classes. As you can see, they are very useful in expanding the functionality of Flash, keeping your work organized and avoiding redundant and bloated code in your timelines.

Here’s the sample files, Enjoy!

This time we’ll get into object based classes.

Object based classes are built the same way as any class. The main difference is in the way you declare and call their functions.

Here is an example of an object class:

class StopWatch {

var brand:String = ‘Timex’;
private var startTime:Number;
private var stopTime:Number;
private var displayTime:String;
private var memory:Number;

function StopWatch()
{

resetTimer();

}

function startTimer()
{

var date:Date = new Date();
if (!this.startTime and !this.stopTime) {

this.startTime = date.getTime();

} else if (this.stopTime) {

this.startTime = date.getTime()-this.memory;
this.stopTime = null;

}

}

function stopTimer()
{

if (!this.stopTime) {

var date:Date = new Date();
this.stopTime = date.getTime();
this.memory = this.stopTime-this.startTime;

}

}

function resetTimer()
{

this.displayTime = “00:00:00.00″;
this.startTime = null;
this.stopTime = null;

}

function readTimer()
{

var total_time:Number;

if (this.startTime) {

if (this.stopTime) {

total_time = this.stopTime - this.startTime;

} else {

var date:Date = new Date();
total_time = date.getTime() - this.startTime;

}
var seconds:Number = total_time/1000;
total_time = (total_time/1000)-seconds;

// round decimals to 2 places
seconds = Math.round(seconds*100)/100;

var minutes:Number = total_time%60;
total_time = (total_time-minutes)/60;

var hours:Number = total_time;

var secondparts:Array = String(seconds).split(”.”);
if (!secondparts[1]) {

secondparts[1] = “00″;

}

var s_seconds:String = formatNumber(secondparts[0])+”.”+formatNumber(secondparts[1]);
var s_minutes:String = formatNumber(minutes);
var s_hours:String = formatNumber(hours);

this.displayTime = s_hours+”:”+s_minutes+”:”+s_seconds;

}

return (this.displayTime);

}

private function formatNumber(number)
{

var string:String = String(number);
while (string.length < 2) {

string = ‘0′+string;

}
return(string);

}

}

This class is the brains of a stopwatch. If you save this into your classpath folder as StopWatch.as you can use it as an object on your timeline (or in other classes ).

Open up a new Flash Movie and put this code on your timeline:

watch = new StopWatch();

Now, anytime you use the variable ‘watch’ on this part of your movie, it will have all the methods and properties of your class.

To see what brand the watch is, run this code:

watch = new StopWatch();

trace(”my watch is a “+watch.brand);

At the start of the StopWatch class you see we have “var brand:String = ‘Timex’;”. Because we didn’t define it as a private var (yes, vars can be private just like functions!), we are able to access it from outside of the class.

The next few lines are our private vars. These keep track of all the timestamps the watch uses to get the nice readable display.

After our variable declarations, we have a function called StopWatch. This function has the same name as the class and it is called a constructor. Constructor functions automatically run whenever you make an instance of the class.

So, when we put “watch = new StopWatch();”, the StopWatch class runs the resetTimer() function, which sets the display time to “00:00:00.00″.

So we now have our var defs and our constructor, the rest of the class contains our methods. You will notice none of the functions have the word ’static’ in them.

Static functions could be thought of as global functions. No matter where in your movie you are, or what variable you are using, they run from the base class and will always behave the same.

Non-static functions are carbon copied for each instance. If you were to add “clock = new StopWatch();”, for example, it would be able to run without effecting any of the settings in ‘watch’.

Additionally, you can’t call non static functions directly through the class; StopWatch.startTimer() would do nothing.

So, lets try this code out on our timeline:

watch = new StopWatch();
trace(”I am starting my “+watch.brand+” watch”);
watch.startTimer();

Key.addListener(this);
onKeyDown = function() {

if (Key.getCode() == Key.SPACE) {

watch.stopTimer();
trace(”You stopped the watch at “+watch.readTimer());
trace(”restarting the timer…”);
watch.resetTimer();
watch.startTimer();

}

}

When you test your movie, an instance of the stopwatch class gets created, it tells you what brand the watch is, and it starts the timer.

When you hit space, the timer is stopped and you are told how much time has passed. Then the timer is reset and started again.

If we change the code to look like this:

watch = new StopWatch();
trace(”I am starting my “+watch.brand+” watch”);
watch.startTimer();

clock = new StopWatch();
trace(”I am starting my “+clock.brand+” clock”);
clock.startTimer();

Key.addListener(this);
onKeyDown = function() {

if (Key.getCode() == Key.SPACE) {

watch.stopTimer();
trace(”You stopped the watch at “+watch.readTimer());
trace(”restarting the watch…”);
watch.resetTimer();
watch.startTimer();

}

if (Key.getCode() == Key.SHIFT) {

clock.stopTimer();
trace(”You stopped the clock at “+clock.readTimer());
trace(”restarting the clock…”);
clock.resetTimer();
clock.startTimer();

}

}

Now we have the same setup, but we have added an instance of StopWatch called ‘clock’, and can control it with the SHIFT key. Testing this script will show you how object based classes use a common rule-set, but run independently.

Grab the sample file for this tutorial and you can see this class in a more practical application.

In the next lesson, we’ll get into extending classes!

Because of this intimidation factor, many of today’s most creative flash developers still work with ActionScript 1 and 2, coding everything on their timelines and in #include files, but with AS3 looming overhead, they are looking to get their feet wet in the pool of structured programming.

For me, if I hadn’t learned how to work with AS2 classes, AS3 would definitely be way over my head, so I thought I’d take a little trip back in time today and write a long overdue tutorial for my olschool homeboys out there that want to learn what classes are all about.

Before you learn how to make a class, I should probably explain what a class is. Essentially a class is a type of object that has properties and methods for handling some sort of functionality.

Some of you are just blinking at the screen saying “durr.. wut?” right now, so let me compare it to something you SHOULD be familiar with… a movieclip.

In Flash, MovieClips have properties (_x, _y, _width, etc…), and they have methods (play, stop, gotoAndPlay, gotoAndStop, etc…). Properties have a value you can look at and sometimes change, and methods preform some kind of action.

Classes are a lot like this, only you have to create all the properties and methods, define how they can be accessed, and handle how they return things.
So now you have an over simplified idea of what a class is, lets go ahead and make one.

Open up flash and start a new Actionscript File.

The class we are going to create is going to be called ‘Calculation’, so we need to define this by typing:

class Calculation {

}

Anyone who has ever made a decent flash game has probably had to use the pythagorean theorem at some point to figure out the distance between two movie clips or points. We are going to add a method to our class that handles this for us.

class Calculation {

public static function getDistance(obj1, obj2)
{

var x1:Number;
var x2:Number;
var y1:Number;
var y2:Number;if (typeof(obj1) == ‘movieclip’) {

x1 = obj1._x;
y1 = obj1._y;

} else {

x1 = obj1.x;
y1 = obj1.y;

}

if (typeof(obj2) == ‘movieclip’) {

x2 = obj2._x;
y2 = obj2._y;

} else {

x2 = obj2.x;
y2 = obj2.y;

}

var xd:Number = x1-x2;
var yd:Number = y1-y2;
var zd:Number = Math.sqrt((xd*xd)+(yd*yd));

return (zd);

}

}

You are probably familiar with how functions work, so for the most part this method should make sense to you. What you probably don’t quite follow yet is what ‘public static’ is needed for.

In class functions there are 2 levels of function access: Public and Private.
Public functions can be called from any actionscript, be it on your timeline or in another class

Private functions can only be called from inside the class itself.

There are also 2 methods of function use: object and static.

A static function can be used directly like a command, where an object function only works on an instance of a class (we’ll get into that later).

Inside this function you will also see lines like “var x1:Number;”.

In a class all variables need to be declared. This strict coding is one of the things that makes classes hard to learn for some people, but there are reasons for why this is necessary.

Classes are basically a set of rules and procedures that only need to be loaded once. In order for the one-time load to be effective, the rules need to be crystal clear and flash needs to know what variables the class will be using in any given function.

By simply typing “var x1″ we tell flash that this class will be using a variable called ‘x1′ inside the function. By adding “:Number” we are also telling flash that x1 will always be a number datatype.

You don’t need to assign a datatype to a variable, but if you know for certain it will always be a certain data type it’s a good practice to get into and it helps define the rules of your class for faster performance.

If you don’t know how the value of a variable is going to be set, it’s a good idea to define them at the start of the function. In this example, we don’t know if we are pulling from a movieclip or a point object, so I pre-declared x1, x2, y1 and y2.

Once I do get those variables set, you will see I declare xd, yd and zd while giving them a value. I call this declaring on the fly, and I did it this way because those equations will ALWAYS be how these vars are set.

Finally, at the end of the function we return ‘zd’ wich is our distance value. Whenever you use a return statement the function will always end no matter how much code you have typed afterward.

So there we have it, our first class. So how the fuck do we use it?

First we need to save the file as ‘Calculation.as’ (and yes it’s case sensitive). The name of the file must be an exact match for the class name. For this tutorial we will save this as “C:\flash_tutorial\Calculation.as” (but you can use any folder you want).

To use the class, open a new Flash Movie, and on frame 1, add the following code:

import flash.geom.Point;
point1 = new Point(0,0);
point2 = new Point(100,100);
pointDistance = Calculation.getDistance(point1, point2);

trace(”the distance between the 2 points is “+pointDistance);

We are using the bundled point class to compare 2 points, but you could also pass in two instance names for 2 movieclips and it would pass the distance between their _x/_y values.

If you test your new movie without saving it, you will get an ‘undefined’ value for pointDistance. This is because flash can’t find your class.

Save the .fla file to “C:\flash_tutorial\test_class.fla” (or whatever folder you saved your class to).

Now when you test it, you will get “the distance between the 2 points is 141.42135623731″ in your output window.

When you type “Calculation.getDistance” in your script, flash knows you do not have an object or movieclip called Calculation, so it looks first in the working folder for Calculation.as, and if it finds it, it automatically includes it.

If it can’t find the file in the working folder, it moves on to the global folders. By default this is: C:\Documents and Settings\{USER}\Local Settings\Application Data\Macromedia\Flash 8\en\Configuration\Classes

That’s a rather deep location to be saving your work to. Fortunately Flash lets you add custom class paths.

In Flash, click Edit->Preferences, then select ActionScript from the category list. Press the ActionScript 2.0 Settings button at the bottom of the panel and hit the + button to add a class path. Type “C:\AS2 Classes” and hit OK.

Now you can make a folder called “AS2 Classes” on your C: drive, and move Calculation.as to the new folder.

Now, no matter what flash movie you are working in, you will be able to use the new class. You never have to type out code for the pythagorean theorem again!

Okay, so let’s open Calculation.as back up and add in another function:

class Calculation {

public static function getDistance(obj1, obj2)
{

var x1:Number;
var x2:Number;
var y1:Number;
var y2:Number;if (typeof(obj1) == ‘movieclip’) {

x1 = obj1._x;
y1 = obj1._y;

} else {

x1 = obj1.x;
y1 = obj1.y;

}

if (typeof(obj2) == ‘movieclip’) {

x2 = obj2._x;
y2 = obj2._y;

} else {

x2 = obj2.x;
y2 = obj2.y;

}

var xd:Number = x1-x2;
var yd:Number = y1-y2;
var zd:Number = Math.sqrt((xd*xd)+(yd*yd));

return (zd);

}

public static function getAngle(obj1, obj2)
{

var x1:Number;
var x2:Number;
var y1:Number;
var y2:Number;

if (typeof(obj1) == ‘movieclip’) {

x1 = obj1._x;
y1 = obj1._y;

} else {

x1 = obj1.x;
y1 = obj1.y;

}

if (typeof(obj2) == ‘movieclip’) {

x2 = obj2._x;
y2 = obj2._y;

} else {

x2 = obj2.x;
y2 = obj2.y;

}

var radians:Number = Math.atan2(y2-y1, x2-x1);
var degrees:Number = radians * 180/Math.PI;

return(degrees);

}

}

Now we have a method for figuring out the angle that 2 items are at from each other. You can see the basic function structure and declarations are the same. You can also see the chunk of code I am using to set x1, x2, y1 and y2 is the same.

For that matter, the methods to look at obj1 and obj2 and determine if they are movieclips or not is also the same.

Redundant code like this is rather inefficient, so we are going to make a new function to handle that routine and clean our code up a bit.

class Calculation {

public static function getDistance(obj1, obj2):Number
{

var firstItem:Object = getCoords(obj1);
var secondItem:Object = getCoords(obj2);

var xd:Number = firstItem.x-secondItem.x;
var yd:Number = firstItem.y-secondItem.y;
var zd:Number = Math.sqrt((xd*xd)+(yd*yd));

return (zd);

}

public static function getAngle(obj1,obj2):Number
{

var firstItem:Object = getCoords(obj1);
var secondItem:Object = getCoords(obj2);

var radians:Number = Math.atan2(secondItem.y-firstItem.y, secondItem.x-firstItem.x);
var degrees:Number = radians * 180/Math.PI;

return(degrees);

}

private static function getCoords(obj):Object
{

var coords:Object = new Object();

if (typeof(obj) == ‘movieclip’) {

coords.x = obj._x;
coords.y = obj._y;

} else {

coords.x = obj.x;
coords.y = obj.y;

}

return(coords);

}

}

First thing you should notice in our new getCoords function is that is is a PRIVATE function. If you try calling Calculation.getCoords() from your timeline, you will get an error. This function is only going to be used by this class.

Now our code is clean and efficient and, in a round-about way, we have added new commands to Flash. We can use Calculation.getDistance() and Calculation.getAngle() in any movie we want without ever having to type those bits of code again!

Congratulations, you have taken the first step into the land of writing classes. In the next tutorial I will talk about object classes. Before you go, feel free to download the samples that go with this tutorial!

It’s only been a day and a half since implementing this change, but I already feel more energy, and the food I’ve been eating is pretty frikken good. I’ve decided to track my progress here on my blog, and share any of the recipes I come up with during this transition.

First, let me share a little health history with you.

Back when I worked 40 hours a week at Best Buy, I was on my feet all day, walking all over the place, lifting a lot of home entertainment equipment and what not. I was a lean 160lbs and didn’t realize how good of shape I was actually in.

Fast forward 5 years of sitting on my ass in front of a computer all day and not lifting anything heavier than a pen for most of the day and you find a man who’s metabolism has ground to a halt and finds himself with an unwanted 50lb spare tire.

I tried going to the gym on a regular basis, and even succeeded for almost a year, but with a family of 4 and a kid in school that ended up conflicting too much with my work and meal schedule. Not to mention, the gut didn’t want to go away at all.

I’ve done plenty of reading here and there on ways to get rid of unwanted fat and get back to being healthy and energetic, but most of the recommendations involved a drastic diet change and quite frankly, I wasn’t willing to give up the foods I enjoy.

Last week, I was reading again and stumbled across mealsmatter.com. My wife had recently brought home one of them fad diets and I was mostly curious to look up what a balanced nutritional diet looked like compared to this magical fat burning diet.

Mealsmatter.com is a pretty nice community of nutrition conscious people, and they have a pretty big database of recipes and such, but they also have advice on how to improve your health through better eating. As I read through their recommendations, the concept of calorie counting clicked with me for the first time (I knew too many calories were bad, but didn’t realize how many EXTRAS there are in most food). I decided to use the food journal they have available on their site just to get an idea of what I was putting into my body, and what I was lacking.

After a week, I found I was packing in at LEAST 2500 calories a day (with the help of the calorie search on calorieking.com)… often getting up to 3500+. Considering I don’t get much physical exercise these days, it’s pretty amazing I’m not morbidly obese right now.

And yet, even knowing this, I still refuse to give up the food I enjoy… so I wasn’t sure how to tackle the situation.

Friday night, we went to the mall and ended up in Borders looking to get some fiction books and such just for entertainment purposes. On the best sellers rack, a little yellow book caught my eye, so I picked it up. The book was titled “Eat This, Not That” and the premise was making smart choices and substituting certain foods for other foods that are comparable in flavor, but less healthy.

The book is a pretty cool reference for people who eat out a lot. You can flip to any restaurant and get 3 or 4 reccomendations of things on the menu that won’t bomb your gut too bad, and a list of things that probably shouldn’t even be called food.

The book also touched on a lot of suggestions that mealsmatter.com had, and listed a bunch of foods you should try and eat every day. It was then that the gears started rolling in my mind.

I’ve always been a pretty good cook. I have this uncanny ability to eat any food, then go home and recreate the flavor with household ingredients. How hard could it be to use healthy, low-calorie/low-sodium ingredients to re-invent the same foods I enjoy?

And so yesterday it began…. We went to the grocery store, looked at the nutrition facts on all the foods we normally buy, then looked for ‘low fat’, ‘all natural’ and ‘no salt added’ variations of these items. It took some time looking through all the food, but the pattern I saw was if you could get anything that’s ‘all natural’ or ‘no salt added’, you were cutting calorie levels in half or more.

We bought a bunch of pork and beef, but went for leaner sirloin and fillet cuts rather than fatty ribeyes and such. Leaner meat has more nutrition per oz, and fewer calories and fats, but it does cost a bit more. Of course, to keep on track, we will only be eating 6oz portions instead of the massive slabs we used to eat, so we probably ended up spending less money that way.

So now it’s a day later… and I made my first attempt at healthier cooking by coming up with an alternative recipe for spaghetti sauce last night, and whipped off a damn tasty sandwich condiment today.

I can’t help but notice the effects already, and I’m feeling more motivated than ever to forge on!

Keep an eye on the ‘lifestyle’ and ‘recipe’ sections here and I’ll keep dumping the things I come up with.

1 lb Lean Ground Beef

2 Cans of ‘no salt added’ diced tomatoes

1/2 Tbsp garlic salt

1/2 Tbsp Italian seasoning

1/3 Cup Spinach

1/4 Cup chopped red bell pepper

Calories: 48 per 1/2 cup serving

Throw the beef into a deep frying pan and brown it up. When it’s cooked, drain the grease out of it and put it back in the pan.

Throw everything else into a blender and mash it up. (If you like your sauce a bit chunky, only put 1 can of tomatoes in when you blend it, then put the rest in whole.)

Pour your pureed goodness into the pan with your meat and simmer it until it starts to bubble. The longer you cook it, the thicker it gets, that’s all up to you.

The sauce will be almost brown… that’s normal, it still tastes fine!

You can throw it on any cooked pasta for a pretty easy meal, or you can add 2/3 cup of water, put it in a slow cooker and cook 1 lb of pasta right in the sauce for a few hours for a full flavored dish.

Feel free to sub the beef with ground turkey, sliced chicken breast (or whatever the hell else you can think of) if it’s low in fat and all that jazz…

This sauce isn’t much lower in calories than some store brands, but you are getting WAY less salt, and a healthy dose of spinnach, wich is full of nutrition, antioxidents and has shown to help prvent cancer…. your prostate will thank you when you’re older.

1/4 Cup Spinnach

1/4 Plain Yogurt

1 Tbsp Dale’s Roasted Tomato Dressing (gives it a bit more kick)
OR
2 Tsp red wine vinnegar (gives it a slight tanginess)

3/4 Cup Dry-curd cottage cheese

Mix that shit up in a blender and you will get about 1/2 cup of cool creamy green sauce. It’s not the prettiest thing to eat, but if you slap it on a sandwich you won’t even see it anyway.

The flavor is somewhere between mayo and sour creme making it a great sandwich spread, potato topper and party dip.

Add vinnegar in 1/2 tsp increments if you want to get it tasting more like mayo or miracle whip.

Throw in some chopped boiled egg whites and you can even use this sum’bitch for a healthier egg salad substitute.

I realize I type-ramble in this article and some of the concepts are probably way over people’s heads who haven’t tried doing multiplayer games yet, so here’s the basic point of this post. We are making a kick-ass multiplayer server and will be providing affordable hosting services for people who want to do some cool multiplayer games. Because we want to make something developers will enjoy using, I’m hoping to get some discussion going. Ask questions about what we are doing… let us know what features you want… etc….

End Edit */

Any followers of my work, probably already know I have been working with my partner, Brendon, on developing a developer-driven multiuser communication system.

Our proof of concept server has been done for a while now, and has addressed several issues that are lacking in commercial servers like SmartFox, ranging from good multi-room support, and efficient packet management.

While version 1 of the server has had a good run, it’s also a bit of a frankenstein. It started nearly 3 years ago with simple features, and as we flushed out what we expected from a good communication server, we kept adding more and more until a monster was born.

With any monster, you get awesome power, and a lot of unpredictable results. Version 1 was no different. Random bugs, memory leaks and poor management tools have made it a bit of a hassle to work with, in spite the superior feature set.

With the version 1 features designed and tested, we realized we still had a lot more room for improvement, and some of our concepts still needed to be fleshed out better, and so we have started work on Version 2.

Sanguine Server is being designed with 2 goals. The server itself is being designed to be superior to any other socket server currently available, and the platform as a whole is being designed as an affordable solution for independent developers who may not have the resources to verge into the realm of multi-user applications and games otherwise.

Developers who have played with solutions like SmartFox Server and Electroserver are probably familiar with the limitations of xml-based communication systems. The packets are large, use a lot of bandwidth, and take more time to transmit and process. These kinds of systems make it difficult to self host while keeping within your monthly bandwidth quota. While we certainly have more bandwidth at our disposal than many other developer, that is still an issue that looms over our work.

Sangune Server 2 will use a combination of JSON serialization and command/variable indexing to compress commands as low as possible, and allow for even further compression using custom strings for higher frequency events. These options should make it possible to develop fast, high-speed multi-user applications that use minimal bandwidth.

The feature set of the server will provide a level of flexibility unseen by other solutions. Developers will have top level namespaces for each application they plug in to the system with fully configurable options, ranging from admin/moderation access control, to limiting command access and building custom event subscriptions and command filters.

You will be able to communicate with any user in the namespace, regardless of what area they are in, you will be able to receive real-time updates on other users and areas by subscribing to their events, and be able to stop these subscriptions at will.

You will be able to configure a variety of variables for users and areas and not be limited to simple numbers and strings. We will support unlimited array and object trees and provide a familiar dot syntax format for utilizing these variables.

You will also be able to define any number of custom parameters on users, areas and variables that can be used for custom retrievals and filtering out unneccesary variables and parameters.

The system will be treated as a hosted service with a variety of need-based plans, hopefully starting as low as $5 a month and going up from there. Each server plan will allow you to use a custom, secure gateway to authenticate users from your own website, and send information to custom scripts for full site integration.

Our security model protects you from other developers using insecure applications as each developer is limited to their own sandbox and all have unique security keys. Additional security is added by locking all commands until a user is identified, and using unique sessions and RC4 encryption.

To make our platform even better, we also will provide a flash API that handles all the communication logic and data serialization. Not only that, but extended classes will be available for more advanced techniques, and sample files will be provided that not only teach you how to use the platform, but how to use it efficiently to get the most out of your account.

If that’s not enough, we are also exploring the ability to create server-side clients for things like game hosts and chat bots using javascript. These clients would be able to add additional power to your applications by offloading certain duties from the user clients and performing functions to sync your applications and enforce rules. This option is being explored on the premise that we will be able to police these scripts for cpu usage and infinite loops, and be able to terminate them without any effects on other users.

Because I am a flash developer, I feel I have a certain insight into what features and functionality this platform should have, because these are things I want to be able to do so I don’t have to hack my own programming to fake things. I also know that just because I don’t think of something, doesn’t mean there is no demand for it. With that in mind, Sanguine Server 2 will be completely open for developer discussion, and we will be constructing it in a modular fashion to allow for server extentions should the need arise for them.

If these are common requests, we will expand the server to meet the need. For more specific extentions we will also provide development services for anyone who wants to pay for more custom expansion on their account.

we hope to provide a solution unlike anything available, and any thoughts you readers may have are certainly welcomed. I know my ramblings are probably over some of your heads, so if you would like anything explained a little better, I’d be happy to do that as well.

I’m fully aware that there are some great solutions to this problem, but they may be a bit more than what people need, so I decided to whip off a very simple solution that can be used by entry-level programmers, or people with no programming background at all.

In order for this to work you will need to contain your actual animations in a movieclip. This is typically preferable to scenes anyway, so most animators probably do this anyway.

In this movie clip, create a new layer for the camera control. Now all you need to do is download simple_camera.fla and grab the MovieclipCameraControl object from the library and paste it into the new layer of your movie.

Now, whenever you make a new keyframe and re-position the camera reticle, your movie will automatically pan itself until the camera is centered, or the edge of your scene reaches the edge of the stage.

If you are interested in how it works, read on.

Unlike more robust class-based solutions, this uses actionscript contained in a movieclip for simple drag and drop functionality.

Inside of this clip, the code looks like this:

First thing that happens in this script is I jump to a blank frame. You may be asking why I don’t just set the _alpha value to 0 to hide it. We’ll get to that in a minute.

Next I run getBounds on the scene clip so I will know where all the edges are and can prevent the camera from panning beyond them.

getBounds returns an object with the values xMin, xMax, yMin, yMax in relation to whatever target you specify. In this script I only need the relation within the scene itself since I will be comparing them to the _x/_y position of the scene as those values change.

Once I have this information set, I put in a default panSpeed value. this is a percentage value and the camera will move this % of the distance from the current focus, to the desired focus on each frame. 100% would simple auto focus without any panning, while 1% would pan very slowly.

The guts of the camera are in an enterFrame loop.

First you will notice I an grabbing the _x/_y data and putting in in x and y rather than just using _x and _y throughout the script.

This ties in to why I didn’t set _alpha to 0. Once you use actionscript to change any movieclip property, that movieclip will ignore any positional changes you make on the timeline and only be moveable with actionscript. Because this is designed to be used by non-programmers, I had to make sure it would work by reading the x/y data based on where the animator places the camera in any given keyframe.

Now that I have the x/y data captured, i compare it to the screen boundaries and adjust them if they are going to allow the camera to show beyond the scene edges.

The next step is to compare the relative position of the camera and scene to see how far away it is from being centered on the main stage. This gives me a distance value for x and y, wich I then use to calculate an overall distance.

Using this overall distance I can check to see if there is at least a half pixel of space to adjust to. Any less than that and the viewer won’t even notice the adjustment, and sometimes will actually see some jitter.

If the distance is enough to warrant a screen shift, we calculate the speed to move the scene based on the overall distance and panSpeed setting. We then get the % of the overall distance that it needs to move horizontally and vertically, and multiply that by the speed we calculated.

This will make the camera pan in a straight line to the new target, rather than having it move on independant x and y axis’. If we didn’t do this, you would see it pan in one direction and stop, while the other direction keeps going, and would lose the natural flow of the camera.

Once all these calculations are done, we simply move the scene and the process repeats as needed.

That’s all there is to it.

Back in June I was noticing a serious decrease in my site traffic. The games I had been working on were built mostly for Newgrounds and while I was compensated for my time, the lack up updates had started to hurt the site. I knew I not only needed to get something new up and ready, but I also had to rethink the direction of PsychoGoldfish.com. Obversity was kind of the starting point for it all.

Previously I had just made pretty site layouts with minimal attention to my market. I wasn’t making games for anyone in particular and I wasn’t getting stuff out on a regular basis.

I spent hours on Alexa and Google running searched for “online games”, “free games”, “web games” and tons of variations in search terms, comparing the top results on Alexa to see who was maximizing their traffic the best. After a lot of research I knew the direction I needed to go was to appeal to the casual game market. This meant making polished games with simple gameplay that could be played for short periods and still be satisfying enough to be playable for longer bits.

Puzzle games were doing VERY well. People were still buzzing about stables like Zuma and Bejeweled, and I knew I had it in me to make something that was just as fun.

The trick with puzzle games is they are all so similar. How do you make something original in such a saturated market? As much as I hated the idea of using a crutch… I knew I needed a gimmick.

And so I thought about what kind of gimmick I could use, and I came up with the idea of flipping tiles. While the gimmick seemed to have potential, the gameplay I first hammered out wasn’t all that fun. You would flip a tile and if the new color made a chain of 3 or more tiles it would blow them up.

In theory it was a good idea, but I noticed the game was far too hard and I didn’t feel like I had very much control as I played it. I did love the way the flipping tiles looked so I kept the core gimmick and built an idea around it.

Looking at the first version as a player rather than a programmer, I knew I wanted more control. The solution was so obvious that I felt extremely dumb for not thinking of it in the first place. Why not let the player flip any tile, any number of times, and then have the option to detonate the color chain, or just flip some more. What I ended up with was a tile that basically had a button in the corner to flip, and if you clicked the main larger area of the tile it would try and detonate a color chain, assuming you had 3 of the same colors adjacent to each other.

The gameplay was perfect. I hadn’t yet polished the scripting, but it was presentable enough that I showed it to a bunch of people ranging from other flash developers, to online friends that don’t even know how to OPEN flash.

The results were pretty unanimous, people thought it was a ton of fun, even with all the bugs.

One of the people was Stamper, who liked it so much he offered to do some kick ass art for the game. He spent a few days making tiles and showed me some samples.

In my original tile, there were no real ‘buttons’ on the tiles, rather if you clicked a tab in the corner it would flip, and if you clicked anywhere else it would detonate. While it worked, it was a bit frustrating when you accidentally detonated a tile and you meant to flip it.

Stamper’s tile designs had actual buttons on the tile for flipping and detonating, with a bit of un-clickable space between them. His tile designs looked great and were a lot more practical than my originals.

Then, as it tends to do, the real world stuck it’s foot in and Stamper found himself so busy with work that he didn’t have the time to finish his tiles. The project sat in limbo for a bit and we weren’t sure when we’d get back to it.

I am not the kind of guy who likes to waste time, especially when the fate of my site was hanging in the balance. But rather than launching Obversity the way it was, I took some elements and some scripting and put my mind to making another game.

I knew I had a great, original idea with Obversity, and I knew I probably wouldn’t be able to get anything quite as original done in the short timeline I imposed on myself. What I did next was take a look at a few of the most popular puzzle games of the time. They all seemed to have a simple control scene; users could swap 2 tiles and if the colors matched when you flipped them, they would blow up.

Well, that type of game surely was simple enough to code in a day or 2, but I didn’t think a simple bejeweled clone had any potential. I needed a new gimmick, but one that I could use with the tried and true control scheme of tile swapping. I started thinking about what I could match. Colors… numbers… shapes…. no matter what it was still going to look like a ripoff matching game.

Then it hit me like a brick… there is a game EVERYONE knows how to play, and it’s not about matching.

Rock Paper Scissors.

When I applied that gimmick to the game, suddenly the rules changed. Flipping a tile wouldn’t make any of the tiles you flip explode because they wouldn’t match anything, rather, they would explode whatever symbol they ‘beat’ by traditional RPS rules.

With the introduction of this simple gimmick, the whole idea of a bejeweled clone completely changed and the game became very original.

As I started playing with it I knew simply using RPS symbols was going to make this game way too easy. I noticed the real challenge wasn’t in clearing blocks, rather, it was in building big combos.

In a lot of puzzle games building a large combo sometimes gave you a powerup so I opted to make the tiles become “chargeable” by getting a large combo. The charged tiles would take out a full row if you were able to make them explode, and this made room to add obstacles to the game in the form of blank tiles.

With the blank tiles, you would start to see your screen fill with useless blocks and your chances to blow up tiles would begin to lower. Obviously at some point the blank tiles would ruin the game, so the ‘charged’ tiles became the perfect solution for the player to clear those pesky blocks.

Once I got all these gameplay elements in, I played it some more. Even with blank tiles dropping in as I cleared blocks, it was way too easy. It took a VERY long time for enough blank blocks to drop in that they became imposing, and once they started it almost got too hard, too fast.

I tried starting the game with a lot of blank blocks, which made it challenging, but I thought it would ruin the enjoyability of the game for new players. I needed a way to make the game’s challenge progress at a more consistent rate.

As I though of options, I also realized there was no sense of urgency. I remember playing tertis back in the day, and when the blocks would get higher I would be so intense and it just sucked my soul into the game. How could I add that kind of intensity in a game that didn’t really have a way to ‘die’

The answer was pretty easy: I needed to have a goal, and I needed to have a time limit.

By introducing a goal, I had a simple way to add ‘levels’. every time you would reach the goal, you would start a fresh level which would have more and more blank tiles in it, and the time limit would start to become smaller.

The gameplay was awesome, especially considering I only spent a week and a half on it. I showed the demo around as I was doing some final debugging and people really liked it, I even picked up a sponsorship.

So after tightening it up I launched the game and awaited the results.

People on Newgrounds didn’t vote it very high, the reviews were pretty mixed, and all in all it did okay. It seemed like it was ranking as just an average game. Then I started looking at the scoreboards and saw something interesting. Female names. I had tapped into something, and my logs were showing that in spite the reviews and votes, the game was actually pretty popular, just not popular with the same people I usually was.

While RPS Blockade wasn’t a breakout hit, and it didn’t get my site traffic back up, it DID show that my research about the casual gaming audience was pretty accurate. And so I redesigned PsychoGoldfish.com as I began my next game: Mini-Putt Online.

Mini-Putt was a franchise I knew I couldn’t really lose with. It had always ranked well, and I also knew it was the kind of casual game people that liked RPS would enjoy. I had been working on multiplayer stuff for a long time and it was the perfect platform to merge my goals with my aspirations.

Thanks to the research I put in when starting Obversity, the new site was a hit and I saved my traffic levels from obscurity.

Then real life attacked again. Ad rates hit an all-time low, and never really picked up. After all my work to fix my traffic and expand my audience, I was still barely making end’s meet.

When you need money, and you got a family, you do what you gotta so. And I started picking up some side jobs for extra cash. Thankfully the work I put into my site was enough for it to sustain itself, but I was pretty bummed that I had to,once again, cut into my production time.

Now, I am starting to get a bit of time. It’s not much, but I decided to use it wisely. I dusted off obversity and took a look at it with fresh eyes. Stamper was no longer able to work on it, so I started from the bottom up. Using his ideas I redesigned the tiles myself to use the flip and detonate buttons and began coding a sprite demo that would do the dynamic coloring and show the tile flipping.

I spent 2 days just making them look the way I wanted. They didn’t look quite as bright and traditional as my original designs, but they did feel like little bomb detonators now, and more importantly, the were a lot easier to control.

I am currently working on the re-scripting of Obversity, making tile chains blow up, and having the top tiles drop into place. I hope to have the game done in a week or 2 at most, but I am also focusing on getting some other site projects running with the goal of generating some extra revenue within a year.

]]> http://www.joshtuttle.com/10/obversity-and-rps-blockade-making-the-game-and-changing-the-focus/feed/ http://www.joshtuttle.com/8/introduction-to-game-design-the-pg-way/ http://www.joshtuttle.com/8/introduction-to-game-design-the-pg-way/#comments Thu, 16 Nov 2006 18:54:24 +0000 Josh Game Design http://www.joshtuttle.com/8/introduction-to-game-design-the-pg-way/ This article isn’t going to teach you how to make a game.
It won’t hold any super-duper scripting tricks.
What I want to cover is the basic thought and planning process I use to design a game.

Now in all honesty, I am FAR from traditional in my work habits. I juggle more designs then I am actually capable of building, I drink while I work and I cut a lot of corners. But I do have some traditional habits that I think are always good to abide by.

First and foremost is the idea.

If you don’t have a good idea for a game, you won’t get very far. And an idea isn’t “I’m going to make a platform game.” An idea is more like, “I am going to make a platform game where you can destroy EVERYTHING in a level.”

Deciding on a genre is definitely a good place to start fleshing out an idea, but if you limit it to that you won’t end up with anything special. A clone of an existing game at best, a boring game at worst.

Hold on a second? Aren’t I the guy who has made a living cloning popular games?

Yes, at first glance, it appears I have a few games that are just clones of oldschool games, but that isn’t why people actually enjoy playing them.

Let’s take Ravage as an example.

At first glance, Ravage appears to be a rehash of Rampage. Was my idea for the game to simply clone Rampage? While rampage was the obvious starting point, my idea was to make a game where you could take on an entire solar system and see several unique landscapes and races. I wanted to make it play like rampage, but feel like a game where you were also exploring as you progress. And I wanted to make a game with a number of levels that was unheard of at the time.

Because of the idea behind Ravage and the similarities to Rampage it attracted fans of the old game, and new fans who didn’t have any sentimental attachment to the classic arcade game.

With all that said, Ravage is a rather dated flash game nowadays and perhaps not the best example of originality, but I felt the point of cloning needed to be addressed.

While using an existing game as the basis of your idea isn’t necessarily bad, it can also become too much of a crutch.

Other things that can become crutches are 3D effects, physics engines, shapeflag hitTests and yes, pretty art.

These are all things that make the game LOOK really hot, and add more realism to the visual presentation, but if there’s no substance to it you lose a lot of playability.

If you have kept up with the trends n flash games you will notice there are a lot of these crutch games that feel very gimmicky, and while the first few times you see these gimmicks they are impressive, especially at the technical level, they do not really make a fun game.

Do not take that as discouragement from using those elements, just remember not to base your entire game on them without adding some substance.

Think of these ‘crutches’ as building blocks. If you just slap on some paint, en the end all you have is a pretty block. If you add more blocks, the initial idea can be prominent, but also have a much more rewarding form.

Pick an audience

While it is always possible to make that one game that transcends boundaries and is appealing to everyone, it is always good to consider a specific audience.

When I make a game, I try to make a game I would like to play. Then I think about people I know, and what they would find appealing. Usually I get a set audience in mind, even if I can’t really put a label on them.

Mini-Putt was designed for what I like to call, the ‘casual gamer’. You can play it for 10 minutes, or you can play for hours. Anyone can play it, but it’s far from “hardcore”.

Knowing that I was making this game for a specific audience not only helped with the overall design of the game, but also helped in the post release period when I would filter through the reviews.

No matter how good your game is, half of the reviews are going to be bad. What I look for is the substance. Did the review touch on any of my goals for the game, and was the reviewer in my initial audience choice? If the answer is no and the review is bad, I pretty much ignore it. Those people would hate the game regardless of any trivial changes I made, it’s not in their area of preference.
Sometimes I am pleased to find great reviews from people who don’t usually fit into my target audience and that’s always a sign I made a great game.

Many times I hear from my peers and they are upset that their creations are getting bad reviews. This is because they didn’t have an audience in mind when they started. After the game launches, they inevitably tap into a specific group of people, but they often fail to realize that is the group they should be looking to for support and constructive criticism.

Know how much time you want to spend on your game

On of the biggest mistakes I’ve made in a lot of projects was not setting any goal for a time line. I always figured, I have all the time in the world to do this, so I can just get to it whenever.

I experienced a few notable results from that line of thinking. I would wait so long to get beyond the concepting stage that I would just lose interest. IF I ever decided to go back to the idea, I usually had learned a lot of new tricks, or a new version of Flash was out and I found myself starting over from scratch. Sometimes I would have these great ideas just sitting in limbo and because I never set a time line to work by, somebody else came up with the same idea and DID produce on it.

Nothing makes me more angry at myself then seeing an idea that someone else had getting acclaim and knowing that it could have been me.

Sometimes when you sit down and think about a time line for your idea, you will realize it may be too big for your current goals. If you are not in the position where you can spend 4 months on a game, write down your idea and store it away. With any luck you will find the time later, or your skills will grow to the point you can do it in less time.

If you know you can do the game in a time line that is within your ability, you can start looking at benchmarks.

To collab or not to collab, that is the question

One of the most difficult decisions to make is whether or not to collaborate with an artist or programmer. The obvious pros is it’ll cut your work-load in half, and you will potentially get done in far less time. The cons to collabs is you end up basing your work on other people’s timetables. If you decide to collab, don’t be afraid to take a bit of a management role and ask for frequent updates. Sure you may annoy the artist, but if they are THAT bothered by it, chances are it’s because they aren’t being very productive. If it gets so bad that they never want to work with you again, you are better off.

Make a list of benchmarks to guage your production time

While this starts getting into micromanaging yourself, it can be VERY helpful when you are working on a time line The key is knowing in advance how your game is going to work and being able to break it up into parts.

Depending on the game’s genre you may want to start with some visual planning. If you flush out your character sizes, level sizes etc before you really get coding, you will have far fewer adjustments to make later in your development.

If you are making the game yourself, there’s nothing wrong with just making boxes to fill the space used by sprites and tiles, but if you are working with an artist it is often helpful to sketch out a rough shape of the character, or have them provide you with some still art samples.

When you have your sizing planned out, your coding will go a lot smoother.

If this is a logical place to start, then set a date for yourself to have a final visual plan in effect.

For most people, the next logical step is to begin coding. Typically the coding starts with whatever element the player controls, be it a character or a series of tiles. This coding will involve any movement, animation display, interaction with the level, etc.

If you were making a platform game, you would probably want this step to include basic player movement and platform/wall collision. Set a date for when you want to get that done by.

Next is usually interaction with other elements, be it enemies, events, etc. In a platform game I would start coding in basic enemy properties and have it so they can be killed, do damage, etc. This may also involve flushing out the player sprite more to include attacks and reactions.

Again, set a date for this component.

And just keep setting dates for your benchmarks. Just remember to make time for testing and tweaking, especially if you have a real deadline, like a contest entry date or a contract date of some kind.

Save time: Reduce Reuse Recycle

This is where you start looking at efficiency and “corner cutting”. Efficiency is important because it not only keeps your files smaller, it keeps the render time in flash down as well. Reusing elements saves on additional work and keeps things optimized, and recycling saves a ton of time. The more time you can save, the more productive you can be. Just don’t cut TOO many corners.

What can you reduce? Do you have some code that’s really inefficient? Make a note of it and rewrite it as time permits. Do you have duplicate symbols in your library? Take some time and clean that up. Sound compression? VERY important to keep your sounds clipped up and compressed at a good rate, otherwise your file size gets huge, and the render time in flash is annoyingly long.

What can you re-use? Can you reuse symbols anywhere to save some bytes? Can you break up your code into class files that may be reused in future games?

What can you recycle? Do you have some explosion animations from an older game that would fit in nice? Sound effects that aren’t too obviously reused? If you got it, use it!

Account for possible mid-production ideas

A lot of time you will be making your game and you will think to yourself, “wouldn’t it be cool if the sprite did this when it landed” or “what if you could grab that.”

These ideas are the ones that make games great. They are the small touches that take your initial idea and allow it to blossom. I always try to plan my time line with the knowledge I will have additional ideas as I get into the game development. If you don’t make time for these ideas you will probably regret it later.

Leak some demos

I know a lot of people feel the need to be all crazy secretive with their games, but I find it helps a lot to leak a few demos here and there. You get feedback from people who aren’t your friends, and won’t sugar-coat their impressions. Granted you will get a lot of annoying comments on areas that aren’t finished, but if that’s the only complaint you hear, you know you are on track.

Leaking the demos can also get you a lot of pre-release hype, so when you finally do launch you may have a group of people ready to support your work and have a much more positive launch then you may otherwise have.

Show your peers, show people on a BBS you frequent, link your game in IRC, do whatever you can to get a decent sized test audience. They may have feedback and ideas you overlooked that can take your work up a notch.

DO NOT LET YOUR EGO PREVENT YOU FROM TAKING CRITICISM. The biggest gripe I have with a lot of artists is their ego is so big they honestly think their work is perfect and don’t take ANY criticism well. On occasion there are people who show me a demo. I make a suggestion and they tear me a new ass hole. And in a few of those cases they use my suggestion anyway which is doubly annoying.

When you get good ideas from people, the last thing you should do is lash out and get defensive. If it’s a bad idea, politely explain that you probably won’t use it, because that person may still have some valuable ideas later.

Isn’t using other people’s ideas stealing? Doesn’t it make the overall game partly theirs?

No, it’s not stealing. The idea is volunteered, and we aren’t working in a paranoid industry like TV or Movies where you get sued for using non-contracted ideas. As for making the game partly theirs…. I think that is a good thing. You should be making games for people to play, not to boost your own ego and self worth. So if you make it for ‘them’, they should feel like they have some small claim to it.

Polish makes perfect

One of the last things people do in their games is build menus and instruction pages. Nine times out of Ten these pages are informative, but are OBVIOUSLY thrown together last minute. You need to spend a bit of time on these screens. Polish them and any in-game HUDs and your game will feel more professional all the way through. You don’t need to be a good artist, just clever enough to set up appealing frames and use appropriate fonts. Sometimes a nice font is all it takes.

And so, there you have it. This is how I work. Is it the right way to work? Who knows, but it seems to be working pretty good for me. With a good amount of thought, I can get a decent idea into a final product in a month or two. And as I said earlier, I juggle a lot of things, so if I ever get THAT skill sorted I may even be faster than I think.

As far as all the ideas I’ve let go because they were too big, I am starting to revisit a lot of them because they no longer feel like monstrous challenges that I won’t have time for. I literally have a file drawer FULL of simple ideas, concept art, etc. I plan on leaking some of them on this very blog in the future if interest peaks up.

]]> http://www.joshtuttle.com/8/introduction-to-game-design-the-pg-way/feed/