Originally proposed for a replacement and enhancement of the famous “snake game” on Nokia mobile phones, it has developed progressively to a totally different game with a dragon as a main character, 4 different worlds to discover and many items to collect.
I’ll also try to show how, from a simple retro flash game, we went to a full HD game using the latest Flash11 technologies (Stage3D through ND2D framework)

Actual game screenshot (level 2)

First idea

One of the first and main idea behind the game was to enhance the music based on how well the user was playing.
Each level has its own soundtrack composed by a band named “Tha Trickaz”. I was pleasantly surprised when I first heard of their music and the soundtracks they would provide us with. This gave me positive energy as it’s always nice to know that you’re working with talented people.

We had different ideas on what we wanted to base the “playability” on:

• speed of the snake (can be raised or lowered by picking up special items)
• energy of the snake (it loses some when it hits obstacles)
• time elapsed without hitting obstacles

I really liked the idea because it could potentially deliver another kind of experience to users but I remained sceptical as I felt this could quickly become complicated to implement into the game.
At this stage of the process, we were still thinking of making a snake-like game.

Approaches

Our first approach was to disassemble each soundtrack in “loops” and assemble them progressively in real-time during the game. The idea was kind of sexy as this would give us some kind of flexibility on what to play or not and when.
“When” was important as we wanted to make the music reflect as much as possible what was happening on the screen (or vice versa)
But this idea was soon rejected as we would have lost the particularities of each soundtrack (progressive start, quiet moments, change of rhythm, change of melody, …)

The second idea was to build the levels based on the soundtracks. This was much easier to implement but we were losing the main concept of the game.

Our third idea was to take the second idea because we were running out of time, money, patience and mental stability. And to keep a little bit of the “progressive music” idea, we “simply” decided to add effects on the soundtrack when the dragon hits and obstacle.

First prototype

Below is a screenshot of one of our first prototypes.
The main square is the game area. The green pixels represent the snake. The red ones, the items to collect to get bigger. There is an energy bar going from red to green and in the bottom, we can see the whole level.
The idea was to add different kind of items, obstacles (static & dynamics) and also an automatic horizontal scroll to oblige the player to move forward.

Of course this was just a prototype, we wanted to give this game a totally new look with nice HD effects, fullscreen support and a cool retro touch mixed to it.

My work on this project

“Technical director” was the first role I endorsed for this project.
I had to translate the mechanics of the game into structures that developers (flash & php) could use and communicate with. I needed to visualise the whole process (game mechanics, facebook api, …) to see all the interactions between the different structures and data.

In about the middle of the project, when it was already well advanced (we already had abandoned the snake concept and were working on the dragon, with different worlds and HD graphics), I had to take over the work of our flash developer.
Having already developed a good part of the game engine, I didn’t feel like taking over his code, for many reasons. So I started from scratch by building a generic 2D map editor using ND2D (Stage3D).
This map editor would allow me to set the base of the engine while building a tool that would greatly simplify the creation of each level.

WorldGameMaker

This is how I called the editor. It is written in AS3 and compiled in AIR with support of Stage3D and uses ND2D as a 2D framework for Stage3D.
It exports the level data in a xml file so it can be used for many types of 2D games.
It took me a couple of weeks to build. I actually build it while coding the engine as both are tightly linked.

The reason why I chose ND2D over Starling is that the former was more powerful when I started working on it. I also liked the material approach of it and it was packed with much more features than Starling.

Features

I’m quite satisfied with what I have done on this editor, it has all the basic features one developer could need to start building maps/levels for his/her game.
There are still a couple of features that I would like to implement and the approach I took on a couple of things (like animated textures) could be improved. I had very little time and I always chose the path that would get the job done as soon as possible. But I think it can still be used quite intuitively, as long as you have some basic knowledge about game programming.

Amongst other things, here are the most notable features of the editor:

• edit world boundaries
• edit grid properties
• layer system (it actually appeared quite late in the process)
  • really helpful as it allows to separate the different elements of a map
  • it also allows for optimizations during the rendering if one uses the same texture on every object of a same layer (batching)
  • can be used as a parallax system based on the movement of the camera (ex: layers in back can be set to follow the camera to a certain extend, giving an intuitive parallax effect)
• object system, everything on a map is an object:
  • Sprite2D: a simple image object
  • ParticleSystem2D: a particle system that uses the graphic card to compute the transformation of each particle (almost 0% of cpu used)
  • CouldParticleSystem: a particle system that uses Sprite2DCloud (ND2D object) to render particles (uses more cpu but we have total control over each particle)
  • CollisionSystem: an object that allows to set up collisions vectors for an object (see picture below)
  • TriggerSystem: an object that is triggered (once or every time) when an other objects (can be the player) is colliding it
  • RibbonTrail: a special object that I used to build the tail of the dragon. It’s kind of a dynamic ribbon.
• prefab system: you can create a prefab object out of any other object. This allows reuse of sets of objects (like a mountain made from several other Sprite2D objects)
• properties panel: every object has its own properties that can be edited
• textures panel: load/unload textures, link atlases to them, preview them.
• animated textures panel: create animated textures from a texture that has an atlas linked to it. It currently automatically create an animation from a set of textures that has a same name and that ends with a number (ex: anim1_0001, anim1_0002, …)
• intuitive editing of objects: this took me a while to figure it out (especially for the objects with nested objects inside of them). You can scale and position objects with your mouse as you would do it in any other image editor.

CollisionSystem object in action, simply set up the boundaries of an object

Final result and social approach

After months of work and changes, we were finally seeing the end of it. The concept had changed, as well as the whole atmosphere of the game. We started from a simple retro-snake-like game to a full High Definition kind-of-adventure game using the latest Stage3D technology.
Most of the engine was ready and the editor was stable, we could start making the levels and work on fine tuning the gameplay. We didn’t have much time left, we were already super late, so a couple of things that we wanted to add had to be left away. There are still a couple of improvements that could be made to the engine and the map editor but it works well and I’m pretty proud of them.

In total, we have 4 different levels with different atmospheres, several items to catch (points, speed, slow, souls and special items), meteors that fall from the sky, obstacles to avoid, special zones to recharge the energy of the dragon and a dragon that has 4 different states with 4 different visual effects (see “dragon on fire” above) for each of them.

Social approach and the “soul” system

The game is only playable over Facebook, for several reasons I won’t explain here (mostly marketing reasons), but one good thing about it is the social approach you can add to the game. Like every game on Facebook, you can compare your score with your friends or with everyone. But we wanted something more.

As it is only playable alone, we wanted to allow people to change the gameplay of a map to a certain extend. With this in mind, we added the “soul” system: every time you die, your soul appears on the map (were you died) and will be available for your friends to pick up. By doing so, they earn the life that you lost. This brings a whole new area of possibilities for the players as they only earn 1 life every 12 hours. By dying, you not only lose a chance to win but you give it to your friends.

Another cool thing about this soul system is that you can leave a message to the friend that will pick up your soul.

Credits

Enough of writing, this was a really big, dense and exhausting project. There are so many things I learned, and now, with a bit more distance, I can see that I’m happy I did it and (that doesn’t happen often) I’m proud of the result.
So let’s give some place to the people who worked on the project:

Uzful: French Communication Agency (conception and project management)
Reed.be (which I’m part of): Belgian Communication Gang (conception, creation, production and project management)

Thanks to everyone.

http://blog.comtaste.com/2008/11/how_to_know_who_called_my_acti.html

But I’ll try to be objective and I’ll start with what I think is a lack of consistency.

No consistency

No, absolutely none. Whether you’re on a canvas page (application canvas page), an application tab or outside Facebook on a “Facebook Connect” site (should probably be named “Facebook Graph” now…), this thing just doesn’t work the same way at all (well it does more and more to be honest)

I appreciate the efforts made by Facebook to bring some consistency to the whole Facebook concept but this is far from being done and all those bugs and changes that happen at any time without even any warning make it really hard for developers and people to use it right.

But what does Facebook bring to developers ?

In case you don’t really know I’ll explain it very shortly:
basically, it enables any Facebook application (any kind of external websites, fan pages and application pages) to allow you to connect to them with your facebook account. In that way, you allow them to use your facebook data (depending on the authorizations that you provided).
Amongst others, they can:

• get your friends data
  
• get your posts
• get your likes
• get your links
• set/get your status
• get your name, first name, last name
• get your sex
• get your language
• get your location
• post messages on your wall or on friend’s wall on your behalf
  
• … and many, many other things.

The concept is full of possibilities and looks great, but the Facebook platform is in the way.

Things that don’t work right or why is it a “seem to be really badly developed platform”

In a few bullet points, I’ll try to write down what I actually feel when developing on Facebook:

• it feels like you can’t use all the possibilities Facebook claims to bring the way you would have wanted it, meaning in an “open way” (the way they claim it is)
• it also feels like you sometimes have less possibilities inside of Facebook than outside of it.
• lack of consistency between what can be done inside and outside of Facebook. Application tab page doesn’t allow you to do the same things than in an application canvas page (and we are still inside of Facebook), while outside of Facebook, thoses limitations seem to have disappeared. Why being outside of Facebook would give you more “power” than being inside of it ?
• things are unclear and you need hours to get to do something that would have taken 5 minutes to explain.
• not every functions provided by the Facebook API work the same way inside and outside of Facebook. Sometimes it doesn’t even work, and this sometimes happen to be inside of Facebook… (ex: friends invite in application tab)
• The workflow doesn’t seem logical at all (invites, stream publish, status change,…)
• FBML, IFrame, HTML, no HTML, etc… this complicates everything. Even their “own” JavaScript (”FBJS”) makes it very difficult to do something right. Sometimes it’s even impossible (try to dynamically change the height of a flash movie)
• “one day it works, the other it doesn’t“. Changes happen any time. Sometimes it even breaks your application and you can’t do nothing about it except post a message on a forum and hope for it to return to it’s “normal” state.
• etc…

In overall, this is the lack of consistency and stability that makes developing on Facebook a real nightmare. You spend hours and days trying to find a way to do something that should be very easy to do and sometimes you end up realizing that there is a bug that still hasn’t been solved since last year or that it is just impossible to do while on a “normal” website it would have been a trivial thing to do.
When reading forums, I always see people wondering how this or that can be done and I’m always surprised to see all the people who have tried numerous “hacks” that don’t seem to work for everyone or at all any more…

You know, I can understand why it has been developed like “this” or “that” or how can a program become an ugly thing that is lacking consistency, I’m a developer as well, but when they make so much money, I think the least they can do is to make something consistent and ergonomic.
What they don’t seem to be able to do.

And what ?

I know… and what ? where does this lead ? I don’t know, just to more honesty. And I think honesty change people.

Some thoughts on Facebook and e-social

To be honest, I’m not a big “e-social” guy. Some people even like to tell me that I’m not very “social” in general but I don’t think so. I just don’t want to need to appear “good” or “happy” or “productive” or “confident” or “social” or “open”, … . I just don’t really want to play this game. Or maybe I do.

But what does that mean to be “social” ? according to Wikipedia, it “refers to the interaction of organisms with other organisms and to their collective co-existence“. In other words, it means to be “interactive”.

I won’t explain my whole point of view about our Universe and who we are, but simply said: we are all molecules, atoms, particles, matter and thus, according to Einstein, energy.
In this way, it doesn’t really matter whether we are interacting with a flower, an insect or a human, as we are all the same in the end.

What I’m trying to show is that whatever we do, it is an interaction. The Universe is a big interaction, the law of Causality that we think we are all subject to.
In my opinion, interaction = relationship (as everything is interaction).

According to some philosophers, the meaning of relationships is a mirror in which to see yourself clearly. In other words, what we do, we do it to discover ourself, to learn about ourself. When we talk to someone, we do it to “see” ourself. Which I think is mostly true (not always)
I invite you to read this post on this subject as it is quite interesting.

My point is this: I don’t think we need all of this to realize ourself, to be happy. I think it is mostly “dressing” (”de la poudre aux yeux” in french) and doesn’t really bring what we are looking for in the end.

I’m not saying this whole thing is useless, I just think it is being misused and overused.

This is what I think Facebook brings: a false solution to a simple need. It is useful for many things but it is overused and most of the time misused. As internet is.

Facebook

I think Facebook is dangerous and interesting, open and limited.

On one hand it is reshaping the internet and the way we interact with people and “things” within and outside of it. They have brought a lot of good things and ideas but the openness they claim to have or to allow is not what they want us to think.

They close us to use their “widgets” and to “like” things the way they want us to like them. This also brings some kind of consistency (in the end ;)) all over the web and that is a good thing.

On the other hand, I’m a bit sad to see this. To see that it is now becoming the only way to “be”, to “like”, to “hate”, to be “social”. I’m a bit pessimistic here and probably talking like this was the only thing existing on earth to communicate but I find it sad that people put so much importance in it.

So why am I developing on Facebook then ?

To make money ! and also because it’s interesting. But I also think I would feel less frustrated if I would be developing on Facebook without a client behind my back.

I take absolutely no credits for what I have done as it’s a pure copy of what this guy did. I just needed to re-do it in order to understand and see how it works and how this perlin noise effect works in flash. You know, working with flash is cool but when you start hearing about perlin noise effect and other sorts of effects, you just automatically calm down and say “yeah, this can be done, but… is it fast on rendering ?”
Well, I have to admit that I was pretty surprised. This is doing ok.

This is how it looks.

This is not a real copy of what can be found on Oaxoa blog, I actually tried to optimize it a bit and take only the things I needed. I’m using vectors to speed up this thing a bit and instead of using a gradient bitmap to smooth the effect on the border, I use a math function. I hope this helps by not having to draw a vector on a BitmapData on each frame.

A lot of things can be customized:

• number of children and their life time
• thickness of lightning
• starting and ending positions
• steps of rendering: the more steps, the less straight this would look
• wavelengths and amplitudes of effect
• etc…

In a few words

How this works ?
It uses the perlinNoise() function that you can find in a BitmapData object. This function produces a Perlin Noise image that you can control in many ways. The black and white noise (can be specified) that it creates allows us to have a “map” of negative and positive positions whether a pixel is black or white (grey being the “middle” or 0). We then use this map to get this wave effect.
Two maps are actually being used. One for the main, “big”, wave and an other one for the small disturbance effect that can be seen on that main wave.

You can grab the sources below but I heavily recommend you to visit Oaxoa blog as there are many interesting things to learn.

And for more convenience, here is the as3 source code of the Lightning class (it still needs the EventsManager class and a couple of other classes that can be found in the archive to work)

package rabbit.effects.lightning
{
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.TimerEvent;
	import flash.geom.Point;
	import flash.utils.Timer;
	import rabbit.managers.events.EventsManager;
	import rabbit.utils.UniqueIdUtil;

	/**
	 * ...
	 * @author Thomas John (@) thomas.john@open-design.be
	 * @copyright Copyright Thomas John, all rights reserved 2009.
	 */
	public class Lightning extends Sprite
	{
		private var eManager:EventsManager = EventsManager.getInstance();
		private var eventGroup:String = "";

		public var bTest1:Bitmap;
		public var bTest2:Bitmap;

		public var bd1:BitmapData;
		public var bd2:BitmapData;

		public var seed1:int = 0;
		public var seed2:int = 0;

		public var aOffsetsBd1:Array;
		public var aOffsetsBd2:Array;

		public static var vStepsAll:Vector.<Point> = new Vector.<Point>();
		public var vSteps:Vector.<Point>;
		public var vChildren:Vector.<Lightning> = new Vector.<Lightning>();

		public var _startX:Number = 250.0;
		public var _startY:Number = 250.0;
		public var _endX:Number = 10.0;
		public var _endY:Number = 100.0;
		public var _speed1:Number = 0.02;
		public var _speed2:Number = 0.02;
		private var _steps:int = 0;
		public var _wavelength1:Number = 0.05;
		public var _wavelength2:Number = 0.4;
		public var _amplitude1:Number = 0.08;
		public var _amplitude2:Number = 0.6;

		public var _thickness:Number = 2.0;
		public var _color:Number = 0xFFFFFF;
		public var _alpha:Number = 1.0;

		public var angle:Number = 0.0;
		public var len:Number = 0.0;
		public var dx:Number = 0.0;
		public var dy:Number = 0.0;

		public var bIsChild:Boolean = false;
		public var parentLightning:Lightning;
		public var _stepStart:int;
		public var _stepEnd:int;
		public var _graphics:Graphics;

		public var timer:Timer = new Timer(3000);

		public var bAllowUpdate:Boolean = true;

		public function Lightning()
		{
			eventGroup = UniqueIdUtil.getUniqueId(8);
			//_speed1 *= 0.25;
			//_speed2 *= 0.25;
			eManager.add(timer, TimerEvent.TIMER, timer_timerHandler, eventGroup);
			//eManager.add(eManager, Event.REMOVED, steps_removedHandler, eventGroup);
		}

		//private function steps_removedHandler(e:Event):void
		//{
			//timer_timerHandler(null);
		//}

		private function timer_timerHandler(e:Event):void
		{
			getNewStepsFromParent();

			var i:int = 0;
			var n:int = vChildren.length;

			for (i = 0; i < n; i++)
			{
				vChildren[i].getNewStepsFromParent();
			}

			timer.stop();
			timer.reset();
			timer.delay = 1000 + Math.random() * 4000;
			timer.start();
		}

		public function getNewStepsFromParent():void
		{
			_stepStart = Math.floor(Math.random() * (parentLightning.steps - 2));
			_stepEnd = _stepStart + Math.floor(Math.random() * (parentLightning.steps - _stepStart - 2)) + 2;

			//trace("getNewStepsFromParent", _stepStart, _stepEnd);

			if ( _stepStart > _stepEnd || _stepStart < 0 || _stepEnd >= parentLightning.steps )
			{
				bAllowUpdate = false;
			}
			else
			{
				bAllowUpdate = true;
				steps = (_stepEnd - _stepStart) * 1;
			}
		}

		public function init():void
		{
			if( _steps <= 0 ) steps = 50;

			seed1 = Math.round(Math.random() * 100);
			seed2 = Math.round(Math.random() * 100);

			aOffsetsBd1 = [new Point(0, 0), new Point(0, 0)];
			aOffsetsBd2 = [new Point(0, 0), new Point(0, 0)];

			if ( !_graphics ) _graphics = graphics;

			//if ( !bIsChild )
			//{
				//bTest1 = new Bitmap(bd1);
				//bTest1.smoothing = true;
				//bTest1.y = _endY + 100;
				//bTest1.width = 200;
				//bTest1.height = 200;
				//addChild(bTest1);
				//
				//bTest2 = new Bitmap(bd2);
				//bTest2.smoothing = true;
				//bTest2.y = _endY + 310;
				//bTest2.width = 200;
				//bTest2.height = 200;
				//addChild(bTest2);
			//}

		}

		public function kill():void
		{
			eManager.removeAllFromGroup(eventGroup);
			//removeStepsFromVector();
		}

		public function update():void
		{
			if ( !bAllowUpdate ) return;

			//_speed1 += 0.0001;
			//_speed2 += 0.0001;
			//trace(_speed1, _speed2);

			if ( bIsChild )
			{
				_startX = parentLightning.vSteps[_stepStart].x;
				_startY = parentLightning.vSteps[_stepStart].y;
				_endX = parentLightning.vSteps[_stepEnd].x;
				_endY = parentLightning.vSteps[_stepEnd].y;
				angle = parentLightning.angle;
			}
			else
			{
				angle = Math.atan2(_endY - _startY, _endX - _startX);
			}

			//trace(angle);

			dx = _endX - _startX;
			dy = _endY - _startY;
			len = Math.sqrt(dx * dx + dy * dy);

			aOffsetsBd1[0].x -= _steps * _speed1;
			aOffsetsBd1[0].y += _steps * _speed1;

			aOffsetsBd2[0].x -= _steps * _speed2;
			aOffsetsBd2[0].y += _steps * _speed2;

			bd1.perlinNoise(_steps * _wavelength1, 0, 2, seed1, false, true, 0, true, aOffsetsBd1);
			bd2.perlinNoise(_steps * _wavelength2, 0, 2, seed2, false, true, 0, true, aOffsetsBd2);

			render();

			var i:int = 0;
			var n:int = vChildren.length;

			for (i = 0; i < n; i++)
			{
				vChildren[i].update();
			}
		}

		public function render():void
		{
			if ( !bIsChild )
			{
				_graphics.clear();
				_graphics.lineStyle(_thickness, _color, _alpha);
			}
			else
			{
				//_graphics.lineStyle(_thickness, _color, Math.random() * _alpha);
				_graphics.lineStyle(_thickness, _color, _alpha);
			}
			//_alpha = 0.25 + Math.random() * 0.75;
			//_thickness = 0.5 + Math.random() * 2.5;

			//_graphics.lineStyle(_thickness, _color, _alpha);

			_graphics.moveTo(_startX, _startY);

			var i:int = 0;
			var c:Number = 0.0;
			var cx:Number;
			var cy:Number;
			var c2:Number = 0.0;
			var cx2:Number;
			var cy2:Number;
			var m:Number = 1.0;
			var p:Point;

			for (i = 0; i < _steps; i++)
			{
				c = (bd1.getPixel(i, 0) - 0x808080) / 0xFFFFFF * len * _amplitude1;
				cx = Math.sin(angle) * c;
				cy = Math.cos(angle) * c;

				c2 = (bd2.getPixel(i, 0) - 0x808080) / 0xFFFFFF * len * _amplitude2;
				cx2 = Math.sin(angle) * c2;
				cy2 = Math.cos(angle) * c2;

				m = Math.sin((Math.PI * (i / (_steps-1))));

				cx *= m;
				cy *= m;

				cx2 *= m;
				cy2 *= m;

				cx = _startX + dx / (_steps - 1) * i + cx + cx2;
				cy = _startY + dy / (_steps - 1) * i - cy - cy2;

				p = vSteps[i];
				p.x = cx;
				p.y = cy;

				//_graphics.lineStyle(_thickness, _color, m);

				_graphics.lineTo(cx, cy);
			}

			if ( !bIsChild )
			{
				_graphics.endFill();
			}

		}

		public function child_create():Lightning
		{
			var l:Lightning = new Lightning();
			l.setAsChild(this);
			vChildren.push(l);

			return l;
		}

		public function setAsChild(parent:Lightning):void
		{
			bIsChild = true;
			parentLightning = parent;
			_graphics = parentLightning._graphics;
			if( parentLightning.parentLightning ) _thickness = parentLightning._thickness * 0.5;
			//_thickness = Math.random() * parentLightning._thickness;
			_color = parentLightning._color;
			//if( _thickness < 1 ) _alpha = parentLightning._alpha * 0.5;
			if( parentLightning.parentLightning ) _alpha = parentLightning._alpha * 0.5;
			//_alpha = parentLightning._alpha * Math.random();
			//_amplitude1 = parentLightning._amplitude1 * 0.5;
			//_amplitude2 = parentLightning._amplitude2 * (Math.random() * 2.0);
			//_speed1 = parentLightning._speed1 * -1.0;
			//_speed2 = parentLightning._speed2 * -1.0;
			//_wavelength1 = parentLightning._wavelength1 * 0.5;
			//_wavelength2 = parentLightning._wavelength2 * 0.5;
			getNewStepsFromParent();
			init();

			timer.start();
		}

		//public function removeStepsFromVector():void
		//{
			//if ( !vSteps ) return;
			//
			//var i:int = 0;
			//var n:int = vSteps.length;
			//var index:int;
			//
			//for (i = 0; i < n; i++)
			//{
				//index = vStepsAll.indexOf(vSteps[i]);
				//if ( index ) vStepsAll.splice(index, 1);
			//}
			//
			//eManager.dispatchEvent(new Event(Event.REMOVED));
		//}

		public function get steps():int { return _steps; }

		public function set steps(value:int):void
		{
			if ( _steps == value ) return;

			//trace(_steps, value);
			//if ( vSteps ) vSteps.splice(0, vSteps.length);
			//removeStepsFromVector();
			vSteps = new Vector.<Point>(value, true);

			var i:int = 0;
			var n:int = value;
			var p:Point;

			for (i = 0; i < n; i++)
			{
				p = new Point();
				vSteps[i] = p;
				//vStepsAll.push(p);
			}

			bd1 = new BitmapData(value, 1, false);
			bd2 = new BitmapData(value, 1, false);

			_steps = value;
		}
	}

}

Samsung is now promoting their new 3D Televisions and it was a great occasion to organise an event with plenty of things to win (like this Home Cinema full featured worth +- 6300 €) and a website with plenty of things to win as well (like this Home Cinema full featured worth +- 6300 €)… yeah I’m repeating myself, but it has been discovered that nothing else can be better to actually make you memorize something (interest is doing a great part in it, that’s why there are things to win, so everything is in place to make this thing a real success)

So, you’re not unaware that we are not going to give you those things for nothing… no, we want your soul in exchange. Give us you emails and you will, maybe, be able to go with one of those precious gifts we offer you.

… on a development level, what did I learn ? mhhh nothing really. I actually got to use my RabbitTween to do something that I used to show the potential of my tweening engine a few months ago. And it can be seen on the quizz page.

Here is a screen shot:

So, in a few words, this effects breaks down the letters of each question of the quizz to make them appear in a tornado effect in 3D. All done with RabbitTween.

What else ? same old nice parallax effect on the home page:

And a very cool Picture Gallery in 3D showing some of the pictures of the event:

Do the quizz and have fun!

So what’s the main purpose of this website ? sell more fanta… yeah but also entertain people. This channel regroups all the best fun videos on youtube and that’s pretty great actually.

A few words on the flash development though.
It isn’t really over glowing on the website but there is a smooth displacement effect on the big buttons on the home page (and other pages as well) that makes them feel like paper.

And the smooth parallax effect you can see when you move the mouse (earth rotates as well as other elements) has been done in Flash9 (AS3).
If I point it out, it’s because it can’t be done using the rotation property of a movie clip as it doesn’t make it rotate smoothly. Why ? because the MovieClip is too big and a small rotation change in the center becomes bigger on the edge of the MovieClip and it seems that the precision of the rotation property is not enough for big MovieClips.

So how did I do ? simply by using the Matrix property of the transform property of my MovieClip objects.

All of that using the RabbitTween engine (downloadable on this blog)

Have fun!

In a few words:
take a song of Johnny Cash (Ain’t no grave can hold my body down) and allow people to redraw each frame of the video clip. This gives a really good hand drawn video clip in black and white. All drawn by people from all around the world. My participation is at frame 44.

If you google it, you’ll find plenty of people telling about their story and how they solved it.

Here is mine:
I tried to call a static function from a static class with other functions working perfectly well. When I created this new function and tried to call it, I would get this 1006 “… not a function” error.
The trick was that I was using this class in a externally loaded movie clip. I didn’t think to recompile the main (parent) movie clip with the new static function in the class.
It’s always the classes from the main movie clip that are used.

Today I present the new website I worked on: Blue Your Friends for Volkswagen.
Design and video from 1MD. Flash development and the facebook integration stuff (facilitated by Vinch from 1MD) by me.

The idea is simple and provocative (but what is provocative nowadays anyway ?)

So yeah, provocative and humoristic. Good enough. I really like the professionalism of the video (Belgian production, let’s say it) and the tone of it. The design, as always with 1MD, is nice and sober.
I have to say that people might have difficulties to get to the point or to stay focused as it is a long video (maybe too long) and the whole thing goes to fast (too many informations in short periods of time) but it is still a good one.

So in a couple of words: a good website, a good video, a good company with good cars and 3 IPads from Apple to win…
Everything based on your facebook account, on your personal data. Just for fun.

A couple of screenshots for posterity:

Link: http://www.blueyourfriends.com/
Realization: 1MD
Flash development: Thomas John (http://blog.open-design.be).
Sales: [BWAT]

And if this doesn’t solve your problem then you might have this problem:
Two symbols having the same Class name. I know, flash doesn’t allow that but when assigning a base class to a bunch of symbols, it might happen as it happened for me (I renamed a few symbols after having given them a class name). Normally flash tells you but sometimes it doesn’t…