F&N Kinect Singapore Dance Delight from Kinetic Singapore on Vimeo.

For a change, how about dancers seeing themselves and their moves in a whole new light? An installation was built to wow and delight dancers using the Microsoft Kinect. Dancers are transported into a whole new world of colour and psychedelic fun.

Dancers are transformed into colourful bubbles which react and replicate the dancers’ moves. As dancers groove to the music, sounds will be triggered. Depending on which screen region the dancer move to and trigger, different pitches will be produced, leading to a unique mish-mash of creative sounds and movements. A first of first in many ways, the result is an unforgettable experience for the dancers and the audience.

Winning an FWA has always been my dream and thanks to the great work of my colleagues at Kinetic Singapore, we won an FWA for DevilYogurt.com.

Check it out if you have the time, and enjoy creating your own Devil Yogurt.

http://www.devilyogurt.com

AGENCY : Kinetic Design & Advertising
CREATIVE DIRECTOR : Pann Lim / Jonathan Yuen
ART DIRECTOR : Leng Soh / Driv Loo
PLANNER : Jac Tan
COPY WRITER : Eugene Tan
DESIGNER : Esther Goh
PROGRAMER : Edwin Toh

Do let me know if you have a site that is better, and should be listed here.

Smashing Magazine
Noupe
Hong Kiat
10Steps
Design Reviver
WebDesignerDepot
Queness
Script & Style
DevSnippets
WebDeveloperJuice
David Walsh’s Blog
The TUTS network (as I call it)
Web Designer Wall
A List Apart
Abduzeedo – Contributed by Math.Basset

I was thinking of taking a screenshot of each website to make up this post, but I figured if I do get down to doing it, this blog post will never see the light of day, so here it is. In the no frills version.

Once again, if you know of a site that deserver to be in this list, and in all web designers’ bookmarks, leave a comment!

If this post helped you in any way, help me in return by clicking on the ad below:

The first is 100 (Legal) Sources for Free Stock Images.

The next one is 77 Resources to Simplify your Life as a Web Designer.

Those beautiful lines of motion we often see in Motion Graphics or the beautiful lines in the background of the nice postcard you get in Far East shops can now be done by you!

Check it out here.

The problem with the tutorial though, is that I think it only works with the colours the author gave. I’m sure if I picked my own colours, it will turn out a lot worse, since I suck at colour theory. If there is a bunch of colour palettes to go with this tutorial, then it will be perfect.

And my little project is on the backfoot a little due to a freelance job I got recently. In my current situation, I’m taking any freelance job I can.

I didn’t have the time to check it out, but now that I did, I wished that I had checked it out earlier!

The link to the documentation is: http://www.brendandawes.com/dsf2/

The link to download the class is: http://www.brendandawes.com/downloads/dsf2.zip

What can you do with this you ask?

Lots!!!

To start with, it has a custom function for loading images.

This is what it does:
Loads an image into a MovieClip complete with a left to right progress bar and then fades the image up when it’s loaded

What your code will look like:

var i:Image = new Image(instanceName,1);
i.loadImage(“image.jpg”,true,true,false);

Isn’t that convenient? There are more functions and classes in this pack which I haven’t go through in detail yet. But I think I definitely will post something about this soon.

Stage.scaleMode = “noScale”;
Stage.align = “TL”;

The rest depends on your publish settings(Ctrl + Shift + F12). What you need to do is to set the width and height to 100 Percent. Remember to change the dimensions to percentage.

I’ve attached a file, which I don’t remember where I got from. =x

The code features a onResize Handler, which is important for full screen flash as well. This is because you need this listener to check if the user resized the browser, then change the positions of the elements in the SWF accordingly.

The flash file contains the HTML, the SWF, and the FLA file for this. In the center, is a text field containing the dimensions of the Flash. Open the index.html and try resizing the browser, and you will see that the text field will always be in the center. This is done by adding lines of code to set the _x and _y of the text field within the onResize handler.

this.onResize = function() {
//– Called when browser is resized.
this.txtDimentions._x = (Stage.width/2)-(this.txtDimentions._width/2);
this.txtDimentions._y = (Stage.height/2)-(this.txtDimentions._height/2);
this.txtDimentions.text = Stage.width+”x”+Stage.height;
};

I hope you guys enjoyed this little tutorial. A lot of people have asked me how I did QwertyDesign, and well, here is the base of what started QD.net.

Project Files: FullBrowserFlash

This is a lazy post. This post only contain a link.

AjaxRain
MiniAjax