Archive for the 'flash' Category

The Year of the Flash

So much was written of the new flash player (version 10, code named “Astro”) and what it may do to the industry, it is indeed technologically inspiring, but from a freelance point of view (business wise) this even looks better.

Looking back to when I started working with flash (about ten years ago) and now, I can see a huge change in the weight of flash in projects out there.
Today, both the platform and the clients have matured, Flex has made a huge impact on technological companies perception of flash as the focus is shifting towards User Experience (anyone said RIA?) and OS compatibility and consistency, and the role flash plays in those is non comparable.

Up until recently I had to explain what I do, when refusing to take so many projects that were not related to my skills.. I guess because flash animators, designers, and coders were all considered the same in term of wages and availability.
Now, companies are looking for flash experts that can make charts like Google’s financial charts, and this is clearly a specialist job, since most of these companies don’t have the know-how in house, they call guys like me : )

The good news is that each improvement in flash adds to the appeal we have, and the demand for advanced flash programers is absolutely amazing.

I think this will be a great year.

ResizeManager – simple scaling engine for MovieClips

Flash objects (SWF) can fill the entire Html body, and scale along with browser window as you resize it (it’s done by setting width and height attributes to 100% in the embed tags). However unless scaleMode is properly defined as well, the outcome may look surprisingly bad, the flash content may loose proportions and distort, images quality drops and texts loose readability.. oh man.

Only specific contents should be scaled when the stage is resized, the same way apps handles resizing: an app will redistribute its panels without scaling them, will scale panel background but not the buttons and the controls in it. When the entire stage is simply scaled, the interface balance is disturbed.. and we don’t want that.

So I decided to share: ResizeManager (download) is a very simple scaling engine, a single AS2 class that can easily be modified or extended for your needs.
The manger can control scaling and some basic align options of MovieClips you register to it, so you can scale a background MovieClip to cover the entire stage, and keep another MovieClip centered without scaling. It also adds default definitions for the Stage behavior (scaleMode: noScale, stageAlign: TL), though you can change those.
In order to use it, simply import the class and create an instance of the ResizeManager:

import com.adifeiwel.custom_ui.ResizeManager;

var rm = new ResizeManager();

Then, use method registerMC() to register each MovieClip you want to control (including MovieClips nested within MovieClips, make sure parent MC is x:0, y:0), the registerMC method expects the following parameters:
_parentName:MovieClip (the name of the MoviClip)
_widthUpdate:Number (scaling in percentage from Stage.width, 0 for no-scale)
_heightUpdate:Number (scaling in percentage from Stage.height, 0 for no-scale)
_centerUpdate:Boolean (align MovieClip to center of stage)
_middleUpdate:Boolean (vertical-align MovieClip to middle of stage)

for example (see it here):

rm.registerMC(portMC.mainBG, 100, 100, false, false);
// will scale to cover all Stage

rm.registerMC(portMC.middleMC.middleBG, 100, 0, false, false);
// will scale to take 100% of Stage.width

rm.registerMC(portMC.middleMC.middleContentMC, 0, 0, true, false);
// aligned to center

rm.registerMC(portMC.transMC, 0, 0, true, true);
// aligned to center, vertical-align to middle.

rm.registerMC(portMC.vClip, 0, 80, false, false);
// will scale to take 80% of Stage.height

enjoy : )

Update: You can download the example FLA here.

scrollPane background customization – as3

I was trying to customize a scrollPane component (as3) and ran into some difficulties, I wanted to change the background of the panned area. The default background is kinda gray with rounded corners, I wanted it dark and strait corners.

scrollPane default backround

After far too much time searching Adobe’s Livedoc (what a shame, didn’t find the answer there), and reading countless posts, I eventually found the answer via Flash Help Panel.

scrollPane customized backround

Apparently the only way is to change the default skin of the component, to do that you simply prepare a MovieClip to serve as skin and give it linkage name, then set the component instance style to use the skin you prepared, like this:

aSp.setStyle( "upSkin", newSkinClip );

upSkin is the default skin class, and I’m setting it to use the skin I made.

Adobe really should find a way to make those livedoc easier for use and orientation, it takes too long for pages to load, and I keep finding my self clicking in loops..

Wordpress blog in flash – in SWX contest

I was going through the SWX PHP contest entries, and was so happy to find an entry under the API category for the Wordpress platform by Benjamin Wiederkehr, it is something I was considering to do my self ; ), and can be really handy for small personal sites or blogs that prefer a customized experience over the standard Html themes – portfolios, galleries, open for commenting – you see the potential..These APIs are best demonstrating the power of SWX, allowing us – flash programers to expand our possibilities and offering without messing with server-side too much – just what Aral was talking about.cool.

Hunting swf memory issues – take ‘em down!

In one of my current projects I’m experiencing a ‘memory waste’ issue, after a basic efficiency re-writing did not solve the problem, I began reading about how flash handles scope chains and memory, and found this very interesting article ‘Scope Chain and Memory waste in Flash MX‘ by Timothée Groleau.Now I am going to re-attack the issue with better understanding of what to look for. thanks Timothée.Another good resource to refine your coding practice is Adobe’s AS2 best practice article.Be ware, avoid driving after reading these two : )

Flash 10 Sneak Peek looks promising

I just had the time to watch what was presented in the MX Chicago 2007, apparently much.. hmm, Adobe’s 3D api looks attractive, I guess using intrinsic classes is shorter (20 lines?!) and easier to migrate than the current 3rd party packages, and according to this vid, the performance will be great.Next-sneak-peek.jpg
I am also exited about the Advanced Text Layout Support coming in version 10, take a look at this vid, thanks again Aral. After years of neglecting RTL languages (that is Right To Left writing direction – Hebrew and Arabic), and countless crippled hacks that never really worked – finally a solution seems to work good.RTL-flash.jpg
And this makes me very happy.
3D-transform-flash.jpg

Sony Bravia has a great 3D interface in flash

Sony Bravia new site (http://bravia.sony.eu/bravia.html) is a great example of 3D navigation system in flash, bringing a new and fresh feel to site navigation, worth the long loading.
sony_bravia_3D_03.jpgsony_bravia_3D_02.jpg
Using keyboard arrows is so easy and intuitive for controlling the 3D menu, it’s a shame the actual sections content is not arranged for keyboard control and requires “traditional” mouse interaction. But it is very cool eventhough.

SWX PHP – takes only 3 minutes to set up

I am working on a new project that requires serverside development, using Apache, MySQL and PHP. However I didn’t want to change my current personal webserver configuration – the one that comes with OS X, and I remembered my friend Eran’s tip about MAMP – an independent standalone webserver, but never got to download it.Then, few days later, Aral released SWX PHP 1.0 (remember SWX?), and offers a very convenient way to start playing with SWX in minutes, using no other that a MAMP bundle, already configured with a useful Start Page linking to the SWX Service Explorer & Data Analyzer , can’t be simpler than that.. try it out!Great work Aral! I liked the Screencast explaining how to set it up, Aral simply explode you with knowledge : )
swx.jpg
I also find the SWX icon very amusing in my dock..

FIVe3D – a new Flash ActionScript 3D package

five3d.jpg
A new open source vector based 3D animation engine for ActionScript called FIVe3D has recently been shared by Mathieu Badimon. Thanks Mathieu!It is a ActionScript 2 classes package, enabling 3D rotation and position control over objects such as movieclips and text fields.For setting up a simple 3D environment, with simple objects and basic interactivity it is indeed fast and pretty simple, as described by the author. I am sure in few months it will pick up some more advanced functionalities, we should be proud that such exiting initiatives are emerging in the open source sphere.I was impressed by the thorough (and beautiful..) documentation he provides with the source code, neatly packed in a pdf file. that’s the way!

Flash, a dominant video platform

The last Adobe Flash Player update, (Aug 21, codenamed “Moviestar”) integrates H.264 video and High Efficiency AAC audio codecs, as well as multi core support and full screen mode with hardware scaling.So flash will soon deliver HD quality videos, good news : )Flash is probably the best video platform today, as it combines the customizable interactivity of flash scripting and advanced streaming and playing abilities.The recently updated YouTube player is a great example, developing the video playing experience by improving the most difficult part – selecting the video out of the endless inventory without too much effort by the viewer. In the new player when the video you watched is over, relevant videos are offered, very aesthetically and in the same location, without visiting the flickr website or even leaving the page. nice.YouTube new player interface:youtube_interface.jpg