my Flash Portal

Create 2D animation with Flash

2012-12-04T10:11:00.000+08:00

ToonBoom
http://www.toonboom.com/main/
Toon Boom Studio is ideal for individuals looking for an all-in-one animation software. From drawing digitally, scanning hand-drawn animations or seamlessly importing existing artwork, Studio enables you to lip-sync your animation, setup the action in a 3D space and publish your animation projects for TV, HDTV, the Web and iPod!

Skillrex Quest

2012-11-30T14:54:00.000+08:00

Skillrex Quest
Just as you have last heard a great work from this side of the world (Flash), JODA mashed two of the seemingly impossible genre together, RPG and Skillrex (dubstep). The site is an adver-game with a very high production value as you will notice a lot of homeage to tradiitional video game characters and sound effects. Check out Nothing Gonna Stop Me Now also.

via HN

FIFA Development Globe

2012-11-22T15:10:00.001+08:00

FIFA Development Globe
A visulisation of FIFA’s development around the world that can be viewed in fullscreen.

AS3 - Getting FlashVars (variable) from HTML to SWF

2012-11-20T12:05:00.001+08:00

Have you ever scratch your head wondering how you could pass data from HTML files to SWF?
Found a discussion on Stackoverflow that enables that.

View the solution on StackOverflow

Draw an arc inside a square

2012-11-17T23:39:00.001+08:00

Below is a snippet on how you can draw arcs on four corner inside a square.
Why would you do that? Imagine you are designing a storytelling tutorial which requires you to dim down the entire scene, and then carve a rounded corner square within the “dimmed” screen.

Think of CityVille’s tutorial mode in Facebook games.

View Code snippet - Draw an Arc inside a Square on Snipplr

Adobe AIR 3.5 released

2012-11-17T22:49:00.001+08:00

If you are an avid developer that is looking to create content for mobile devices, rejoice as the latest version of Adobe AIR adds support for Jellybean devices and iOS6.

Adobe AIR 3.5 is released for download at Adobe’s website.
Download Adobe AIR 3.5

Changes of usage of _autoAlpha in Tweener AS3

2008-07-06T23:53:00.003+08:00

This has to be a post I need to make to remind myself in the future. I almost wet my pants when I found my code to automatically hide an object invisibility, doesn’t work in AS3 anymore.
The usual code is like...

Tweener.addTween(myMC, {_autoAlpha:1,time:1,transition:"linear"})

in which there is no problem with the syntax. But upon searching through the vast sea of internet. This post at http://lists.caurinauebi.com/pipermail/tweener-caurinauebi.com/2007-October/000293.html

enlighten my life that most of the special parameter that is not “official” will need an intialisation like :

import caurina.transitions.properties.DisplayShortcuts;
DisplayShortcuts.init();

Same, as the poster commented, hated to do these initialisation. But for the goodness sake of the API growth, it will help to keep the main API non-polluted, so to speak. My god.

Update : 8th July 2008
Got into more tips on using _Blur_blurX instead of the usual _blur_blurX now from this blog comment. And of course, you need to initalize your Tweener script once before using it.

import caurina.transitions.properties.FilterShortcuts;
FilterShortcuts.init();

Thanks for voting

2008-06-20T11:50:00.001+08:00

Again I would like to express my gratitude over the weekend on your stay here. Of course at the same time I'm interested to share my knowledge over my slow transition from AS2 to AS3.

Best use of interactive media, yet.

2008-06-20T11:42:00.002+08:00

Uniqlock
I am always impressed by my fellow mentors from the East in creating creative campaigns for brands, be it big or small. I would rather say it is unconventional that is what makes this campaign so big and successful, and there is countless websites that has already reviewed on the campign itself, but I wouldn't want to talk on it again. Somehow it does proves the fact that something that walks along the line of beautiful, pretty, soft-core, but yet usable-effective idea, will be 'possibly' successful, the rest depends on how is the brand trusting the agency in implementing mind blowing ideas or execution.

Case study
The video that explains the campaign in short. In about 1 minute.

Innovation Within Mind

2008-06-20T11:27:00.009+08:00

floe
One of the most amazing stuff that you can always do with Flash is to present an idea through motion, sound or poetry, and in return, influence people to change for better. This is one of the initiatives to encourage individuals to take action in curbing the global warming issue.

World's first balloon race
Probably this would be one of the most clueless site that I have been to so far, in terms of how they are going to implement the event. It is a global event which encourages participant to place a widget on their website to entitle for racers to go through their website when the race starts. Only 3 Days to go. Did you take part?

Thermo
It is a project that is still kept under wrapped by Adobe themselves, but from what we can see from the wiki site itself, it is something that allows designer to create rich internet application with ease without spending too much effort into hacking or pulling their hair off. Looks promising at this point of time.

You Be The Driver
I wouldn't say or claim that this site will have something that is technologically mindblowing to keep you within the site, but the game itself is good and polished enough to keep you entertained. That includes the visuals designed inside.

Moodstream - by Getty Images
What would be the best search engine to your content? Some might say Google, but this tool would be appealing towards designers because it allows user to search through their feeling, that a generic search might not be able to replicate, in terms of what you really want to find. A very great approach to help stock image finder. This perhaps will inspire a lot of Flash designers or developers in looking to build more visual search engines.

Joshua Davis Presentation Workshop Slides
Something to share.

SWFAddress

2008-06-20T11:19:00.002+08:00

SWFAddress - Deep Linking For Flash (and ajax)
Horray! The days of Flash bashing is (almost) over! And the complains has always been made that there is no possibility to deep linking inside Flash, that hurts when you want to bookmark a 'certain' area on a very cool flash site. Probably what is worse when you are going through a shopping cart and wanted to go back and forth using the browser's back and forward button. This has come to shed 'some' light to you. Upon a quick look inside the implementation. It would be applicable to corporate or portfolio sites, which normally uses 'label' for targetting from one section to another, because for this to work, we will have to use 'anchor' inside Flash, just like how HTML's anchor link works.

For example, an anchor link in HTML looks like...
link
and then it will directly bring the user towards the relevant page.
This applies that the almost similiar function will appear using SWFAddress.

Geoquake - Driving virtually

2008-06-20T11:08:00.003+08:00

GeoQuake - Driving on Google Maps
This is one of the crazy invention from our fellow friend from the East that came up with a mashup of both driving simulator and Google Maps. What happens here is, he started off with building a parking simulation game in Flash, and then ended up applying the Google Maps Flash API. And it became something entirely new, and perhaps, useful! You could probably virutally drive to the place you want to be in advance before reaching there? I'm wondering how hard would it be to implement hit test on this global map, probably something that the Google team can work out to team up with someone and build literally, a driving simulation game. Hmm... I wouldn't want to drive onto the ocean.

Flash Player 10 on its way

2008-06-13T15:39:00.006+08:00

The way we are all looking right on the platform is heading, full fledge 3d environment. Some of us might have been blasted with some magnificent overwhelmingly great 3d flash sites, but most of them still share one problem in common, limitation of the browser and software rendered 3d. This upcoming version shows a lot of promise that probably 'developer' are always wanting to explore. Designers might find their way through this as well, a whole world of new possibilities. No more prerendered 3d videos.

We are finding the path are either blurred so much that it emerged in between flash, website and 3d gaming on pc. Or even mobile. I wouldn't be surprised in the future (it is happening now) that there will be an entirely new market for creating 3d casual games through Flash and people buying accounts online, entirely, look at how Playstation Network, WiiWare from Nintendo and even Microsoft Xbox Live Arcade is expanding.

Flash Player 10 Demo | Flash Player 9 Demo
Some short write up on the Alternativa platform on this on chewing pixels. They even had a news release on the site launch.

Newsground Sugar Glider
Look on the above example, some of us might or not, heard of the other underdog of 3d in the Flash industry, known as Away3D.

Fifa Street 3

Green Planet
Though of course some of the big player like North Kingdom and Lessrain has been implementing it on their commercial projects. I did take a quick look into it, and certainly the learning curve it less steeper compared to the ever popular Papervision3D. Of course certainly the game might not be as exciting as what we can expect, but there is a lot whole some of thing to except with this new possibilities!

Ecodazoo
Though I had no freaking idea which engine they might use for this, it is certainly fabulous, on both the idea and execution for this agency site. Amazing I would say. You can rotate the book around to see from all angles of its transition. Thanks Kai for sharing.

Bowling Buddies
But fear not, one of the most polished 3D flash game to date would be this I will say. But sadly this can only be accessed through Facebook App, if you only have facebook account. But this also means that a lot of working opportunities will be open in the future for game developers.

Panorama For The Office
Upon browsing through the sea of informations, I found through this article from Blitz Agency that is kind enough to share with us their techniques in building a VR Tour using Flash and Papervision3D.

André Michelle
If you browse deep enough nito André Michelle's library, you will notice some of the newer work compromised of very hardcore 3D driving games in Flash. For example the FunCup.

Spectra
One of the most innovatively used, visually exciting and usable newsreader. I'm impressed. This would be great if the news source are not just restricted to one.

Download Flash Player 10
The link above will lead you towards the download page for the beta player. I'd suggest you get the ActiveX version of the Flash Player to view the SWF in your desktop, so it wouldn't interfere with your browser plugin that you are currently using. It is certainly very exciting future ahead for Flash.

Some more resources for your consumption :

Disclaimer : Do this the correct way and no harm will occur, and I take no responsibility in any manner if you just being unlucky screwing up your computer.

[Freebies] jumbleText Class - make your text dance

2008-06-11T11:18:00.005+08:00

jumbleText Class (v1.0 11 June 2008)
Hi there everyone, I’m hereby would like to share with you my first humble experience in creating a class for AS2.0, namely jumbleText.as which you can download at :
http://www.manmeng.net/fun/jumbleText.zip

What it does?
Takes up your text and jumble it up in a bunch of gibberish and then slowly forming it back to the original text. Look at...matrix? or http://www.yugop.com

How does it look?
Here I have setup a sample page : http://www.manmeng.net/fun/jumbleText.swf

What is this?!
It’s an experimentation that I did back then to incorporate to my long overdued portfolio site, but I felt it’s best I share it to see how I can improve from here.

How do I use it?
I’m trying my best to make it as dumbproof and easy for user, but at this point, here are what it is needed (refer to screenshot on top as well).

Create a new font and link to “myfont”
import com.manmeng.misc.io or import.com.manmeng.misc.*
use an empty movie clip, probably name it, such as “mc”
use this... io.jumbleText(movieClipName, yourText, width, height, textColor, textSize)

And then you are ready to rock! Hope you will enjoy it. Any bugs report or suggestion please mail it to siaukia [at gmail dot com. I will port this to AS3 as well. Keep in tuned!

HelloRussia

2008-06-10T11:40:00.002+08:00

Instinct
I'm not quite sure if I ever will understand Russian, but this site needs no more than visual explanation to show you how weird it is, but in a good way, it's inspirational and the flash is top notch. Perhaps I would call this experimental, but for company portfolio site, well, it really depends. From the interactive agency known by RedKeds.

More goodness

2008-05-23T13:06:00.024+08:00

Enabling Mousewh eel on Flash (AS3)
Pixelbreaker is kind enough to show us the light towards enabling mousewheel on MacOSX! Finally after years of anticipation. But on the other hand I am also hoping there will be support for horizontal scrolling, and that would really revolutionize on how navigation will going to be created. Thanks!

Tag Galaxy
A very innovative (note the word innovative) way of presenting a metaphor of 'searching' through categories of pictures. I am impressed by the presentation and usage of PV3D here, but on the same time, what impressed me is the concept behind that makes good use of a metaphor , planets vs. related keywords. Instead of displaying only text, this site gives you a good idea on 'related' planet nearby. Awesome. Additionally, the navigation is very usable. Note the history/back option.

foedus
A list of hardcore but detailed work to be precise is in it's bucket here. I'm always impressed by how subtle the designs is but without the elements present in their work, it will be just another plain-jane site. Serves as a good design inspiration as well.

From all fancy looking sites and sounds, perhaps you might interested to do some reading on the dark side of Flash that is contributing towards the Web2.0 webosphere.

Get Out And Play
One of the cool looking and fun site I have stumbled across throughout this year. On the first look, I never realized it would be a marketing campaign site by Nokia, to rebrand the Ngage plat form which serves like an online marketplace for gamers to play and share. What is cool about this site is the clever use of conventional idea, but blends with some wicked twist, and a hell lot of effort. Note : the video.

Bar Da Boa
Some viral site takes us into creating fancy looking character and sends it to our friend, and back and forth. This one? Takes a look at tattoo and real time "tracking" of the text you input on the video that has the character.

Street Fighter
The classic fighting game is making a comeback this year. And that is with a big bang on our face. Probably you might start to ask me why I am talking about this site while it has nothing in spectacular about it's backend or glitters? But I would like to emphasize on the good use of media in this case, the video itself is a great selling point for the whole site, it's beautiful and...powerful. On the other hand, you might notice that there is a widespread usage on anchor link. the # symbol. It is especially crucial in these day where Flash is always questioned on it's realiability between switching forward and back inside a browser history. Look, a fine example.

Acrobat.com
No this not the usual annoying slow-loading pdf reader that we always used to hat...like? This time around, this site sure hits the bulls eye. Do not be fooled by it's plain looking introduction landing page. Wait until you go inside you can't stop your mouth from opening wide from the great thoughtful navigation for the users, and design. This site acts like a all-in-one manager for your documents just like how Google manages your emails, calenders, documents and so on, just that this one is in Flash, and it's 'exceptionally good'. Really.

White Void
A very inspiring studio that leads into some ground breaking interactive design work.

Nat Geo Offroad Challenge
And when I thought driving inside Flash has died down. Thanks to Kai for this. It feels

Goodness Inside

2008-05-06T15:30:00.008+08:00

Foundation AS3
Going through the ups and downs in Actionscript 2.0 is not like an overnight experience, I know and I understand. But time has to go and the new one has to come. Actionscript 3.0, is all of our nightmare. It's been year more than a year, perhaps even 2 or more. But I'm glad I found few resources that deemed helpful to me, that helped me built my first button in AS3! Yay. On the site itself you may find very helpful resources on the example file that you can do in AS3. But of course with the book guidance, it would be even easier and faster to learn than guessing each syntax. Enjoy.

On the other hand, after getting firmed up in basics of AS3, you might want to look into some interesting basics in Papervision 3D, which this site from Dennis Ippel gives you a heads up on how to quickly set an environment in AS3 + Papervision.

Singularity, the global web conference: October 24-26, 2008
Singularity is the first large-scale online web conference in the world.

Setting up FMS3
If you are into multiplayer-flash programs, Flash Media Server 3 would be the best choice, but the price itself might already kill half of your intention of doing something big, but on the other side, there is this open source engine known by the name Red5, an alternative. How awesome is doing multiplayer is? Look at :

Dofus
An online massively multiplayer game built on the Flash platform. It's excitingly beautiful!

Adobe, Make Some Noise

2008-05-06T14:33:00.004+08:00

Adobe, Make Some Noise
Interesting enough, this has start to slowly gain momentum in the Flash creative circle. What is this you ask ? Below is an extract on what it is all about...

“Adobe, MAKE SOME NOISE is a campaign, which addresses the lack of dynamic sound manipulation in Flash. ”

Nice I would say since this would kick some start at looking into some supersonic sounds application in the future. More robust one that enables us to input more microphone and control/detect level of treble/bass/frequencies.

Creating the right W3C validation Flash page

2008-05-06T10:32:00.003+08:00

Sometimes it just kills you to figure out on how to make the both world of Flash and HTML in one lovely space. But no matter how good you are in Flash, you will always bound to HTML in holding your lovely website. I wouldn’t say it is a burden to learn and adapt to the web standards, since it will not only help us, but the future of web.

There are of course various methods published on the web previously on how to create a valid page that embeds the Flash object, which is entirely different from what your Flash’s F12 can do.
I now introduce SWFObject, a very versatile javascript utility that makes your day shine brighter. Not only it embeds your flash file that complies to web standard. It’s being constantly developed and updated. Now on version 2!

But what surprised me is that they even provides you a dumb-proofed HTML generator that saves you a lot of hassle on figuring how to alter the original HTML template to fit your needs.
What can I say more? It’s one of the MUST-HAVE tool inside your personal Flash toolbox.

[Experiment] Sticky Particles /w Source

2008-04-26T04:26:00.004+08:00

Sticky Particle
Originally inspired by yugop on his creation @ amaztype. But that was years ago before BitmapData is even out. That really made me wonder what kind of algorithm he thought of to make this work. A pure genius.

Source file is in Adobe Flash CS3 Format, commented and available for download at :
[ Download FLA ]

Demo is viewable at :
[ View SWF ]

[Tips] Using Tweener

2008-04-23T21:37:00.014+08:00

I hope you are still having a good weekend through this week. And if you remember a few post back then regarding the usage of Tweener, it has became an essential tool for me, if not, a neccessity for me in building a Flash project, faster and more efficient.

Like the good ol’ MC TWEEN, a spiritual succesor towards Tweener, you can download the free class files at http://code.google.com/p/tweener/

In this post I will go through a sweet short usage introduction that is enough to entice you to try more. Compared to MC TWEEN, in which you will have always declare :

#include mc_tween.as;

...at the start of every flash file, contrary to Tweener, you have to only do this, just like importing class for BitmapData or BlurFilter. Like :

import caurina.transitions.*;

But how do you use it? Unlike, MC TWEEN that only requires installation through a MXP package (double click and install through Macromedia extension), you need to place the classes in a correct folder. I will share with you on how to prepare your Flash to use Tweener.

Step 1 : Go to Tweener website at http://code.google.com/p/tweener/

Step 2 : Click on Downloads, or alternatively, you can download directly from the Featured Downloads link at the right of the page.

Step 3 : Select the Class file that best suite your preference, I will choose AS2 at the moment, it shouldn’t differ too much with AS3.

Step 4 : Once the link is clicked, the download will proceed immediately. Unzip the folder to your Desktop/Finder after download is completed.

Step 5 : This step here is purely optional, but I practice this because it really help to boost up my productivity and organize my Flash Files altogether. Adapted from Lee Brimelow’s tutorial, I will usually have a “Flash” folder on my Desktop that stores all my external Classes (Papervision, etc etc) and my experimentats. In this case, I will put the extracted caurina folder into Classes for all my AS2 files, this applies to any classes that is for AS3. Reason? It is best to have a separate Class folder for both AS version to avoid mixup and overwriting.

Step 6 : Now we will go into Flash and add our own Class Folder. Go to Preferences inside Flash (Ctrl + K for PC and CMD+K for Mac).

Step 6.2 : Select Actionscript from the left menu and Actionscript 2.0 Settings on the bottom right.

Step 6.3 : It will now pop a window for you to specify the location of the Class folder. Press on the plus (+) sign to add a new directory for this. And click on the Target button to find/browse the specified folder.

Step 6.4 : Select the correct folder which stores all of the external classes.

Step 7 : We will now proceed with our first experiment on using Tweener. It is really simple, which I will provide the example file on the end of this sharing. Create a new document with a movieclip that is named as “box” as its instance name. On the first frame and layer a/s, we will initilize the Flash file with importing the Tweener class.
By doing : import .caurina.transitions.*;
We will now try to move the box from the left side of the stage to the right end of the stage. Additionally, it will fade out after it reaches the right side. Awesome?

Step 8 : We will start with moving the box from left to right with the syntax as below :

Tweener.addTween(box,{_x:400,time:1,transition:"easeIn"})

Test the movie and it should slide gracefully from the left side of the screen to the right. Okay now, you might think on what about making more crazy stuff? Before going into that detail, the code is compromise of the name of the movieclip you need to control, and inside the {} curly bracket, you will then need to specify what you want the movie clip to do. It’s that easy!

There are a lot of syntax that you can explore and refer from the online documentation at :
http://hosted.zeh.com.br/tweener/docs/en-us/
But the most common used by me are : _x, _y, _xscale, _yscale, _frame, _color, _alpha, _autoAlpha
And you might think what are those? _autoAlpha?! basically it’s some really cool predefined animations that set to tween your movieclip to alpha 0, and make it disappear (_visible = false) automatically!

Step 9 : Now for the magic, we will add another line as :

Tweener.addTween(box,{_alpha:0,delay:0,time:1,transition:"easeIn"})

Notice the delay there? It is the same amount of time (in second) as the first tweening, that means the second code of tweening will wait in line until the first one finishes in 1 second. Experiment around. You will be amazed.

Extra note : For starter or intermediate learner, you might be stunned with all these examples that you can find at http://tweener.googlecode.com/svn/trunk/examples/. Head on to gotoAndLearn() as well for those recent tutorials that made use of a lot Tweener.

[ Download Tutorial File ]

[Toy] YouBrowser - YouTube Visual Finder

2008-04-09T22:11:00.003+08:00

YouBrowser - Look For Video (literally)
I had some chance earlier last year to play around with YouTube’s API and I’m looking forward to improve this toy. Basically when we want to find something, etc “look” we really want to look around. So I hope you will find this useful and have fun “looking” for top videos.

Do keep the comments and suggestions coming in to make this one a better one for all of us. Cheers!
If you like it, digg it or bookmark the url, will be permanent at : http://labs.oneduasan.com/YouTube.html

Update : Tips to share.
In regards if you are looking to do some dynamic user input/search through php-->flash. There’s some trick I found on the internet. I will probably share it in detail next time when I finalize the detail on YouBrowser search engine. But basically if you want it to work, you need to send a string to youtube on the ‘tag’ you want to search and parse it back as a xml document to you through php. And I realized it can’t be done directly through Flash, at least in AS2.0.

$devid = $_GET['func'];

$theURL = "http://www.youtube.com/api2_rest?method=youtube.videos.list_featured&dev_id=".$devid;

$contents =implode ("",file($theURL));

echo($contents);

?>

Note that the function that is helping this to work is the implode() function that feeds the data from the api into xml data and then send it back to Flash. Hope you will find this useful.

[Inspiration] Jonathan Harris

2008-04-09T15:40:00.003+08:00

Telling Stories Using Data : Jonathan Harris
An exclusive interview with data virtualisation pioneer, Jonathan Harris. One of my big source of inspiration from his work is his habit in reusing existing material but to make it more visually appealing and effective in conveying communication. Talk about good design being made better.

[Tools] Tweener

2008-04-08T18:33:00.002+08:00

http://code.google.com/p/tweener/
"...In layman's terms, Tweener helps you move things around on the screen using only code, instead of the timeline..."
"...Tweener is also the spiritual successor to MC Tween..."

Basically if you are familiar with the succesful MC TWEEN for ActionScript 2. You will find yourself blessed with this. Since there are quite a lot of aspect improved in terms of efficiency in implementing tweening. On the other hand, it will help for you to learn faster if you are also regularly learning from gotoAndLearn()

Random Bits of Sharing

2008-04-04T15:21:00.007+08:00

ColorFlip
A rather simple and direct site. But it definitely does a good job in simulating a full page spread paper that you can tear. Much like a layout pad that concept/2D artist draws on. A canvas.

Shuffle
Knock your opponent’s ball, er... away. Pretty addictive if you ask me. But nevertheless it does reminds me of both snooker, billiard and dodgeball.

Real Time Raytracing in AS3.0
While announced a while ago, it seems that the Flash technology has reached another milestone in implementing 3D technology onto the web. Does it mean, in the future, we will see, RTS or FPS games inside your browser using Flash?

World Golf Tour : PGA Charity Challenge
This would definitely be one of the stunning 3D Flash game at the moment that I had seen. I’m still thinking that the gameplay or instruction could be further enhanced. Took me several minutes to figure out how to hit the golf ball.