Explore the web game development with Filipe Silvestrim. An ActionScript developer who loves interactive technologies.

Last night I was looking some old docs and I found a list of links that, at the time, I thought that every Game Developer, Gamer or curious (about game) should know.

In fact, this isn’t nor a specific list and nor a huge list, but is really helpful to the purpose of be startup to get inspired in the projects of your new games.

Here are the links (if you know some other useful links, please reply this post, than I’ll update it):

Aggregators:

• Kongregate – http://www.kongregate.com
• Pogo – http://www.pogo.com
• MiniClip – http://www.miniclip.com
• BigFish – http://www.bigfishgames.com
• NewGrounds – http://www.newgrounds.com
• PopCap – http://www.popcap.com
• RealArcade – http://www.realarcade.com
• IWin – http://www.iwin.com
• Shockwave – http://www.shockwave.com
• Games MSN – http://www.games.msn.com
• ArcadeTown – http://www.arcadetown.com
• TryGames – http://www.trygames.com
• Oberon – http://www.oberongames.com
• Reflexive – http://www.reflexivearcade.com
• MarkFennell – http://www.markfennell.com/flash
• CandyStand – http://www.candystand.com
• MouseBreaker – http://www.mousebreaker.com
• TeaGames – http://www.teagames.com
• Metanet – http://www.harveycartel.org/metanet/downloads.html
• Squarecircleco – http://www.squarecircleco.com
• Extrajet – http://www.extrajetzt.com
• Large Animal – http://www.largeanimal.com

Analysis:

• Jay Is Games – http://jayisgames.com
• Three Hundred Mechanics – http://www.squidi.net/three/index.php

Market and Industry:

• GameStats – http://www.gamestats.com
• Games Industry – http://www.gamesindustry.biz
• Games Politics – http://www.gamepolitics.com

Development:

• Gamasutra – http://www.gamasutra.com
• GameDev – http://www.gamedev.net

Reviews and News:

• GameSpot – http://www.gamespot.com
• Games Radar – http://www.gamesradar.com
• About.com – http://boardgames.about.com/od/news/Game_Reviews_News_and_Events.htm
• IGN – http://www.ign.com

Virals:

• Viral Game – http://www.viral-game.co.uk/our-viral-campaigns.html
• MCM Games – http://www.mcmgames.co.uk/viral-game-designers.asp
• Viral World – http://www.viralworld.co.uk
• Kerb Games – http://www.kerb.co.uk
• Viral Chart – http://www.viralchart.com

Visual References:

• The Video Game Atlas – http://www.vgmaps.com/Atlas
• Game Sprite Archives – http://www.gsarchives.net

It’s been a while that I’m trying to post the screen manager how to use (also because the code has already been on my code.google for a while).

So… aren’t you tired of building screens for every new site? Linking it to a movieclip? Manage all transitions?… And also having problems with scope access or listener?

On the net you’ll find some code that really fix the problems, like GAIA, but not in a simple and easy way. Personally I’ve being using this class for all my projects (games or simple websites) since I wrote it and I’ve noticed how fast I can start a project by using it.

To be able to build a screen you’ll need some class like this:

package com.filipesilvestrim.screenexample.screen
{
	import com.filipesilvestrim.screenexample.utils.ButtonManipulator;
	import com.filipesilvestrim.screenexample.utils.Consts;
	import com.filipesilvestrim.ui.screen.AbstractScreen;
	import com.filipesilvestrim.ui.screen.ScreenManager;

	import flash.events.Event;

	import gs.TweenLite;

	/**
	 * ...
	 * @author Filipe Silvestrim
	 */
	public class ScreenHome extends AbstractScreen
	{
		private var content : mcScreenHome;

		public function ScreenHome( name : String )
		{
			/* The AbstractScreen has 4 params:
				@param: String - being the name of the screen registered in the ScreenManager
				@param: Boolean - exist transition to the entrance of the screen
				@param: Boolean - exist transition to the exit of the screen
				@param: Boolean - if this screen have something to preload
			*/
			super(name, false, true);
		}

		//When someone calls the change to screen this is the first method to be called
		override public function build():void
		{
			//creating the view
			content = new mcScreenHome();
			//an AbstractScreen is a subclass of Sprite
			//so, we're adding the view created in flash to the ScreenHome instance
			addChild(content);

			//repositioning the view (anchor point is in the middle)
			content.x = 275;
			content.y = 200;

			//reset propeties
			this.alpha = 1;

			//getting access to the buttons created via flash
			ButtonManipulator.createButton(content.$instr, "Instructions", gotoInstr);
			ButtonManipulator.createButton(content.$more, "More Info", gotoInfo);
		}

		//helper callback event manipulated by the ButtonManipulator
		private function gotoInstr(e:Event):void
		{
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_INSTR);
		}

		private function gotoInfo(e:Event):void
		{
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_INFO);
		}

		//If the current screen is active and someone else calls the changeToScreen method
		//this method is called to destroy the current screen
		override public function destroy():void
		{
			TweenLite.killTweensOf(this);

			//cleaning the memory
			removeChild(content);
			content = null;
		}

		//All the optional screen functions as transitions in and out and preload
		//must to override their methods and when done call theirs end methods (event)
		override protected function transitionOut():void
		{
			TweenLite.to(this, 1, { alpha:0, onComplete:super.endTransitionOut } );
		}
	}

}

I’m showing here one example to show how easy and fast is to create screens in an ActionScript project using the ScreenManager.

And here is a example of a game screen:

To download the example (source code) just click here to download the FlashBuilder project and link it to my library (donwload at my google code)

The document class of the project is this:

package
{
	import com.filipesilvestrim.screenexample.screen.ScreenHome;
	import com.filipesilvestrim.screenexample.screen.ScreenInfo;
	import com.filipesilvestrim.screenexample.screen.ScreenInstructions;
	import com.filipesilvestrim.screenexample.utils.Consts;
	import com.filipesilvestrim.ui.screen.ScreenManager;

	import flash.display.Sprite;

	[SWF(width=550, height=400)]
	public class ScreenManagerExample extends Sprite
	{
		public function ScreenManagerExample()
		{
			/*
				First we need to start the ScreenManager.
				The first param is the DocumentClass - we need this because
				the ScreenManager need to have direct access to the stage
				to get focus back to the current screen and if we would
				to access the main class or stage directly via the property scope.
				The second parameter is the local (DisplayObjectContainer)
				were the screen will be attached later.
			*/
			ScreenManager.getInstance().init(this, this);

			//Before start we need to register all the screens to be used later
			ScreenManager.getInstance().addScreen(new ScreenHome(Consts.SCREEN_HOME));
			ScreenManager.getInstance().addScreen(new ScreenInstructions(Consts.SCREEN_INSTR));
			ScreenManager.getInstance().addScreen(new ScreenInfo(Consts.SCREEN_INFO));

			//vamos inicializar/chamar a nossa tela de escolha
			ScreenManager.getInstance().changeToScreen(Consts.SCREEN_HOME);
		}
	}
}

Hello all!

Once the blog is with a new face, let’s start to renew the posts too

Today I’m posting a quick tip for those who are new with Adobe Alchemy. I really agree that it kind of sucks when you’re new with theses technologies and you need to configure a lot of things.

Well, I have created a little shell script that helps to compile a C or C++ Alchemy project without the necessity of configuring the .profile file.

The steps to install and compile a Alchemy project with this shell script are:

1. Download the Alchemy Toolkit at http://labs.adobe.com/downloads/alchemy.html
2. Unzip the package in a directory (that will be your main Alchemy directory)
3. Go to the main Alchemy directory via Terminal (i.e. cd /Documents/alchemy)
4. Run the config script in Terminal (i.e. ./config)

Now to compile a project just copy the shell script file to the folder that contains your C or C++ Alchemy project. But before run the script you just need to change the path (highlighted line) to the alchemy-setup directory located in the Alchemy directory (i.e. source /Documents/alchemy/alchemy-setup).

And that is it Now to run the shell script just make the file executable (i.e. in terminal type “chmod +x run.sh”) and run it. The script will then ask the main C file of the project: Just type the name of the file without extension and click Return. Done! Your project will be compiled!

Ps.: This is a shell script for Unix. If you want to port it to Windows (.bat) feel free to do that! Just share with us!

Ps.: To compile a C++ file just change the lines of the c-file extension (i.e. cName=”$fname.cpp”) and change the compiler to the g++ (i.e. which g++ AND g++ $cName -O3 -Wall -swc -o $swcName).

#!/bin/bash
#
# About:     This file is a shell script to make easier
#         the compilation of Adobe Alchemy sources
#
# The MIT License
#
# Copyright (c) 2009 Filipe Silvestrim - http://www.filipesilvestrim.com
#
# Permission is hereby granted, free of charge, to any person obtaining a copy
# of this software and associated documentation files (the "Software"), to deal
# in the Software without restriction, including without limitation the rights
# to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
# copies of the Software, and to permit persons to whom the Software is
# furnished to do so, subject to the following conditions:
#
# The above copyright notice and this permission notice shall be included in
# all copies or substantial portions of the Software.
#
# THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
# IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
# FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
# AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
# LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
# OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
# THE SOFTWARE.
#

echo "**************** Easy Alchemy Compiler script ****************"
shopt -s expand_aliases

echo "// Configurating Alchemy..."
source /Documents/alchemy/alchemy-setup
PATH=$PATH:~/bin:/usr/local/bin:~/bin/flex/bin:~/bin/astmp:$ALCHEMY_HOME/achacks
export PATH

alc-on
which gcc

echo "// Accessing  Current Dir..."
DIR=$( (cd -P $(dirname $0) && pwd) )
cd $DIR

echo "// Please, write the main C file name:"
read fname
cName="$fname.c"
swcName="$fname.swc"
gcc $cName -O3 -Wall -swc -o $swcName

echo "**************** DONE ****************"

Well… Today a friend of mine asked me to help him with a night render for his RTS game. He needed an inverse mask to his MovieClip (which was his entire game). I thought a little and I decided to help him. I started writing an inverse mask, but I realized that this would exhaust the cpu. So I thought that what really matters to him is to create a layer of fog on his game, so I wrote (in a few minutes) 2 classes that manage theses “Spots Lights”.

The result as you can see is here (drag the red circles):

As I’m writing codes that are not related to my engine (the one I’m writing for my final project), I decided to create a Google Code Repository for my extra experiments. This way the classes will be always there. This first experiment can be improved a lot. If you have some comments or know a better way of doing it, please let me know

This example’s class is here:

package {
    import com.filipesilvestrim.game.render.light.SpotLight;
    import com.filipesilvestrim.game.render.light.SpotRenderer;

    import flash.display.Sprite;
    import flash.display.StageScaleMode;
    import flash.events.Event;
    import flash.events.MouseEvent;

    [SWF(width=350, height=468)]
    public class SpotExperiment extends Sprite
    {
    private var spotRender 		: SpotRenderer;
    private var spotSelected 	: SpotLight;

    [Embed(source="aoe.jpg")]
    private var map : Class;

    public function SpotExperiment()
    {
        stage.scaleMode = StageScaleMode.NO_SCALE;
        addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
        addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
        addEventListener(Event.MOUSE_LEAVE, onMouseUp);
        addEventListener(Event.ENTER_FRAME, onEnterFrame);

        //Adding the background (in some cases the game as itself)
        addChild(new map());

        //creating the render. The first param is where we'll add the representation, the second is the width and the third is the height
        spotRender = new SpotRenderer(this, 350, 468);
        //here we can change the fog color to other one and the transparency
        spotRender.changeColorMap(0x000000, 1);

        //Now we're adding 3 spots of diferent sizes and position
        //As params we have: name, pos X, pos Y, width, height
        var spot1 : SpotLight = new SpotLight("spot1", 200,200,200,200);
        //we can adjust the intensity from 0 to 1
        spot1.intensity = 1;
        //the focus can be adjusted too
        spot1.focus = .5;
        //adds the red ball for debug
        spot1.debug(this);
        //add the spot to be rendered
        spotRender.addSpot(spot1);

        var spot2 : SpotLight = new SpotLight("spot2", 250,300,100,100);
        spot2.debug(this);
        spotRender.addSpot(spot2);

        var spot3 : SpotLight = new SpotLight("spot3", 100, 100, 300, 300);
        spot3.debug(this);
        spotRender.addSpot(spot3);

        //render as first time to the scenario don't appear without no one fog
        spotRender.render();
    }

        private function onMouseDown ( event : MouseEvent ) : void
        {
            //if some spot is target
            if (spotRender.getSpot(event.target.name) != null)
            {
                //hold in the spotSelected variable the sport that represents that Sprite ball
                spotSelected = spotRender.getSpot(event.target.name);
            }
        }

        private function onMouseUp ( event : Event ) : void
        {
            //if mouse released
            spotSelected = null;
        }

        private function onEnterFrame ( event : Event ) : void
        {
            //hold the spots changes (if some spot selected)
            if(spotSelected != null)
            {
                //reposition the spot and the debug reference accourding the mouse position
                spotSelected.x = spotSelected.spriteDebug.x = mouseX;
                spotSelected.y = spotSelected.spriteDebug.y = mouseY;
                //when change the position the sportRender must be rendered again
                spotRender.render();
            }
        }
    }
}

Wheel, I’m not writing another way of do it…

Is the same way that ObjectUtils of Flex Framework do, but… Imagine that we want to duplicate one object of the class Example, we can just do the clone with a code like this:

public function deepClone ( obj : * ) : *
{
        var bytes : ByteArray = new ByteArray();
        bytes.writeObject(obj);
        bytes.position = 0;
        return bytes.readObject();
}

Let’s first imagine our Example class like this:

package com.filipesilvestrim
{
        public class Example
        {
                public var name : String;

                public function Example () {}
        }
}

Ok, but now if we try get the object with the cast like trace((deepClone(obj) as Example)). Man… shame on you, you’ll get “null”. but why? It occurs because when we are cloning the class we do it with the ByteArray and when you return that’s “new” bytes as an Object, the Flash Player don’t know that those bytes are affiliate with the class Example. So how to solve it?

Let’s register in the Flash Player the class Example, to that when it saw the bytes being cast, it understand that those bytes mean that class. To register we need to this:

registerClassAlias("com.filipesilvestrim.Example", Example);

And the code working will be like this:

package com.filipesilvestrim
{
        import flash.net.registerClassAlias;

        import com.filipesilvestrim.Example;

        public class MainClone
        {

                public function MainClone ()
                {
                        var obj : Example = new Example();

                        registerClassAlias("com.filipesilvestrim.Example", Example);

                        trace("Cloned Object with cast = " + (deepClone(obj) as Example)); // must trace "Cloned Object with cast = [object Example]"

                }

                private function deepClone ( obj : * ) : *
                {
                        var bytes : ByteArray = new ByteArray();
                        bytes.writeObject(obj);
                        bytes.position = 0;
                        return bytes.readObject();
                }
        }
}

So, lets code and have fun