Experimental Game Dev Interviews
RSS icon Email icon Home icon
  • Social Game Flash Engine Tutorial, Part 4: Adding in a special IsoItem

    Posted on October 8th, 2010 IndieGamePod 1 comment


    This is the next part in the tutorial to build your own Social Flash Game MMO based on the Free Social Game Flash Engine

    You can read part 1 here…

    You can read part 2 here…

    You can read part 3 here…

    Special items such as animals are handled in a particular way. Animals in the game follow the same standard of set up that normal items do, however in order to control the seperate animation behaviour they were given a slightly extended set up. First of all our animal must exist on one frame and be given the instance name “animal” as shown:

    As you can see, the elephant is a 2×2 IsoItem, and is positioned exactly the same way an item is. Now, if we dive into our “animal” movieclip and see how the animation is set up on the timeline:

    We can see the three main frame labels we’re looking to have, “standing”, “moving” and “eating”. These three frame labels will get called at the appropriate time for the animal. The rest of the process is exactly the same as adding an item, except that it should be placed in the storeanimals.xml file.

  • Social Game Flash Engine Tutorial, Part 3 – Working with a Store

    Posted on October 7th, 2010 IndieGamePod 1 comment


    This is the next part in the tutorial to build your own Social Flash Game MMO based on the Free Social Game Flash Engine

    You can read part 1 here…

    You can read part 2 here…

    Part 3…

    VetRanch allows the player to purchase items. These can take the form of animals, decor, buildings, or even some extra land. Persistent data is becoming a growing trend in flash games, giving the player an in-game currency and allowing them the ability to purchase items and have them still there when they come back to play again the next day. It’s little things like this that increase the fun and replayability of the game.

    The store in VetRanch offers the player extra experience when they purchase the item, this is one of the ways that the player can help raise their level in the game.

    To trigger the building of an item in the store, we use the following IsoMap function:

    setCurrentBuilding(ref:int, type:String, cost:int)

    The reference is the unique id found in the itemlist.xml file talked about earlier, the cost is obviously how much should be deducted for building the item once it has succesfully been built. The type variable is what we’re interested in, this is what we use to determine how the item should behave.

    For instance, if we set the type to “item” then it will behave exactly like a static item as we would expect. However, if we set the type to be “zoo” then it will take on the characteristics of an animal.

    Placing an Item in the Store

    Once we have inserted a new item into the game, we need a way to add it into the store so it can be purchased and placed on the players map.

    The store currently loads the decoration information from the storedecorations.xml, which has a typical format of:

    <items c=’decorations’>
    <item fl=’3′ f=’5′ p=’500′ i=’isopics/statue1.jpg’ uid=’31’ box=’0′ xp=’1′ pt=” t1=’0′ t2=’0′ >Statue 1</item>
    <item fl=’10’ f=’5′ p=’500′ i=’isopics/statue2.jpg’ uid=’32’ box=’0′ xp=’1′ pt=” t1=’0′ t2=’0′ >Statue 2</item>
    <item fl=’1′ f=’0′ p=’10000′ i=’isopics/pool.jpg’ uid=’30’ box=’0′ xp=’1′ pt=” t1=’0′ t2=’0′ >Pool</item>
    <item fl=’10’ f=’25’ p=’250000′ i=’isopics/mediumhouse.jpg’ uid=’43’ box=’0′ xp=’1′ pt=” t1=’0′ t2=’0′ >Medium House</item>

    The two important attributes we’re interested in here are the “uid” field, which links directly back to the uid specified in the itemlist.xml file earlier, and the “i” attribute which links to a thumbnail image of our statue. “p” is also of importance, and refers to the price that the item will be sold for.

    To add in our large statue, we could place something along these lines in the .xml file:

    <item fl=’3′ f=’5′ p=’500′ i=’our_statue.jpg’ uid=’4′ box=’0′ xp=’1′ pt=” t1=’0′ t2=’0′ >Our Statue</item>

    Now our item should appear in the decoration tab in the store, and can be purchased and placed into the game with no additional compilation of the main game needed.

    Clothing Store

    The game also comes with a clothes store to give the player compete customisation over their appearance in the game. Feel like dressing your character in the style of a certain adventurous archaeologist? No problem.

    By letting the player dress their character any way they please gives them the much needed ability to express themselves and this helps them to truly get hooked into the game. All of the characters clothing can be externally loaded, this means we can add hundreds of costumes into the game, giving the player no end to the possibile combinations to choose from.

    The clothing store is fairly self-contained, and can be shown or hidden by calling the following two functions Main.as.


    If you’re wanting to play around with how the clothing store works, open up AvatarShop.as, this is also where we can set the prices of the various hair styles, tops, bottoms and shoes along with various other details.

  • Social Game Flash Engine Tutorial, Part 2: Adding in a special IsoItem

    Posted on October 5th, 2010 IndieGamePod No comments


    This is the next part in the tutorial to build your own Social Flash Game MMO based on the Free Social Game Flash Engine
    You can read part 1 here…

    Part 2…
    The first thing to understand when working with an Iso World is how to generate an isometric grid. This will become very useful when it comes to developing items or flooring for the game.

    As can be seen, Fig 1.1 is a 2D grid that we start off with. The first thing we need to do is rotate this grid by 45 degrees, then squish it in half in to what is shown by Fig 1.3. This will give us an isometric grid to work with.

    The default size of tile we will be working with is 86.2×43.1 pixels, as specified in the IsoMap.as file. This can be obtained by taking a 50×50 pixel square, rotating it the 45 degrees and reducing the height by half.

    In order to best develop a standard that we will work with in the Iso World, we will be placing the 86.2×43.1 pixel tile at the (0,0) point in a flash file. For larger IsoItem’s, these must be extended downward in the appropriate direction as illustrated here:

    It is really important that these dimensions and positioning are followed in order for them to be displayed correctly when loaded into the game, and for the sorting to work as expected. We have now extended both the xlen and ylen to be of value 2, and have a 2×2 IsoItem basis to work with:

    We can make this loose guide into anything we choose, for example this overly sized statue might fit perfectly into a 2×2 IsoItem tile slot:

    Now all that’s needed is to delete our tile grid and we have a 2×2 IsoItem ready to be inserted into an Iso World.

    In VetRanch, all items are loaded into the game when the Iso World is generated at run time, so we need to save this as a seperate .swf called our_statue.swf.

    The next step is to upload this information to our .xml file, so that the game knows where to find the information on the new IsoItem we have just created. Every item in the game must have a unique identifier, and should appear in the itemlist.xml file. Opening the .xml file you will see lots of items listed, it should look something like this:

    <item uid="1" type="item" loc="isoitems/1.swf" frameno="1" xlen="1" ylen="1">This is item #1</item>
    <item uid="2" type="item" loc="isoitems/1.swf" frameno="2" xlen="1" ylen="1">This is item #2</item>
    <item uid="3" type="item" loc="isoitems/1.swf" frameno="3" xlen="1" ylen="1">This is item #3</item>


    The attributes of a single “item” is given by the uid (the unique identifier), loc (location of the item), frameno (the frame number that the item is on) and the xlen/ylen, these are the two values we’ve talked about. For our statue they will both take the value 2. Finally, this is followed by the items description.

    Next, by taking the next unique identifier (we’ll take the number 4 for this example, assuming there are only 3 other items in the list) we might have something that looks like this:

    <item uid=”4″ type=”item” loc=”our_statue.swf” frameno=”1″ xlen=”2″ ylen=”2″>Our statue!</item>

    Now that the game knows our item exists, where to find the image of it and the size of tiles it will take up on the map, we will need to place this item in the store so that it can be purchased and placed in the game.