My latest game ~ $18/hour September 30, 2008
Posted by Mark in Making Money.3 comments
My latest game, Sheepster was just sponsored. I’m not allowed to say how much it was sponsored for, but I can say what I made per hour. I made $18 per hour making it, that’s with all of the costs deducted – so I did actually make that much. It’s cool to do something for yourself and make more per hour than you do at your real day job.
I spent about $250 to make it. That $250 went to hiring two different artists, and about $50 worth of sounds from Sound Rangers. I believe that you have to spend money to make money, and flash games are no exception.
Check out the game and let me know what you think:
AS3 Pathfinding Part 1: Understanding 2D Arrays August 27, 2008
Posted by Mark in Tutorials.Tags: 2d array, Actionscript 3.0, AS3, map, pathfinding, tile, two dimensional array
4 comments
This is going to be a 2 or possibly even 3 part series on path finding in AS3.0! It’s a topic almost everyone wants to understand, but there are far more who don’t than do. Hopefully this series will change that. This is what we’ll be creating via a 2D array (that’s being drawn from data in a 2D array, and it’s the foundation for pathfinding)!
Lets begin. Arrays are fairly simple, they are simply a list of things. For example, let’s create an array and add some things to it.
var myArray:Array = new Array();
myArray.push("Item 1", "Item 2", "Item 3");
trace(myArray); // Item 1, Item 2, Item 3
trace(myArray[0]); // Item 1 (Array[item number] lets you reference a specific item in an Array. 0 is the first item in the array.
That’s cool, you probably already knew that. Now, how do you make an array two dimensional? You make an Array of Arrays. If that didn’t confuse you, you’re weird (or just smarter than I am). Here’s how that works, instead of pushing “Item 1″, “Item 2″, and “Item 3″ into the array, you push Array1, Array2, Array3. Make sense? Good, but you still probably don’t know why you would ever want an array of arrays. I’m sure there are lots of uses for them, but what I’m going to talk about is 2D arrays give you the ability to create a tile based map. This tile based map is representing code, so that means each tile can have a value and based on that value it can decide if that tile is a wall, or a path, or anything else you might want it to be. For the sake of the tutorial (which will be leading into pathfinding in part 2, I’m just going to have walls and paths). Let’s say 1 = wall, and 0 = path. In the following example, myMap is the main array that all of the other arrays are added to. For this to work properly, you must first add a new array to myMap, and then add all of the other arrays (each level of the map) to that array. So it’s like this: myMap>newArray>All of the levels.
This will make the following more clear, row = x (horizontal) and column = y (vertical). You can access any single tile in the map array like this: myMap[0][X][0][Y]
var myMap:Array = new Array();
myMap.push(new Array());
var level1:Array = new Array([1,1,1,1,1]);
var level2:Array = new Array([1,0,0,0,1]);
var level3:Array = new Array([1,0,0,0,1]);
var level4:Array = new Array([1,0,0,0,1]);
var level5:Array = new Array([1,1,1,1,1]);
myMap[0].push(level1, level2, level3, level4, level5);
var wall:int = 1;
var path:int = 0;
var tileWidth:int = 20;
var tileHeight:int = 20;
var tileSpacing:int = 1;
for (var k in myMap[0]) //This will make the map loop through it's 5 levels or rows, so the following code will run 5 times, once for each row.
{
for (var i in myMap[0][k][0]) //This will make the map loop through each column, remember this is already in the loop that goes to each row, so at this point every tile in the map will be looped through.
{
var square:Shape = new Shape();
var squareMC:MovieClip = new MovieClip();
if (myMap[0][k][0][i] == path)
{
square.graphics.beginFill(0x9CD55E);
square.graphics.drawRect(0, 0, tileWidth, tileHeight);
square.graphics.endFill();
} else if (myMap[0][k][0][i] == wall)
{
square.graphics.beginFill(0x000000);
square.graphics.drawRect(0, 0, tileWidth, tileHeight);
square.graphics.endFill();
}
squareMC.addChild(square);
squareMC.x = (i * (tileWidth + tileSpacing + tileSpacing)) + tileSpacing;
squareMC.y = (k * (tileHeight + tileSpacing + tileSpacing)) + tileSpacing;
addChild(squareMC);
}
}
I know this seems confusing. I strongly encourage you to not just dismiss this as too complicated for you. Copy and paste that code into a new AS3.0 document and spend some time playing around with it until you understand it. That’s how you learn. It’s only 40 lines, you can do it.
AS3 TweenFilterLite for tweening filters, and it’s free August 26, 2008
Posted by Mark in Useful Tools.Tags: actionscript, AS3, flash, tween
2 comments
I was working on a project today where all of the menu items, content, and pretty much everything else is created dynamically. I wanted to apply some filters as some rollover effects. After playing around with Flash’s built in Animator class and not getting the results I wanted, I hit up google. Eventually I found this site: http://blog.greensock.com/tweenfilterliteas3/ a guy named Jack made this, and it’s simply wonderful. What it allows you to do is apply a filter to a display object over time, and it will tween gradually. It’s also very fast. If you’re looking for a way to add some great effects for rollovers or whatnot, I highly recommend checking this guy’s site out.
Advanced (but easy to use) 3D Flying Effect in AS3.0 August 25, 2008
Posted by Mark in Actionscript 3.0, Tutorials.Tags: 3D, actionscript, Actionscript 3.0, AS3.0, tutorial
add a comment
This is a sweet way to simulate flying through a 3d stack of images. You have to wait a few seconds for all 3 images to load. It uses very little processing power, and it’s fairly easy to understand. It uses this magic formula: scale = focalLength / (focalLength + z). My code here is very well commented, so I’ll let it do the talking. If you have any questions, just throw them in a comment.
Btw, the images are pulled from Flickr, from a very talented photographer.
//Declaring the URL, the Loader, and the XML variables
var xmlURL:URLRequest = new URLRequest("images.xml");
var xmlLoader:URLLoader = new URLLoader();
var xml:XML;
//Declares the image array
var imageArray:Array = new Array();
//Declares the variables needed for the 3D effect
//Try playing around with the value of these variables to make it look different
var focalLength:int = 50;
var distance:int = 0;
var distanceBetweenImages:int = 100;
//Telling the loader to load the URL
xmlLoader.load(xmlURL);
//Enter Frame event listener
addEventListener(Event.ENTER_FRAME, onEnterFrame);
//Detects when the loader has finished loading the data
xmlLoader.addEventListener(Event.COMPLETE, parseXML);
//converts the loaded data into XML
function parseXML(e:Event):void
{
xml = new XML(e.target.data);
displayImages();
}
function displayImages():void
{
for (var k in xml.image)
{
//declares the movieclip that the image will be in
var imageMC:MovieClip = new MovieClip();
//gets the URL for the image
var imageURL:URLRequest = new URLRequest(xml.image[k]);
//declares the loader and loads the image
var imageLoader:Loader = new Loader();
imageLoader.load(imageURL);
//adds the image to the movieclip
imageMC.addChild(imageLoader);
//adds the image movieclip to the stage, and puts the image at the bottom of the image stack,
//but above the background rectangle with the gradient, you will have to change this number
//based on what you want to have behind your stack of images
addChildAt(imageMC, 1);
//puts the image movieclip at a position
imageMC.x = 18;
imageMC.y = 20;
//adds the image movieclip to the array of images
imageArray.push(imageMC);
}
}
function onEnterFrame(e:Event):void
{
//creates the distance from the screen to the first image in the stack of images
//you can make this react to a scroll bar, or a slider, or anything you want
//making it react to the mouse is just for this tutorials demonstrational purposes
distance = (stage.stageWidth - stage.mouseX) - 200;
//loops through the image array
for (var k in imageArray)
{
//puts the spacing between the images
var z:int = distanceBetweenImages * k;
//figures out the scale
var scale:Number = focalLength / (focalLength + (z + distance));
//puts limits on the scale, based on how the scale is computed
//it is possible for it to be negative, we don't want that
//makes the image invisible after it gets realls close
if (scale > 1.2)
{
imageArray[k].visible = false;
} else if (scale < 0)
{
scale = 0;
} else
{
imageArray[k].visible = true;
}
//applies the scale to the image
imageArray[k].scaleX = scale;
imageArray[k].scaleY = scale;
//makes the image alpha the same as the scale, to add to the effect
imageArray[k].alpha = scale;
//places the image at the center of the screen
imageArray[k].x = (stage.stageWidth / 2) - (imageArray[k].width / 2);
imageArray[k].y = (stage.stageHeight / 2) - (imageArray[k].height / 2);
}
}
It’s pulling the URLs for the images from a very simple XML file.
Should you hire an artist for your next game? August 24, 2008
Posted by Mark in Making Money, Resources for Games.Tags: artists, money, sponsorship
add a comment
Short answer: Probably.
Here’s why: Lets say you’re pretty good at actionscript (2 or 3) what do you find yourself spending the most time on when making a game? Since you’re pretty good at the actionscript side of things, the art is what probably takes the longest, or if not the longest, at least an equal amount of time as the programming side does. Lest say you didn’t have to make any of the art, you would potentially cut down the time it takes to make a game by 50% or even more.
How do you find an artist? Actually, finding an artist is usually pretty easy. There are two ways. The first way is using FGL, If you’re not a member of FGL I strongly suggest you join, it’s free. On FGL there is a forum dedicated solely to helping programmers find artists (or artists find programmers). Once you make a new thread saying something like “I need an artist!” you’ll usually get multiple responses within a day. The second way is finding someone you actually know (which I’ve found to produce more reliable results, nothing beats being able to actually talk to the artist, face to face). A friend of mine, who is a professional artist was more than happy to do art for my games.
Now you have to decide how much you’ll pay them and how. Usually artists will accept two ways of figuring out how much you’ll pay them. One way is a set amount, say $150. This way is good if you’re sure, and I mean absolutely sure your game will do quite well. It’d suck to have to pay the artist $150 and then only get $50 yourself because the game was only sponsored for $200. On the other hand, it would be sweet if it got sponsored for $1000 so you got 85% of the profit. Here’s the second way. You can offer a split of whatever the game gets sponsored for, a common split is 60/40 where you get 60 and they get 40 (paid after the game gets sponsored). This way is excellent if you really don’t know how well your game will do because even if your game doesn’t get sponsored at all, you loose nothing except time spent.
For my first game, AVZ:Alien VS Zombie, I did a 60/40 split with my artist. On the game that I’m currently working on (which will be on FGL by the end of August!) I’m paying my artists (yes, plural, I’ve hired two for this game) a set amount. In total, I’m paying $200 for my artists and my sounds (I got my sounds from Sound Rangers, they offer fantastic quality music and sound effects).
Resources for learning AS3.0 August 24, 2008
Posted by Mark in Actionscript 3.0.Tags: actionscript, Actionscript 3.0, AS3, learn
3 comments
I’ve been compiling this list for a long time now, there is a TON of useful stuff here.
Obviously there are lots of people who want to learn Actionscript 3.0. It’s what in Flash 9 (CS3), and we know it’ll be in Flash 10 (CS4?). It’s time to learn it if you haven’t.
BOOKS:
- Essential Actionscript 3.0
- Foundation Actionscript 3.0 Animation – Making Things Move – Keith Peters – Friendsofed
- Object Oriented ActionScript 3
- Flash Game University
- The Actionscript Bible
- AI Game Programming Wisdom
- Advanced.ActionScript.3.with.Design.Patterns
- O’Reilly’s Learning Actionscript 3.0
- Flash Professional 8 Game Development
WEBSITES:
- http://www.senocular.com/flash/tutorials/as3withflashcs3/
- ByteArray.org
- polygonal labs
- BIT-101 Blog
- Kirupa’s ActionScript 3 Tips and Tricks
- http://gotoandlearn.com/
- http://chrisbrimelow.com/blog/
- http://livedocs.adobe.com/flex/3/html/
- http://flashgameu.com/
- http://www.8bitrocket.com/
- PeachPit
- Cartoon Smart ~ (sadly, this isn’t free)
- http://www.newgrounds.com/bbs/topic/229808/50
- http://www.lynda.com/ – $25/month access to all videos. I have a subscription, it explains it so ANYONE can understand it. If you’re just starting in AS3, these are highly recomended, even if you’re semi experienced.3D Engine:
- Papervision3D
- Away3D Flash Engine
- AlternativaPlatform
- Sandy
- Mathieu Badimon | FIVe3D
- custom:media � SWFZ
- shirotokoro � WOW-Engine ~ 3D Physics Engine
Isometric Engine:
Tween animation library:
- GO ASAP
- GreenSock � TweenLite (AS3) – A Lightweight (2K) and FAST Tweening Engine
- Twease | visualcondition playground
- tweener – Google Code
- Uza’s Blog & More � AS3 Easing
- AnimationPackage
- boostworthyisryantaylor � AS3 Animation System v2.0
Artificial Intelligence
- http://munsterkiler.890m.com/wordpress/?p=24
- http://www.red3d.com/cwr/steer/
- http://www.ai-junkie.com/ai-junkie.html
- http://www.kirupa.com/forum/showthread.php?s=&threadid=16649
Game Saves
Physics:
- APE – Actionscript Physics Engine
- Fisix Engine | Flash Action Script 3 Physics Engine for Game Developers
- Flash Physics Engine Box2DFlashAS3 1.4.2
- foam-as3 – Google Code
- motor2 – Google Code
- glaze engine
- physaxe – Google Code
Socket server:
- ElectroServer 3 – socket-server, multiplayer, server-side ActionScript, server plug-ins, database support
- moock>> unity
- Palabre :: Flash Xml Multiuser Socket Server – Home
- SmartFoxServer: Socket server for Flash multiplayer games and applications
- Swocket – A Modular XML Socket server in Python
- RED5Server
- MMOcha – Platform for Multiplayer Games
- Nonoba Multiplayer API – Nonoba.com
Other:
- Flint Particle System
- Projects < ByteArray.org (various, including alivePDF and wiiFlash)
- flare | visualization on the web
- AsWing
- as3ds – Google Code
- ASProf – Realtime Actionscript Profiler
- evoengine – Google Code
Path Finding:
Money Making Story: My latest flash game sponsored $200 August 23, 2008
Posted by Mark in Making Money.Tags: money, sponsorship, story
comments closed
My very first flash game, called AVZ:Alien VS Zombie took me about 20 hours to make. Now I think I could make the same game in about 10 hours, that’s how much I leared from the process. You can see the game here. After I made the game, I put it up on FGL. WIthin a week, I had a bid on the game. It was for $150. I thought that was a little low, so I waited a little longer. About 3 days later, I got another bid for $200. I decided to accept that bid. The sponsor wanted his logo and a link to his website in my game, I agreed on the terms and did what he asked. I sent him the published SWF, and he sent me the $200 via paypal. It was a painless process, and I learned a lot from it. I also made 10$ an hour! I am currently making a new game in my free time, that I think will get a much higher sponsorship price than AVZ, I can’t tell anything about it yet though, it’s a secret. The game will be finished and up on FGL by the end of August though, so you can see it soon.
Making Money from Flash Games August 23, 2008
Posted by Mark in Making Money.Tags: money, sponsorship
comments closed
The idea of making games in flash is what got me interested in the first place. It wasn’t for a very long time that I figured out you could make money from them.
The first method of making money from flash games I found was mochiads. Everyone who’s played a flash game before has probably seen them, they’re one of the most common in game advertisements out there. Making money using mochiads requires lots and lots of views. I haven’t made hardly anything from mochiads.
The second method of making money is to get your game sponsored. A flash game portal (such as Kongregate) will ’sponsor’ your game for a certain sum of money. The sponsorship will usually require you to put their logo in your game, and there will be other limitations on what you can do with your game, such as you can’t release any version that doesn’t have the sponsor’s logo, etc. To get your game sponsored you can email all of the sponsors that you can find, but there is a much better solution. FGL (www.flashgamelicense.com) is a website where you place your game up for bid. The sponsors can see your game and they’ll make bids, kind of like ebay, except you can leave your game up on FGL for as long as you want.
AS3 mouseChildren August 23, 2008
Posted by Mark in Actionscript 3.0.Tags: actionscript, Actionscript 3.0, AS3, learn, mouse-children
comments closed
This one caused me at least an hour of frustration in a recent project I was doing at work. When you have a event listener listening for the MOUSE_OVER event (lets say the object the event listener is on is a movie clip, with multiple children inside of it, like a background image, and a textfield), the yourMovieClip.mouseChildren property is automatically set to true. What that means is, every time you mouse over yourMovieClip, it will actually be like each child inside of it triggers the MOUSE_OVER event, and then if you have a MOUSE_OUT event, each time you mouse over from child to another inside of yourMovieClip, it will trigger the MOUSE_OUT event, and then the MOUSE_OVER event. This is very undesirable if you’re trying to create a rollover effect or something for your movieclip. There are two solutions:
Solution 1: Manually set the mouseChildren to false, like this:
yourMovieClip.mouseChildren = false
Solution 2: Don’t use the MOUSE_OVER event, use the ROLL_OVER event. The ROLL_OVER event will not automatically set the .mouseChildren property to true.
AS3 Animator Class August 23, 2008
Posted by Mark in Actionscript 3.0.Tags: actionscript, Actionscript 3.0, animator-class, AS3, learn
comments closed
I discovered this today while working on my latest project at work. I was trying to find a way that you could set up a motion tween with filters on a movie clip and that’s exactly what I got. I’m talking about the Animator class. You can create one, just like you would create any other variable like this:
var myAnimator:Animator = new Animator(xml, displayObject);
In place of the xml, you put the name of your xml file, and in place of the displayObject you put your reference to your display object (a movie clip, sprite, etc). Then you have to write some XML…. OR you create a motion tween just like you normally would using the timeline and your symbol and whatever filters you want to use, then you select the frames in the timeline that have your tween, and you right click, and select Copy Motion as AS3.0. It will ask you for the instance name of the object that you want to apply this tween to later in your code. Now the code is literally copied to your computer’s clip board, so you have to paste it somewhere. Open up your actions panel and do so. What you get will look something like this:
import fl.motion.Animator;
some XML
var myMC_animator:Animator = new Animator(myMC_xml, myMC);
myMC_animator.play();
What that does is create an XML file that has the settings for your motion tween. Why Adobe made it an XML file, I have no idea, but it’s really quite handy if you think about it. Instead of making your XML right in your flash project, you could make it as a standalone XML file, then you could use a loader to load in that XML file use the resulting motion tween on your symbols. You would do that to make your flash project configurable by some means other than flash. That way, lets say that the web developer in your company is integrating your new flash project into the company website. Now he can control all of the settings in the motion tween, which could be used as button rollover effects, or any other use for a motion tween.
Some other notes about using them, if you’re using them inside a funtion, make sure you declare them outside of the function, otherwise when the function completes it’s garbage collection will delete the animator variable, and the symbol that it was applied to will be stuck 1 frame into the tween. You can have multiple filters in the XML file, and you can even tween the quality setting. Once you’re looking at the XML file I think it’s pretty self explanatory to what you need to do to make it suit your needs.


