If you are familiar with the Adobe product line there is inconsistency between Photoshop/Illustrator/Flash/Fireworks/InDesign and support for various subsets of blendmodes which is rather annoying especially for us Flash guys. This project overzealously named the 'Ultimate Blend Mode Collection' is an attempt to standardize this unofficially on Adobes behalf. So marrying up Photoshop designs and Flash layouts with unsupported blendmodes won't be nearly as annoying as has been previously. Further to this, these custom blendmodes allow for control to exaggerate and undo the blendmode effects. What this means is you do not have to double up the blendmode effect by duplicating the DisplayObject instance with the same blendmode you can just multiply the single blendmode effect - simple and quite effecient.

So far I have completed the following custom blend modes :

• Add
• Hard Mix
• Hardlight
• Glow
• Subtract
• Stencil Luma
• Extrapolate
• Difference
• Average
• Lighter Color
• Lighten
• Color Dodge
• Stencil Alpha
• Stamp
• Softlight
• Silhouette Luma
• Silhouette Alpha
• Screen
• PinLight
• Phoenix
• Overlay
• Negation
• Multiply
• Linear Light
• Linear Dodge
• Linear Burn
• Darken
• Desaturate
• Exclusion
• Color Burn
• Alpha
• Darker Color

These are working though have issues of dirty-ness on alpha channels (explained below) for blending layers :

• Reflect
• Freeze
• Heat
• Vivid Light

These custom blend modes are currently in development :

• Color
• Hue
• Luminosity
• Saturation
• Dissolve

How to use custom blend modes

I have only provided a method to use these custom blend modes included with the 'Ultimate Blendmode Collection' for Flex and CS4 users. This is because the PBJ files are compiled into a SWC so you will need to be able to reference SWCs from your FLA or SWF compiler to use the custom blend modes I have mentioned. The syntax to apply a custom blend mode can be achieved via any of the following approaches :

import flash.display.BlendModeShader;
 
myDisplayObject.blendShader = BlendModeShader.SOFTLIGHT;

or

 
import flash.display.BlendModeShader;
import flash.display.shaders.*;
 
myDisplayObject.blendShader = new BlendModeSoftlight();

or you can manipulate the shader

import flash.display.BlendModeShader;
import flash.display.shaders.*;
 
var customBlendMode: BlendModeSoftlight  = new BlendModeSoftlight();
customBlendMode.multiply = 2;
customBlendMode.alpha = 0.5;
myDisplayObject.blendShader = customBlendMode;

Tips for writing your own custom blend modes

Here are some potentially huge gotchas and lovely time savers for those wanna be pixel shader writers (like myself) :

1. Un-multiply alpha before carrying out your shader algorithm. You might already know that Flash pre-multiplies the alpha channel onto the rgb channels this means that if you want to know what the actual rgb components are you will need to do the following :

   void
   evaluatePixel()
   {
          	float2 uv = outCoord();
    
          	float4 src1Rgba = sampleLinear(src1, uv);
           float src1Alpha = src1Rgba.a;
           if(src1Alpha>0.0) src1Rgba.rgb *= 1.0/src1Alpha; //This line un-multiplies the alpha from the rgb channels
   }

2. When your done manipulating your blending layer against the base layer it's more than likely you will need to composite your new blending layer and base layers together while preserving the alpha components. The following should be useful for this :

   void
   evaluatePixel()
   {
          	......
    
           interpolateAlpha = src2Rgba.a;
           inverseAlpha = 1.0-interpolateAlpha;
    
           dst.rgb = src2Rgba.rgb+src1Rgba.rgb*inverseAlpha;
           dst.a = min(1.0, src1Alpha+src2Alpha);
   }

3. Make sure you clamp the components you are altering between 0.0 and 1.0 outside these will give you unusual results between tests made with the Pixel Bender Toolkit and from a published Flash movie. This bit of code ought to fix this :

   void
   evaluatePixel()
   {
          	float3 minRgb = float3(0.0, 0.0, 0.0);
           float3 maxRgb = float3(1.0, 1.0, 1.0);
    
           ......
    
           dst.rgb = clamp(dst.rgb, minRgb, maxRgb);
   }

4. Because Flash premultiplies alpha and I explained earlier about why you may need to un-multiply alpha from the rgb components. It's important to know from this there is a certain degree of losiness and this article by Mario is a great Actionscript explanation (completely unrelated to shaders) of this and is one among many others crying out for help (like me). You may notice in the example below which demonstrates these custom blend modes (or in your own tests) a certain degree of image dirty-ness and this dirty-ness is due to this. I am still working on a way to reduce or get around this - any ideas are certainly welcome - and I've highlighted the shaders above most affected by this.
5. When applying a shader the input sources for the blending and base layer are automatically set. This is great but doesn't allow for setting any further image4 inputs. From my tests if I do try to do this then the Flash Player crashes every time. This is bug and generally bugging me because I can't complete other custom blendmodes based on random math like the Dissolve blendmode

How to get the custom blend modes

I have placed my PBJ, PBK and SWC files on a code.google project. I have also put together a brief getting started page. If you want to get an idea of what's possible using these custom blend modes the simple example below should help to demonstrate this. Also make sure you try out a few of the various base and blending layers I have set up to see what does what.

References

If you are interested in writing your own blend modes I used quite a few sources in order to collect the algorithms used in the examples seen above - here are the main sources :
http://www.pegtop.net/delphi/articles/blendmodes/
http://blog.mouaif.org/?p=94
http://www.nathanm.com/photoshop-blending-math/

Dynamic tweening is really important to a Flash Developer, and when I was programming in AS2 my tweening library of choice was either FuseKit or the Zigo Engine. Since AS3 there have been a few options available:

There have been many posts on how some are better in performance and features than others. Without going into detail, I rate them in the following order, from best to worst:
1) TweenLite/Max
2) Tweener
3) GTween
4) ASAP Tween
5) Adobe Tween

Even though there are 5 options above, the top 2 are the only ones I'd ever consider using. Even with this said, Tween Lite is good, but it's not a code library I'd prefer to use. If anyone cares to take a look through the source code, they’ll notice that it's not particularly clearly (well) written. Because of this, it's not exactly easy for a developer to extend Tween Lite/Max if they need to.

Introducing Tweensy, my new tweening engine, which has been in use for the last 8 months on many of my commercial projects, which I'll supply to the community free of charge (although donations are appreciated). As I mentioned above, Tween Lite/Max and Tweener are really the only libraries I feel I need to compare my performance and feature benchmarking with, to prove that Tweensy will equal, or more usually surpass the performance and features of the existing options. I'll post these performance/feature comparison tests in my next post.

More importantly than this, I think it's crucial that a new tweening engine should have its own unique point of difference. From my review of the above tweening engines, it is clear that they are built for a similar concept (property and motion tweening) and in a simplistic comparison they offer the same features with varying performance.

Tweensy, however, offers these unique features:

1) A Bitmap rendering feature allowing for Bitmap Effects not easily achieved from the Adobe filter set such as Directional Motion Blur, Liquid Theshold, Directional Displacement and Buldge/Skew Displacement.
2) Particle Emitters to generate smoke, fire, abstract, and magical effects from your motion tweens.
3) Vector shape Tweening
4) Gradient Tweening

Well enough of the introduction - I'll show you some examples of what I've been able to achieve by utilising some of the features above. I recommend that you install the Flash Player 10 beta to get the best FPS results.

So Tweensy is intended to provide motion effects, but at its core is an extremely efficient property tweening engine. As the name suggests, Tweensy is also designed to be very easy and flexible to use, so here's the code of how I created the fire effect example above.

 
import com.flashdynamix.effects.layers.DisplacementLayer;
import com.flashdynamix.effects.*;
import com.flashdynamix.effects.extras.Emittor;
 
 
 
import flash.display.*;
import flash.geom.ColorTransform;
import flash.utils.getDefinitionByName;
 
var tween:Tweensy = new Tweensy();
var layer:DisplacementLayer = new DisplacementLayer(tween, 550, 400, 2, 2, BlendMode.NORMAL, 0.95, 1, -6, 1);
 
// This makes the layer offset each of the colour channels on each render so the result is black smoke
layer.ct.redOffset = -20;
layer.ct.blueOffset = -20;
layer.ct.greenOffset = -20;
 
// This is the start colour for the fire
var ct:ColorTransform = new ColorTransform(0, 0, 0, 1, 80, 30, 15);
 
// This is the display asset which will be used to render the flame effect
var Flame: Class = getDefinitionByName("Flame") as Class;
 
var emittor:Emittor = new Emittor(tween, Flame, BlendMode.ADD, 2, 0.73, 0.77, 5, 60, 0.5, -45, 90);
emittor.startColor = ct;
emittor.startScale = 0.2;
emittor.endScale = 2;
 
addChild(layer);
 

Now before someone comments, I do realise that this isn't exactly 1 line of code. This is intentional because Tweensy is designed not only for the examples I demonstrate (examples are just to show what can be done), but provides a library with which you can create your own motion effects. This makes Tweensy a lot of fun to experiment with.

The source code to Tweensy is currently available as a public beta here. I am particularly interested in Flash developers who would like to get involved in creating their own motion effects examples to provide feedback and improve Tweensy. I hope to have a release version of Tweensy publicly available some in late October 2008 with a public beta available before then.

It's been a nice to re-build this project from scratch by taking full advantage of AS3 to simplify the original AS2 universal maps code as it's now 95 classes from over 500 but still offering almost all the inital functionality! As well not to mention the amazing performance differences between AVM1 and 2. I haven't gotten around to full documentation (will soon) but there are samples included on all the maps sources to easily get you started.

Here are some examples...

Google Maps

Windows Virtual Earth Maps

Google Mars Maps

Google Moon Maps

Download the source from the following SVN details
SVN: http://mapsas3.googlecode.com/svn/trunk/

Don't have an SVN client? I recommend you use Tortoise - get it here or if you're an Eclipse user try Subclipse

To compile with Flex I used the command line arguments on the GoogleMapFlex example class :
-default-size 512 512 -default-frame-rate 31 -default-background-color 0x262B2D -library-path {flexSDK}/frameworks/locale/en_US -verbose-stacktraces
To publish a different example using Flex just make sure the class extends UniMapFlex rather than UniMap and that's it.

AS3 example

 
import com.flashdynamix.services.YouTube;
import com.flashdynamix.events.YouTubeEvent;
//
var yt:YouTube = new YouTube();
yt.clientKey = "ytapi-ShaneMcCartney-flashdynamix-vuj2k916-0";
function onLoaded(e:YouTubeEvent) {
switch (e.method) {
case YouTube.SEARCH :
for each (var video:YouTubeVideo in e.data.list) {
trace(video);
}
break;
}
}
//
yt.addEventListener(YouTubeEvent.COMPLETE, onLoaded);
yt.videosForTag("Top Gear");
 

AS2 example

 
import com.FlashDynamix.services.YouTube;
//
var yt:YouTube = new YouTube();
yt.APIKey = "WplekwLy_Nw";
var obj:Object = new Object();
obj.loaded = function(evt:EventArgs) {
switch (evt.type) {
case YouTube.VIDEOSBYTAG :
var videos = evt.value.video;
break;
}
};
//
yt.addListeners(obj);
yt.videosbyTag("Top Gear");
 

The class I created YouTube.as supports both the legacy and current version of the YouTube API legacy documentation and current documentation.

Download the source from the following SVN details
SVN: http://youtubeas3.googlecode.com/svn/trunk/

Don't have an SVN client? I recommend you use Tortoise - get it here or if you're an Eclipse user try Subclipse

Download the source code here

An example SWF (AS2.0) using the ConvexHull.as Class is below (only with the Graham Scan Algorithm are the points draggable). I am surre if this was in AS3 it would run alot faster as most the memory is used in loop sorts

To download the source click here

The speakers for SP07 were as follows

Day 1 Friday

Sophie Howarth
She promoted her Big Day Out Photography with her recent book 'Peace Love and Brown Rice'. I hadn't heard of her before and I was hoping she would deliver more stories on her experiences and punters of the Big Day Out rather than just the photo montage we recieved. She described her self as a people photographer, most the people shots of the BDO were the rock stars. She also revealed during QA her favourite BDO was this years 2007, rationalle being since the release of her book she has since privaledged back stage passes and intends to release a new book of this years BDO.

TOKO
Eva and Michael provided us with an interesting overview mostly of a large selection of various billboard posters mostly for music events. They started there story with a humorous camparison of the differences between the Nederlands and Australia because of there recent relocatation to Australia. Then continued with Michael presenting most the content and Eva controlling the arrow key. There typographic sills were good, often building there own typefaces - which I like doing also. I was particularly interested in the annual report which they took some creative license on the graphs making them 'sexy', but I couldn't clearly see where I was sitting.

Si Scott
Si's ornate typographic skills by using a inked and penned technique was pretty impressive especially seeing he said he did it all by hand, must take forever. I really felt sorry for this guy nerves got the better of him pretty bad in the beginning but luckily found his stride later on. It was also cool Si has managed to coin and develop his graphic look and make alot of money out of it, though he did say - 'lately he's trying to develop something new'.

Tiffany Bozic
Her unique canvas of maple wood combined with a honed realistic painting style of animals in a sureal environment, best summed up her work. You can tell with Tiffany she loves what she does and has travelled to lengths to do so even cmaping in the back of machine shops. She also has a relentless pursuit for working closely with biologists to better understand her subject, the crazy geek she is even married one. She later let us know she is working on her first artistic installation at a museum in San Francisco, again getting the opportunity to work closely with biologists.

James Jean
James illustration work was awesome. He mostly presented work for the comic Fables, which he has done the cover for 50+ titles. The volume of work for these titles was nicely overviewed in a mosiac grid layout. I particularly liked seeing the drawing process that James used rather than just talking about it. He also really loves to use the invert blendmode, I think he must of said 'then i just inverted it' about 20 times. Something else that also interested me was that James said he worked as a Flash designer in NY during the .com boom and I was wondering wether he still tinkers in Flash today?

Motion Theory
This LA based VFX company gave us a process overview of a project they did for a music clip. It was good to focus on a single project like that and try and get across your process in your team, this is so often over looked at these events. The work was good but not the best VFX I have seen I was more inspired by companies like Qube Konstruct and my favourite Pysop when they presented in the last few SP's.

Day 2 Saturday

Jonathan Zawada
Jonathon's graphic design and art direction work was great. I especially appreciated the concise way he presented his work even including his reference examples. The main project presented was a series of the Preset covers he did. He also dabbles in doing online design from which he quickly showed us the Presets site.

Mike O'Meally
Mike's showed us his skate boarding photos and insights into the stories behind them for Slam magazine. He explained his story of following your dream regardless of what people or your lecturers may say.

BLK/MRKT - Dave Kinsey
Dave showed us a collection of his commercial and fine artist work. His commercial work included mostly brand ID and advertising design to target youth culture through a graphic street style look. Dave also runs a small gallery to house about a dozen artists work in San Fransisco and explained a little about the background of this and the artists work involved.

Nash Edgerton
Nash is a movies and music clips stunt man and also directs his own self funded films. Cool eh. His drive to do his own self written films while also working on stunts to pay the bills was inspiring in the strangest way. I had seen his work previously with the film 'Lucky' at Tropfest years ago and was great to meet the guy behind it all.

Marmalade
Marmalade is a magazine for smart good looking people. Marmalade's unqiue approach to design for this magazine was cool, they actually build the magazine raising titles and content with foam core then photographing it. They also don't follow some of the normal traditions of high volume magazines having set sections month on end. Marmalade has a main article with interdispersed related abstract articles which results in exploratory reading. As well alot of the direction they took in the magazine was from self motivated market research tailoring the magazine to there readers rather than double guessing.

Method Studios
Method Studios is a visual effects company with an impressive reel again not quite as good as Pysop or Qube Konstruct my SP faves but good none the less. The work presented on Seers was great as some how they managed to convince a cardigan brand to do the impossible - take a chance and do something unique. They also discussed the artistic/creative process for some of the work they had done on the movie 'the ring', some of the process resulted from a new phrase I have pocketed 'happy accidents'.

The Verdict
I really wished this years Semi-Permanent had at least 1 presenter primarily from the web, interactive or game design industry, pretty disappointing. As well next year only include commercial designers/artists - no fine artists. And a more diverse range of speakers over the first day would of been better. All this said my highlights for the show were TOKO, James Jean and Jonathon Zawanda for me.

Pollock
Flys
Abstract
Beziers