I made this game in collaboration with a colleague of mine (Berthjan Achterop / http://www.berthjan.com/)
I started of with the coding of the engine and Berthjan made the design. After applying the design to the game I animated most of the characters to bring it all to live. The result is a “colums”-like game wrapped in a world of weird (but wonderful) creatures

Enjoy and let me know what you think of it…

PS: here is a nice wallpaper to accompany the game

After over a year of not listening to my nagging collegua (Away3D-team member Fabrice Closier) telling me to start working with (Away)3D, I caved…
I started to experiment a little in Away3D and turned my 2D jellyfish experiment into a 3D version. You can watch the result here: http://labs.justgreat.nl/exp080603.htm

I added a couple of tricks I learned way back when I created levels for Unreal Tournament.
For example I added a second viewport for the skybox (in this case a sphere), because the Away3D Skybox-class is in fact not a real skybox but just a really huge cube rendered in the same viewport as the rest of the scene.
The camera in my skybox viewport points in the same direction as the camera in the main viewport but always stays at point (0,0,0). This way the camera will never approach the side of the skybox, giving the illusion that everything in this viewport is really far away.

All-in-all a good start in Away3D if you ask me. I hope to do some real projects with 3D in the comming weeks…

The situation looks like this:


- The two shapes are siblings so they have the same parent (i.o.w. the two shapes can’t be nested).
- The blue oval is on top of the green rectangle.
- I want to know when the mouse leaves the green rectangle.

The problem is that the green rectangle dispatches a ROLL_OUT and MOUSE_OUT event as soon as the mouse hits the blue oval.

I tried all combinations of mouseChildren, buttonMode and enabled on the oval and on the parent of the two clips, but nothing seems to make the oval not “steal focus” of the rectangle.

Here is the source of the test: Rollout test (zip)

I can think of some workarounds (hitArea, using an invisible button, etc.) but I much rather find a straight way to handle this kind of situation.
Since this was never a problem in as2 I believe there should be a decent solution in as3 as well.

If someone has an answer to this problem or knows about a secret property I haven’t tried, please let me know…

I was inspired by the graphics of Dofus Arena and decided to try and create some similar tiles… Spending half a day fooling around with Fireworks I ended up with this image:

Another half a day later I turned the graphics into an animated terrain generator: http://labs.justgreat.nl/exp080302.htm

The terrain is generated according to three small bitmaps (see top left corner). The first one determines the type of the tile. The second one is like a bumpmap and determines the elevation of eacht tile. The third bitmap determines where objects (plants, rocks, gold, etc.) should be placed.
In the future I might create an editor which can write the bitmaps.

Once I designed more versions of each tile-type (4 or 5 different grass tiles for example) the generator will be able to pick a random version of that tile. This way repetition in the structure should be avoided (at the moment the tiles are just mirrored at random).

Besides the designs I also needed a nice transition between the background and a map that will be shown somewhere during the game (as some sort of level selection). Because the style is kind of “old” I thought it would be a good idea to make some sort of dissolve transition.
Whaddayaknow; I managed to get a decent result in just a couple of hours.

Despite the fact that I used a perlinNoise and a copyChannel the  result runs pretty smooth. Check it out:
http://labs.justgreat.nl/exp080201.htm

To accomplish the dissolve effect I used an alpha mask on the top image (in this case the “map”-image). The mask itself is created by combining a perlinNoise and copyChannel. The perlinNoise creates the randomness and the copyChannel transforms the randomness into a transparent layer.
The size of the mask is half the size of the image and stretched to match the size of the image. This way only a small perlin noise has to be created which increases performance.

Apparently it is some weird bug when it comes to multiplying decimals values by 3. Take this little script for example:

1
2
3
4
5

var j:Number; 
for(var i:int=0; i<10; i++){ 
	j = i/10; 
	trace(j+"*3 =\t"+(j*3)); 
}

It outputs:
0*3 = 0
0.1*3 = 0.30000000000000004
0.2*3 = 0.6000000000000001
0.3*3 = 0.8999999999999999
0.4*3 = 1.2000000000000002
0.5*3 = 1.5
0.6*3 = 1.7999999999999998
0.7*3 = 2.0999999999999996
0.8*3 = 2.4000000000000004
0.9*3 = 2.7

And it doesn’t stop just there. The same problems occur when adding a decimal value to the double of it’s value:

1
2
3
4

trace(.1+.2) //0.30000000000000004 
trace(.2+.4) //0.6000000000000001 
trace(.3+.6) //0.8999999999999999 
trace(.4+.8) //1.2000000000000002

The problem occurres in Javascript as well as in Actionscript (and probably some other languages too) so it’s probably caused by the way decimal values are treated at byte-level. Because it’s not likely there will be a fix for this soon, here is a little workaround:
i = int(i *10)/10; //use int() in favour of Math.round() to speed up the code

http://labs.justgreat.nl/exp061203.htm

At the time I made the engine I didn’t feel like creating nice graphics so the experiment still looks a bit boring.
Because the engine works fine I thought it would be a wast not to use it, so tonight I created some graphics for the tiles (check them here).
The symbols are taken from a photo of real Mahjong stones. so they should be quite accurate.
The tileset is not 100% complete yet and the current tiles still need a little work on the coloring as well, but I’m sure I’ll finish it somewhere next year

I also moved the game to a new location. From now on you can check the game here:
http://games.justgreat.nl/bubbleschmubble/

Besides the online highscore option I also added some sounds (again)  and I animated the creatures inside the bubbles a little (quick and dirty).

Last but not least I removed the MochiAd from the game because it was way too annoying and I needed at least a 1000 players a day (!) to make just a little profit from it . Instead of the MochiAd I added normal google-ad-banner though,  in the hope it will pay me off some day .

I hope you enjoy playing against each other because your highscore will be visible to everyone who plays the game.

You can try it here: http://games.justgreat.nl/bubbleschmubble/

I already added some functionality to the game like local highscores, but there is still a lot of work that needs to be done:
- some bugfixes on the current code
- overall highscore
- better tweens and animated creatures
- sounds
- a splash screen
- a setting page
- a credits page (so far it’s only gonna contain my own name :P )

I added a MochiAd just to check how it works. If the ad becomes too much of a nuisance or doesn’t bring in enough money (according to the number of players) I will remove it again.

Let me know what you think of the game so far. Also suggestions are always welcome…

The engine is based on a game called “Jawbreaker” which is a real fun and addicting game.

The final game needs a nice scoreboard and a menu and of course some nice sounds, tweens and animations to spice it up…

For the time being I added the result as an experiment to the lab:
http://labs.justgreat.nl/exp071204.htm

Go check it out and let me know what you think of it…

This summer I bought a book about game physics (check http://blog.justgreat.nl/2007/07/09/game-physics-here-i-come for more details) and here is the first result:
http://labs.justgreat.nl/exp071201.htm

I started with the engine because last week I decided I want to build a game-like portfolio site (check http://www.justgreat.nl/ for progress…). Because every item on the site is gonna have some kind of physics applied to it, it seemed like a good idea to combine the creating of my physics engine with the creating of this portfolio site.

At the moment the engine only contains a Vector3D- and a Particle-class but I’m going to expand it the coming week(s).
To make the testing of the engine a bit more fun I added a little code to generate 5×5 pixel invaders as particles. (For the space invader-generation part I was inspired by one of Jared Tarbell’s experiments where he created little 3×3 invaders.)

It took me a while to regain the creation-dates, make all experiments ready for displaying and creating the thumbnails, but finally I’m finished

Check out the new labs-section here: http://labs.justgreat.nl/
Put it in your favorites because I’m going to post at least one experiment a week (really!).

Drop a line if you like them…

It is gonna be a game based on the classic (but not really well-known) game “Qix”:

As a kid I played this game for days on my old GameBoy (the original) so I know it’s going to be a very addictive game.

The eventual goal is to create a complete game which I’m going to distribute across the web (ofcourse not before placing some adds in it ).
For now I started off with the design and decided it’s going to have a futuristic, electric and hi-tech theme. Here is a little preview:

I named the game “spark” for the time being, but as I’m not fully satisfied by it I’ll probably rename it later on.

Since I have a little spare time this week I hope to have a little demo ready by the end of this week. (did I really say that … omg  … well we shall see about that)

Flash on the Beach 07 was just GREAT!

Although I had to miss some of the sessions on Wednesday because of the amazing party on Tuesday (read: loads of beer and dropshot) the whole event inspired me to really start experimenting in Flash again.

In contrast to Mad in Spain (which was mostly about great webdesign) this event was all about Flashy-artwork (it was to me anyway).
Almost every session I went to dealt with particles, algorithms, particles, fractals and then some more particles….

Fractals all over the place…

The absolute particle/algorithm/fractal climax was Jared Tarbell’s session “Algorithms to Fill Space”. Although I was familiar with the basics of the algorithms and particles, this session made me see how easy it mas to make very complex and cool experiments with them.

Another great and very funny session was Joshua Davis‘ “Dynamic Abstraction”. This guy makes just GREAT art using mainly flash. Although his site doesn’t fully do justice to his work you should check it out because he has some great pieces there…

Besides these two amazing sessions there was a lot more that inspired me. As I want to spend most of my time experimenting in stead of updating my blog here is a little sum-up of these sessions (no particular order):

- Alex Jenkins – Pulling the emotional trigger
A session with a some very entertaining websites. Check the Unit9 portfolio:
http://www.unit9.com/

- Seb Lee – Delisle AS3 Particle Effects – Now 1000% Extra FREE!
A great session about the basics of particles. Although the session started of very easy, it got more interesting near the end as it showed some really pragmatic solutions to common problems (e.g. with a few tweaks you can make your particles look like real smoke without speed loss). Check out the Plug-in Media! site for some cool effects!
http://www.pluginmedia.net/

- Keith Peters – Make Flash Games. Retire Early
A session about how to make money of your “simple” flash games. Since I already have some game engines in store I really need to turn them in to real games and start making money.
His site is more about his experiments but it’s really worth to check out:
http://www.bit-101.com/

- Craig Swann - Perceptive Interactions + Alternative Interfaces
A nice and inspiring session about Craig’s experiments with alternative in- and out-put. The experiments are a weird combination of video, sound, webcam, and a bunch of home-made electronic input devices. Check the lab-section on his site for some of the freaky shit.
http://www.crashmedia.com/

- Robert Hodgin - Breaking away
Although (or maybe because) his work was not made in Flash, it was just fucking GREAT! By using processing this guy created the most amazing art. Check his blog for some of his work (make sure to check the videos).
http://www.flight404.com/

- Erik Natzke – Beyond the Knowledge: The Art of Playing
I’m not a big fan of his work (particularly the old stuff) but he has got some nice pieces out there.
http://jot.eriknatzke.com/

There were a lot more interesting speakers, but as a already mentioned I really like to get busy right now my self. So after I finish my uncles portfolio site (any time now) you should expect some great experiments and games! Stay tuned…

This time we’re going with six people from <theFactor.e> Flash/Flex team. I hope to be even more inspired by this trip than the previous one.

Stay tuned…

Here is an example:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

package { 
	import flash.events.Event; 
	import flash.display.MovieClip; 
	public class TestMC extends MovieClip{ 
		private var i:int = 0; 
		private var loopCount:int = 0; 
		public function TestMC() { 
			this.addEventListener(Event.ENTER_FRAME, this.calculate); 
		} 
		private function calculate(event:Event):void { 
			try{ 
				while(true){ this.i++; } 
			} 
			catch(e:Error){ 
				this.loopCount++; 
				trace("____________n'i' after "+loopCount+" frames = " + this.i); 
				if(i<0){ //i will be negative when it becomes to big, normally you would check here if your calculation is done... 
					this.removeEventListener(Event.ENTER_FRAME, this.calculate); 
				} 
			} 
		} 
	} 
}

This is just an example and I’m sure you can think of much more useful ways to use this feature.
Hope it heps you along…

Update (1 December 2007):
Just great; I forgot to mention HOW to set the timeout . Well here is how:
You can’t set the timeoutperiod by code (neither in as3 nor in as2). You have to set the timeout manually in the publish settings of your fla: Ctrl+Shift+F12 > flash-tab > “Script time limit”.
Let me know if you still have trouble.

Very smart Adobe!

Fortunately I thought of an easy way to get this problem solved; simply copy the remoting classes from Flash 8 to some other directory and set this directory as one of your default Flash 9 – as2 – classpaths. (Copying it into the default classpath with all other default classes didn’t work for me somehow.)

To make it easy for you I extracted the remoting classes and put them in a zip: as2RemotingPackage.zip

PS: I coudn’t find any info about this on the internet so either nobody ever needed it, nobody ever bothered to try and find a solution or this solution is so simple nobody ever bothered to write about it.
Anyway I bother to write about it for those of you who couldn’t find a solution or just didn’t bother to find one.

Hope this will help you…

Game Physics – Engine Development

I’m not really a book person, but when I tried to create a physics engine a while back I ran into a couple of major problems which stopped me from going on with it. I tried it a couple of times ever since but I always found myself stuck on the same problems (complicated collision detection etc.). Back then I searched for decent books to help me but there wern’t any. Either they were way too easy (coming with all kinds of crappy solutions) or way too hard (most of them all about theoretical physics).

I ran into this book by accident as I was actually looking for an all picture book with cool and stylish web design (Web design index by content).

I haven’t read any of it yet, but looking at the pics inside it is exactly what I needed .
I tend to read it in my vacation so you might expect some nice experiments in the near future.

For those of you who are interested:

Game Physics – Engine Development by Ian Millington
isbn: 978-0-12-369471-3

Web design index by content
isbn: 90-5768-069-6 | http://webdesignindex.org

PS: I saw this Ian dude also has a book on AI which sounds interesting too, but that something for the future. (God, where am I gonna find the time…)

This evening I started an experiment to try and create a terrain generator (like the one in my all-time favourite SimCity2000). So far I don’t really have use for it but it might come in handy in the future.

I managed to work out the basics in just 3 to 4 hours. Now I need to find a way to get smoother edges and get rid of all the really small islands. I recon that’s gonna take a bit more work.

 I used an enterFrame event to get the animated effect. Just to see what happens.

Check the first results here:
http://labs.justgreat.nl/exp070702.htm

PS: this is the first time I used actual flash components since I don’t have a slider or spinner ready in as3; boy do those things SUCK!!!

UPDATE (2007-07-09):
I managed to remove the majority of the small (one or two px) islands by tweaking the algorithm a little. The result is now a bit more realistic.

Also I increased the max world size to 960×960 (to illustrate: SimCity2000 has a mapsize of 128×128).

Finally I added the world wrap option (because it took me just 2 minutes to add ).

UPDATE (2008-03-09):
Here is a short explanation of how the code works:

The general trick is to place a first pixel somewhere on the map and than check each of its neighbours to see if they need to be filled with the same “terrain-type”. You can do this by checking a random value against a fixed limit value (in this case represented by the “spread”).
When a certain pixel on the map is filled you place it in an array so you can always check if a pixel is already occupied and you can also use it to check if the maximum number of a certain type is reached (in this case represented by the “pct”).
After this whole sequence you repeat the same process for the newly generated pixels (there is your recursion). If there are no more pixels left to check and the maximum is not reached yet, you just place a new pixel somewhere on the map and start again.

I hope this will help you along.

ribbon #1 (2003?)
soap (2005)
particles #1 (2005)
particles #2 (2006)
particles #3 (2006)
mouse #1 (2006)

Let me know what you think of them…

I hope to convert some older experiments in to as3 in the near future. I’ll keep you posted!

Update (2007-12-05)
I moved my experiments to a new domain and I renamed them because their numbers became too overwhelming
You can find these and other experiments on http://labs.justgreat.nl