<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Cold Constructs &#187; Flash</title>
	<atom:link href="http://coldconstructs.com/tag/flash/feed/" rel="self" type="application/rss+xml" />
	<link>http://coldconstructs.com</link>
	<description>Just another WordPress weblog</description>
	<lastBuildDate>Mon, 30 Aug 2010 19:28:38 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=1290</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Why SWF protection matters; Review of the current options</title>
		<link>http://coldconstructs.com/2010/07/swf-protection/</link>
		<comments>http://coldconstructs.com/2010/07/swf-protection/#comments</comments>
		<pubDate>Thu, 29 Jul 2010 17:00:38 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Discussions]]></category>
		<category><![CDATA[content protection]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[review]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=468</guid>
		<description><![CDATA[

Why try?
The tools

Protectors
Decompilers


The SWF files
Amayeta SWF Encrypt

Interface
Effectiveness
Overall


DComSoft SWF Protector

Interface
Effectiveness
Overall


Kindisoft secureSWF

Interface
Effectiveness
Overall


Ambiera irrFuscator

Interface
Effectiveness
Overall


Conclusion


The one (and only) counter-argument I&#8217;ve heard against SWF protection goes something like this:
It doesn&#8217;t matter what you do, thieves will always be able to steal your work, so don&#8217;t bother with SWF protection.
This is a textbook example of the &#8220;perfect solution&#8221; fallacy. Thieves will [...]]]></description>
			<content:encoded><![CDATA[<div class="toc">
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-why-try">Why try?</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-the-tools">The tools</a>
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-protectors">Protectors</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-decompilers">Decompilers</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-the-swf-files">The SWF files</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-amayeta-swf-encrypt">Amayeta SWF Encrypt</a>
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-interface">Interface</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-effectiveness">Effectiveness</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-overall">Overall</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-dcomsoft-swf-protector">DComSoft SWF Protector</a>
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-interface1">Interface</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-effectiveness1">Effectiveness</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-overall1">Overall</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-kindisoft-secureswf">Kindisoft secureSWF</a>
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-interface2">Interface</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-effectiveness2">Effectiveness</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-overall2">Overall</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-ambiera-irrfuscator">Ambiera irrFuscator</a>
<ol>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-interface3">Interface</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-effectiveness3">Effectiveness</a></li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-overall3">Overall</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2010/07/swf-protection/#toc-conclusion">Conclusion</a></li>
</ol>
</div>
<p>The one (and only) counter-argument I&#8217;ve heard against SWF protection goes something like this:</p>
<blockquote><p>It doesn&#8217;t matter what you do, thieves will <em>always </em>be able to steal your work, so don&#8217;t bother with SWF protection.</p></blockquote>
<p>This is a textbook example of the <a href="http://en.wikipedia.org/wiki/Perfect_solution_fallacy">&#8220;perfect solution&#8221; fallacy</a>. Thieves will always be able to crack safes, so why bother storing your money and valuables in them? And of course encryption can always be cracked, so why bother using it when transferring valuable information? <em>Why not just release all your work and hard-earned assets out to the wild for anyone to plunder, since apparently it will be plundered regardless of whatever you do to protect it?</em></p>
<h4 id="toc-why-try">Why try?</h4>
<p>Obviously we use safes and encryption <em>&#038;c</em> to minimize the chances of bad things happening to our precious stuff. It&#8217;s just the same for people like me who make money with SWF files&#8211;I don&#8217;t want anyone stealing my Intellectual Property and posting it elsewhere, claiming it as their own, so I do everything I can to make the process of stealing my SWF files as difficult as possible.<strong> The more difficult a thing is to steal, the less chance there is of it being stolen&#8211;and less often.</strong></p>
<p><span id="more-468"></span><br />
<h4 id="toc-the-tools">The tools</h4>
<p>Right now there are several tools, some even free, that allow you to decompile a SWF file to take a look at everything it contains. This is usually pretty easy because the SWF format is an <a href="http://www.adobe.com/devnet/swf/">open specification</a>. This means there&#8217;s no way to fully protect anything contained in the file, such as code, graphics, sounds, or videos. However, there are applications that take precautions against decompiling using a variety of methods. </p>
<h5 id="toc-protectors">Protectors</h5>
<p>I&#8217;ll review the biggest names in that market today:</p>
<ul>
<li>Amayeta <a href="http://www.amayeta.com/software/swfencrypt/">SWF Encrypt</a> 6.0.8</li>
<li>DComSoft <a href="http://www.dcomsoft.com/">SWF Protector</a> 3.0.1 (on <a href="http://twitter.com/SWF_Protector">twitter</a>)</li>
<li>Kindisoft <a href="http://www.kindisoft.com/">secureSWF</a> 3.5 (on <a href="http://twitter.com/secureswf/">twitter</a>)</li>
<li>Ambiera <a href="http://www.ambiera.com/irrfuscator/index.html">irrFuscator</a> 2.1.2 (on <a href="http://twitter.com/ambiera">twitter</a>)</li>
</ul>
<h5 id="toc-decompilers">Decompilers</h5>
<p>I&#8217;ll be using a combination of <a href="http://www.swfdecrypt.com/">SWF Decrypt 1.2</a> and Eltima&#8217;s Decompiler v4.1 to test the effectiveness of these applications. (Side note: Eltima&#8217;s Decompiler and Sothink&#8217;s are <em>freakishly</em> similar.) SWF Decrypt really upset the industry when Magus (the author who wishes to remain anonymous) released it completely for free. It apparently decompiles any SWF file &#8220;protected&#8221; by Amayeta&#8217;s and DComSoft&#8217;s applications. He&#8217;s very loud about it too, calling them out on their &#8220;tricks&#8221;, such as <a href="http://blog.swfdecrypt.com/2010/07/swf-protector-3-0-are-you-kidding-me/">their latest releases</a> (which I&#8217;m reviewing here). You&#8217;ll notice he left Kindisoft and Ambiera alone, and he claims that&#8217;s because they offer real protection schemes, such as renaming functions and variables in the code. But the others claim they also use renaming, so we&#8217;ll see who&#8217;s right.</p>
<h4 id="toc-the-swf-files">The SWF files</h4>
<p>I&#8217;m a Flash game developer so that&#8217;s all I&#8217;m going to focus on here&#8211;single SWF files containing AS3 code compiled to run on Flash Player 9 and 10+. The files contain references to the Stage object, multiple event listeners, very high frame rates (60fps usually), and numerous computationally expensive operations such as pixel-level manipulations and heavy math functions. Here are the files I&#8217;ll be using:</p>
<ul>
<li><a href="http://flixel.org/flxcollisions/">FlxCollisions</a></li>
<li><a href="http://www.adamatomic.com/mode/">Mode</a></li>
<li>My pixel-level collision <a href="http://coldconstructs.com/2009/11/pixel-perfect-collision-detection-with-5000-particles/">demo</a></li>
</ul>
<p>These are free with source code available so that I can alter it if the protector requires it. The first two use <a href="http://flixel.org/">Flixel</a> (an old and new version), but if you have any (or know where to find some) non-Flixel open sourced Flash games then I&#8217;ll try that too. The third is a demo I wrote a while ago that has some heavy computation and sensitive optimizations that could trip up the protectors. Now, let&#8217;s get into the apps and see how they perform.</p>
<h4 id="toc-amayeta-swf-encrypt">Amayeta SWF Encrypt</h4>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/amayeta_logo.jpg" class="alignright" />Amayeta is a subsidiary focused solely on the Flash platform. It used to have a single product, SWF Encrypt, but now also provides a SWF compression utility. Magus, author of SWF Decrypt, provides <a href="http://www.gareth-jones.co.uk/2010/04/28/are-dcomsoft-and-eltima-the-same-company/">a deeper look</a> at their history and he isn&#8217;t kind about it.</p>
<p>The problem I have with Amayeta right off the bat is that its flagship product&#8217;s name is completely misleading since it&#8217;s not possible to <a href="http://en.wikipedia.org/wiki/Encryption">encrypt</a> a SWF. I mean you <em>can</em>, but then the Flash Player <em>wouldn&#8217;t be able to run it</em> because the player doesn&#8217;t have a way to decrypt it at runtime&#8211;that&#8217;s just not how the player was engineered. So they are being deceitful.</p>
<h5 id="toc-interface">Interface</h5>
<p>SWF Encrypt has two main areas in the window: on the left is a file explorer where you pick your SWFs to protect, and on the right is the main area where you check the ones to protect (again) and view their properties.</p>
<div id="postgallery"><a href="http://coldconstructs.com/siteFiles/blogImages/swf-protect_amayeta1.jpg" rel="prettyPhoto[amayeta]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protect_amayeta1.jpg" alt="The only screen" /></a> </div>
<p>It has an &#8220;encryption&#8221; setting with the values of &#8220;high&#8221;, &#8220;recommended&#8221;, &#8220;low&#8221;, and &#8220;custom&#8221;. If custom is selected you only have the option to set the &#8220;minimum data length&#8221;, which apparently just lets you put in a number that represents the level of &#8220;encryption&#8221; to use, with lower values being more protection.</p>
<h5 id="toc-effectiveness">Effectiveness</h5>
<p>First using the recommended settings, the SWFs worked fine, no performance hit that I could tell. When I tried to open them up in Trillix, I could get to all the assets, but when I tried to access the scripts, it gave me an &#8220;out of memory&#8221; error. I tried to put it through SWF Decrypt but then the SWF wouldn&#8217;t play at all. I told Magus about this and he&#8217;s going to release a new version of Decrypt next week that should break Amayeta&#8217;s latest patch. It appears that the junk code Amayeta put into the SWFs actually worked this time.</p>
<p>SWF Encrypt has the options to &#8220;encrypt names&#8221; which I think is their way of saying they rename indentifiers like variables and functions. But because I couldn&#8217;t look into the scripts, post-protection, I could not verify this. I have conflicting reports about whether or not they truly obfuscate code, so I&#8217;m going to wait to see if Magus can break their patch, then revisit them again later.</p>
<h5 id="toc-overall">Overall</h5>
<p>It appears this latest version actually keeps Trillix from being able to look through it. However, I can&#8217;t check to see if there&#8217;s any actual renaming going on. Without true indentifier renaming, your SWFs will never be guaranteed to stay safe since the arms race between decompilers and protectors escalates endlessly. So for now, I can&#8217;t say one way or another if SWF Encrypt is solid. I can say that the level of control provided by the app is extremely limited, so even if they did do renaming, the user can&#8217;t fix a problem if the protection is too aggressive. An option to comb through your SWF and control protection on a per-object basis (ideally, per-variable and -function basis) is needed.</p>
<h4 id="toc-dcomsoft-swf-protector">DComSoft SWF Protector</h4>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/dcomsoft_logo.jpg" class="alignright" />DComSoft has a much bigger catalog than Amayeta, all focused on Flash. Better, but the company history doesn&#8217;t appear very legitimate. According to research done by <a href="http://blog.swfdecrypt.com/2010/04/dcomsoft-and-eltima-are-the-same-company/">this dude</a> and <a href="http://www.gareth-jones.co.uk/2010/04/28/are-dcomsoft-and-eltima-the-same-company/">this dude</a>, DComSoft is the same company as Eltima, a company that creates a SWF decompiler (one that I&#8217;m using for these reviews actually). That, my friends, is called &#8220;bad business practice&#8221;, if true. Besides that though, what the hell is up with the logo? If anyone has any idea what a tire has to do with Flash file protection, please let me know.</p>
<h5 id="toc-interface1">Interface</h5>
<p>Protector has two modes: Simple and Advanced. Switch between modes using the tabs at the top of the application window. In Simple mode you can batch protect files but there are zero options. In Advanced mode though you can only protect one file at a time, but you can comb through each object and variable and check the boxes next to them, which are &#8220;Obfuscate&#8221; and &#8220;Protect&#8221;.</p>
<div id="postgallery"><a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_dcom1.png" rel="prettyPhoto[dcomsoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_dcom1.png" alt="The Simple section" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_dcom2.png" rel="prettyPhoto[dcomsoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_dcom2.png" alt="The Advanced section" /></a></div>
<p>According to the help file:</p>
<blockquote><p>Obfuscate renames variables, features etc. in a definite way. It doesn&#8217;t prevent from decompilation, but makes the subsequent compilation impossible.</p></blockquote>
<p>And &#8220;protect&#8221; means</p>
<blockquote><p>Protect modifies ActionScript in such a way that a SWF file can be played, but it is impossible to decompile it.</p></blockquote>
<p>Right, we&#8217;ll see about that.</p>
<h5 id="toc-effectiveness1">Effectiveness</h5>
<p>The protected SWFs ran normally with no noticeable framerate drop. When I loaded it into Trillix though, everything appeared just fine with ZERO obfuscation&#8211;no renaming except for what Flash does automatically, no junk code/characters that would trip up the decompiler, nothing. All scripts I opened were very readable. I&#8217;d like to note however that I&#8217;m using an old version of Trillix (4.1), because the newest version would just crash if I tried to open the scripts (well, sometimes it&#8217;d work, but most of the time not). Anyway, really nothing else I can say here, just &#8220;epic fail&#8221;.</p>
<h5 id="toc-overall1">Overall</h5>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/bad.png" class="alignleft" alt="WHAT" />The interface is clean but offers very few options. If it actually worked I&#8217;d be ok with that, but maybe they need to add more granular controls so we can pick what we want obfuscated and by how much. It would also help if they added real obfuscation. Regardless, SWF Protector has a few licensing options. The Personal license ($40) doesn&#8217;t allow any of the SWFs protected by it to make money, while the Business license ($60) does. There&#8217;s other types for companies and OEMs too, but who cares&#8211;the software doesn&#8217;t work, end of story.</p>
<h4 id="toc-kindisoft-secureswf">Kindisoft secureSWF</h4>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/kindisoft_logo.jpg" class="alignright" />Kindisoft doesn&#8217;t mess around. When I emailed them about reviewing their app, they sent back this:</p>
<blockquote><p>While I definitely love to hear your opinion of secureSWF, we&#8217;re not interested to see a comparison with SWF Encrypt and SWF Protector. We think of secureSWF as a professional level ActionScript obfuscator while SWF Encrypt and SWF Protector as single purpose tools that might prevent some decompilers from working for a while.</p></blockquote>
<p>Ok then. So we start out on a completely different footing with Kindisoft than the others already. But while Kindisoft doesn&#8217;t have dirt on it like Amayeta and DComSoft do, it&#8217;s still a niche-based company providing only one product. Although that should mean they make a really great product, right?</p>
<p>I&#8217;d like to note that the free web-based version of secureSWF that is available to developers who put their games up at FlashGameLicense.com is apparently a different product. When I tried to add its protection to my first game, it broke it. When I brought this up with Kindisoft, they replied saying:</p>
<blockquote><p>secureSWF is a completely different solution than FGL encryption feature. We built this complementary encryption feature for FGL community to help avoid more thief incidents. It does not use the same technology or techniques as secureSWF.</p></blockquote>
<p>I just hope their software is better than their grammar.</p>
<h5 id="toc-interface2">Interface</h5>
<p>SecureSWF is a bit more complicated but makes up for it in options. There are 5 tabs:</p>
<div id="postgallery"><a href="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft1.png" rel="prettyPhoto[kindisoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft1.png" alt="File browser" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft2.png" rel="prettyPhoto[kindisoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft2.png" alt="Indentifiers renaming" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft3.png" rel="prettyPhoto[kindisoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft3.png" alt="Protection options" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft4.png" rel="prettyPhoto[kindisoft]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protector_kindisoft4.png" alt="Configuration rules" /></a></div>
<p>The fifth one is just a summary of what it did after you hit the big &#8220;Protect SWF Files&#8221; button. The GUI is pretty much self-explanatory and gives you a fine level of control. Hovering your mouse over any option will bring up a tooltip that further explains what the option does. So far, looks great.</p>
<h5 id="toc-effectiveness2">Effectiveness</h5>
<p>The real meat of the app is in the renaming, since eventually all SWF files can be cracked open to reveal their code. SecureSWF does a great job in this area. By default it will leave alone most public functions, probably because they&#8217;re usually used by other classes, so renaming them inconsistently would break the SWF.</p>
<p>When I protected the SWF files with the default settings, I was able to play my collision demo and Mode (which uses the old version of Flixel). I could not run FlxCollisions though, instead I got back this error: <code>ReferenceError: Error #1056: Cannot create property D on _-9l._-68</code>. Obviously the renaming was set a little too aggressively for it to work (and the &#8220;strength&#8221; was only at 20% with most advanced options turned off). When I tried to open the working SWFs with the decompiler, I got an access violation and the program crashed.</p>
<h5 id="toc-overall2">Overall</h5>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/good.png" class="alignleft" alt="Good" />secureSWF only offers variable renaming in their Standard and Professional editions ($200 and $400 respectively), leaving it out in the Personal edition ($100). Considering the functionality SWF protectors provide (and how difficult they are to produce) these prices seem too high to me. The Pro edition (the version I&#8217;m using) does provide some nice additional features though, such as removing unused code (it happens), literal string encryption, and solid domain locking controls). </p>
<p>SecureSWF provides users with a lot of options and it would take me all day to go through them all. But the point is that secureSWF utilizes true obfuscation by renaming variables, encrypting literal strings (which Flash Player <em>can</em> deal with), and inserting illegal characters that will trip up decompilers&#8230; and sometimes the Flash Player too. So it takes some effort to get working, but the point is that <strong>it works</strong>. But is it good enough to justify the price? Let&#8217;s see what irrFuscator provides for its price to compare.</p>
<h4 id="toc-ambiera-irrfuscator">Ambiera irrFuscator</h4>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/ambiera_logo.jpg" class="alignright" />Ambiera comes out of the gate with significant reputation points for having developed irrLicht and related creation tools&#8211;quality open source tools for the indie game developer. Ambiera got into the Flash scene when they decided to extend their game tools to the web via the Flash platform with their own 3D engine and creation apps. They figured developers will want to protect their games and, as the irrFuscator author told me via email, the current offerings in that market &#8220;sucked&#8221;, so he built his own. With this excellent history of software already under their collective belt, I had high hopes for irrFuscator.</p>
<h5 id="toc-interface3">Interface</h5>
<p>A quick glance at irrFuscator&#8217;s interface will bring a sigh a relief, since the layout is dead simple but all the options are there and well-explained.</p>
<div id="postgallery"><a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irr1.png" rel="prettyPhoto[ambiera]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irr1.png" alt="SWF File mode" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irr2.png" rel="prettyPhoto[ambiera]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irr2.png" alt="Flex Project mode" /></a></div>
<p>If you still have trouble figuring out what&#8217;s what, the online docs are helpful and there&#8217;s even an active forum for it at Ambiera if you&#8217;re still having trouble. Very nice.</p>
<h5 id="toc-effectiveness3">Effectiveness</h5>
<p>irrFuscator sets itself apart by allowing you to rename all variables BEFORE you compile your project, so you can see exactly what it did and, if it messed up somewhere, you can go in and manually fix it before compiling again. This is the best method of obfuscation since you know it works, you know what it does, and you know you can fix it easily with your debugger. ALL classes and variables can be renamed, plus it removes whitespaces&#8211;even Vectors were retyped to the renamed classes, and all packages were also renamed (Flash built-ins as well). The resulting code was impossible to read.</p>
<div id="postgallery"><a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irrs2.png" rel="prettyPhoto[ambierasrc]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irrs2.png" alt="Unprotected code" /></a> <a href="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irrs1.png" rel="prettyPhoto[ambierasrc]" title=""><img src="http://coldconstructs.com/siteFiles/blogImages/swf-protection_irrs1.png" alt="After irrFuscator, preserving whitespaces" /></a></div>
<p>I did run into a few problems though. I tried obfuscating my game, which references an SWC, but when I added it to the list, I got an error saying it couldn&#8217;t open it. I just removed it and it continued fine. Also, while it does encrypt literal strings (it replaces them with a function call to irrcrpt() to decrypt at runtime, which will impact performance a bit) it can&#8217;t encrypt them when they&#8217;re inside an Array or similar data structure. Not a big deal, but I was thrown off by that. The other thing is just a small UI annoyance, which is that it uses Windows&#8217; &#8220;browse folders&#8221; dialog to pick out your SWF (in &#8220;SWF File&#8221; mode). This dialog doesn&#8217;t remember where you last looked and it always starts you back at your computers root, so it takes me a while to drill down to the proper folder, which wastes a lot of time. Those are the only issues I found though, which is saying a lot.</p>
<p>Using the SWF File mode is nice, but it didn&#8217;t work for me; I got back this error when trying to run the protected version of FlxCollisions (again): <code>VerifyError: Error #1053: Illegal override of _iq39 in org.flixel.FlxEmitter</code>. Since this also happened with Kindisoft&#8217;s secureSWF, there&#8217;s something going on in the latest version of Flixel (v2.35) that gives them grief. Both packages give you ways to work around them though with their fine-grained controls. For irrFuscator, you just have to use the Flex Project option. In secureSWF you can just uncheck that file&#8230; if you knew which file that was, but there&#8217;s no way to find that out. irrFuscator wins that one.</p>
<h5 id="toc-overall3">Overall</h5>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/good.png" class="alignleft" alt="IT'S GOOD" />irrFuscator has Standard and Professional editions (~$100 and ~$200 respectively&#8211;original prices are in Euros). The difference is that the Pro edition has <em>comment directives</em>, which means you can be extremely precise in telling the app which portions of your code NOT to obfuscate using specially formated comments. This is because code obfuscation sometimes results in worse performance or breaks it completely, depending on the code, so this is a great feature. You decide whether or not the comment directives are worth $100 for your projects. Still, these prices are far more reasonable than Kindisoft&#8217;s&#8211;you get everything secureSWF does at a quarter of the price. Not bad.</p>
<h4 id="toc-conclusion">Conclusion</h4>
<p>I&#8217;m bummed that I couldn&#8217;t determine how effective Amayeta was, but maybe some of you will think the fact that it can&#8217;t be decompiled yet is good enough. Not for me though, because SWFs will eventually be cracked&#8211;we need better protection than that. What I did determine though is that Kindisoft&#8217;s secureSWF and Ambiera&#8217;s irrFuscator offer true obfuscation for sure and therefore true protection of your code. Assets cannot be encrypted and can always be wrestled out of a SWF, unfortunately, so obfuscation is really a Flash developer&#8217;s best weapon.</p>
<p>Overall I&#8217;d say irrFuscator takes the cake for being reasonably-priced and offering that Flex Project option which makes it very powerful, yet it still retains simplicity of use through an easy user experience, plus the program itself was fast to load and responsive. The others were written in Java or were otherwise slow to start, so they were a bit sluggish.</p>
<p>That&#8217;s it for now, but I will be updating this article later if/when we can determine if Amayeta&#8217;s obfuscation methods are valid. Thanks for reading <img src="http://coldconstructs.com/random/pint.gif" /></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2010/07/swf-protection/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>The Last Evasion</title>
		<link>http://coldconstructs.com/2010/05/the-last-evasion/</link>
		<comments>http://coldconstructs.com/2010/05/the-last-evasion/#comments</comments>
		<pubDate>Thu, 27 May 2010 21:10:48 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Games]]></category>
		<category><![CDATA[action game]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=369</guid>
		<description><![CDATA[

Aesthetics
Gameplay mechanics
Technology
Deployment and Marketing


I first released this game through Newgrounds, those poor souls, but for some strange reason it got a much more positive reception than I anticipated. They also made a lot of great suggestions that I have since incorporated into the game.
In this final update I added a storyline intro of sorts. Also [...]]]></description>
			<content:encoded><![CDATA[<div class="toc">
<ol>
<li><a href="http://coldconstructs.com/2010/05/the-last-evasion/#toc-aesthetics">Aesthetics</a></li>
<li><a href="http://coldconstructs.com/2010/05/the-last-evasion/#toc-gameplay-mechanics">Gameplay mechanics</a></li>
<li><a href="http://coldconstructs.com/2010/05/the-last-evasion/#toc-technology">Technology</a></li>
<li><a href="http://coldconstructs.com/2010/05/the-last-evasion/#toc-deployment-and-marketing">Deployment and Marketing</a></li>
</ol>
</div>
<p>I first released this game through Newgrounds, those poor souls, but for some strange reason it got a much more positive reception than I anticipated. They also made a lot of great suggestions that I have since incorporated into the game.</p>
<p>In this final update I added a storyline intro of sorts. Also added were satallites that can easily cause a ruckus by bouncing off the asteroids, making the field more dynamic (and shows off the billiard-ball-style physics I put into Flixel). I also added space storms that will cause a static overlay to appear, making things more difficult to see (if you run through them). So be sure to avoid those, even though they don&#8217;t damage your ship. So click the damn image below to play it already <img src='http://coldconstructs.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p><a href="http://coldconstructs.com/the-last-evasion/"><img src="http://coldconstructs.com/siteFiles/blogImages/play_tle.jpg" class="noborder centered" /></a></p>
<p>Or read on if you already have and wish to know how I made TLE and why I decided on certain mechanics and concepts. I&#8217;ll start with the obvious&#8211;art direction.</p>
<h4 id="toc-aesthetics">Aesthetics</h4>
<p>No one&#8211;and I mean NO ONE&#8211;knew about or even noticed the unique style I used. They thought it was nice-looking, sure, but they did not notice that, unlike other Flixel games, I did NOT scale up the graphics for that pixelated look. I got the pixelation by putting them through a filter in Photoshop. I then manually drew a heavy pixel border around every solid asset (backgrounds/effects/etc do not have any). Lastly I added a heavy drop shadow for everything, giving it all a flat &#8220;fake depth&#8221;, as if everything was made out of cardboard and kind of laying on top of everything else. I didn&#8217;t achieve this effect as well as I wanted&#8211;too subtle.<br />
<span id="more-369"></span><br />
<span style="margin-left:50px;"><img src="http://coldconstructs.com/siteFiles/blogImages/tle_ss1.jpg" /> <img src="http://coldconstructs.com/siteFiles/blogImages/tle_ss2.jpg" /> <img src="http://coldconstructs.com/siteFiles/blogImages/tle_ss3.jpg" /></span></p>
<p>No one else guessed that I actually modeled each asset (again, except for the backgrounds and effects which I painted in Photoshop) in 3d using Luxology&#8217;s modo 401. I didn&#8217;t use any lighting, just global illumination with a white background and rendered those out to be abused in Photoshop for the process I outlined above. To prove it, here are some &#8220;HD&#8221; renders of the assets before any alterations:</p>
<p><span style="margin-left:50px;"><img src="http://coldconstructs.com/siteFiles/blogImages/tle_ren2.jpg" /> <img src="http://coldconstructs.com/siteFiles/blogImages/tle_ren4.jpg" /> <img src="http://coldconstructs.com/siteFiles/blogImages/tle_ren3.jpg" /></span><br />
<span class="desc">Notice the little &#8220;arms&#8221; on the &#8220;chest&#8221; of the alien&#8211;that&#8217;s how they pilot their ships and got high technology in the first place <img src='http://coldconstructs.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </span></p>
<p>I modeled the aliens but not the dudes you see in the intro though. I modeled these things because I&#8217;m better and faster with 3D than 2D, by far. You&#8217;ll see some of my real 3D work around here in the future (that MP5 model is over 2 years old, I just wanted to see if I could make money off it). The stuff I modeled for TLE is actually semi-low-poly and extremely coarse. This is because I knew it was going to be heavily pixelated and therefore a lot of the forms I created will be destroyed. No point in modeling more than basic geometry if that&#8217;s all the player would see anyway. (It actually took me a lot of self-control to keep from adding too much detail and, in some cases&#8211;like the alien ship there&#8211;I failed.)</p>
<h4 id="toc-gameplay-mechanics">Gameplay mechanics</h4>
<p>What I wanted was a fast game with very tight controls and high torque so you feel empowered by simply driving the ship around&#8211;you&#8217;ll notice it can turn really fast and accelerate to max speed in a split second. Controls are everything in a game, so I made them as solid as possible. Naturally a lot of people bitched about it being too difficult to control, but most people still enjoyed this decision. Although I did end up adding the ability to go backwards (which I never found useful but whatever, they liked it).</p>
<p>Secondly, I needed true interaction with other game objects. I had huge plans for the asteroids, including &#8220;composite&#8221; asteroids that would take up half the screen but be hollow in places so that you could navigate through them. I didn&#8217;t have time to build the system for this, unfortunately.</p>
<p>While playing with the prototype, I found just bouncing around the asteroids to be tremendous fun, but ultimately it would have introduced too many technical issues to be worth it, especially considering how much time I had to complete the game (at that point I had about 2 days left). A couple of the problems were that the physics would get wonky with too many collisions; it would also be harder to kill the player since all I could use were the aliens, and I didn&#8217;t have time to make more types of aliens.</p>
<p>I wanted a huge variety of objects but did not have the time. Another object that never made it into the game were black holes. Basically they were gravity wells that destroyed your ship and passing asteroids if they got too close.</p>
<h4 id="toc-technology">Technology</h4>
<p>I initially wanted pixel-perfect collision detection, but I could not get the billiard-ball physics to play nicely with it. So I settled with radius-based detection, and it ended up being fun nonetheless. I now know of a better, simpler reaction technique that will allow for a similar feel that ball physics provide but still work with my collision detection method. I hope to use it in future projects.</p>
<p>The ship travels in &#8220;real&#8221; space, while the backgrounds are adjusted in realtime after they fall off the screen. All objects are recycled, so that&#8217;s why there&#8217;s a huge pause when you hit &#8220;start&#8221;&#8211;it&#8217;s building all the object pools, and there are a LOT of object pools.</p>
<p>Really, that&#8217;s about it for tech&#8211;this game had nothing new or interesting since it was my first public game. I focused on polish instead. In the future I hope to apply a similar level of finish to all my games.</p>
<h4 id="toc-deployment-and-marketing">Deployment and Marketing</h4>
<p>I made the game for a Newgrounds contest, so I quickly &#8220;finished&#8221; a working version of the game and posted it up just in time for the original deadline. This was accidental but ended up being a really good way to get a lot of quick feedback to bring back into the game.</p>
<p>Looking at my revenue using the NG ads, it is fairly obvious that ads are not the way to go. Ever. My future games will be &#8220;<a href="http://en.wikipedia.org/wiki/Freemium">freemium</a>&#8221; (microtransactions) and I&#8217;ll be shopping for sponsorships at Flash Game License. Which API to use though&#8230; that will be difficult to determine, or even if I should just use one. <a href="http://lostgarden.com/2009/07/flash-love-letter-2009-part-1.html">Here&#8217;s a classic post</a> of the financial aspect of Flash games, so read that if you&#8217;re a dev.</p>
<p>For future games I&#8217;m going to follow a structured flow for deployment (trailers, sneak-peeks of unfinished assets, etc.) to build up recognition, then deploy to a lot of different portals at once (unless I get a licensing agreement that dictates otherwise). I&#8217;ll also submit my future games for review on various editorial sites. I really dodn&#8217;t think TLE was even worth the effort&#8211;it was just practice. Next time though!</p>
<p>Thanks for reading (and playing).</p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2010/05/the-last-evasion/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The Last Evasion &#8212; released!</title>
		<link>http://coldconstructs.com/2010/02/last-evasion-released/</link>
		<comments>http://coldconstructs.com/2010/02/last-evasion-released/#comments</comments>
		<pubDate>Sun, 28 Feb 2010 11:25:26 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Introductions]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=258</guid>
		<description><![CDATA[Here&#8217;s a game I made for this Newgrounds contest. It&#8217;s an endurance game where you&#8217;re trying to escape some mean aliens in a rocket ship, but you will fail. Please give it a shot though and let me know what you think in the comments (or if you&#8217;re a Newgrounds member, please rate/review it here). [...]]]></description>
			<content:encoded><![CDATA[<p>Here&#8217;s a game I made for <a href="http://www.newgrounds.com/bbs/topic/1126830">this Newgrounds contest</a>. It&#8217;s an endurance game where you&#8217;re trying to escape some mean aliens in a rocket ship, but you will fail. Please give it a shot though and let me know what you think in the comments (or if you&#8217;re a Newgrounds member, please rate/review it here). Click the image below to open the game in a lightbox.</p>
<p><a href="http://www.newgrounds.com/portal/view/529037" />Play it at Newgrounds.</a></p>
<p>I had been prototyping 4 or 5 game designs over the past several months and during that time I hacked out the core code blocks that eventually made it into TLE. The game itself took me about two weeks of off-on work, with the last few days being pretty intense to meet the deadline. I built it using the Flixel framework.</p>
<p>There is absolutely nothing original about this game. It is not going to win awards, though if I won that contest I would be super-stoked. I mean, you fly a rocket ship and dodge asteroids and alien gunfire. That&#8217;s it. Remember SkiFree for Windows 3.1? It&#8217;s like that, but in space. I didn&#8217;t mean for that to happen, it just did. Coincidently, I hated SkiFree as much as I hate TLE.</p>
<p>NOTE: I am aware of the slowdowns. I upgraded Flixel to the latest version at the last minute due to some unforeseen requirements and it&#8217;s been bad since then. I&#8217;ll look into it when I&#8217;ve had more sleep.</p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2010/02/last-evasion-released/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Pixel-perfect collision detection with 5000+ particles</title>
		<link>http://coldconstructs.com/2009/11/pixel-perfect-collision-detection-with-5000-particles/</link>
		<comments>http://coldconstructs.com/2009/11/pixel-perfect-collision-detection-with-5000-particles/#comments</comments>
		<pubDate>Tue, 24 Nov 2009 19:39:49 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Experiments]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[collision detection]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[particles]]></category>
		<category><![CDATA[source]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=172</guid>
		<description><![CDATA[And yes, it runs perfectly fine. I&#8217;ve run it at 60+ FPS with 7,000 particles, but that actually isn&#8217;t the limitation (unless your particles are crunching heavy math for eg movement). Rather it&#8217;s the size and number of sprites that we&#8217;re colliding with the particles. Click the image below to pop a lightbox with the [...]]]></description>
			<content:encoded><![CDATA[<p>And yes, it runs perfectly fine. I&#8217;ve run it at 60+ FPS with 7,000 particles, but that actually isn&#8217;t the limitation (unless your particles are crunching heavy math for eg movement). Rather it&#8217;s the size and number of sprites that we&#8217;re colliding with the particles. Click the image below to pop a lightbox with the demo:</p>
<p><a href="http://labs.coldconstructs.com/e/vonLocalCD/bin/vonLocalCD.swf?width=600&amp;height=600" rel="prettyPhoto" title="Adjust the scroll bars at the top to change the parameters."><img src="http://labs.coldconstructs.com/i/vonlocalcd.jpg" alt="vonLocal Collision Detection" class="centered" /></a></p>
<p>To squeeze all the juice out of Flash I employed a couple tricks. <strong>The first</strong> was the particles themselves&#8211;they&#8217;re blitted to a single bitmap which is used as the source image for grabbing collision data from. The particles are also drawn with the raster engine in Flash (multiple <code>setPixel32()</code> ops to give the illusion of a line&#8230; a choppy one anyway) instead of the vector renderer (<code>lineTo()</code>). <strong>The second trick</strong> was to only grab a Vector of pixels from the regions we cared about (within sprite boundaries) every so often, then to loop through the Vector and test it against our desired conditions. Also, since the particle bitmap is more sparse than our sprites as far as opaque pixels go, we test the particle bitmap first, resulting in a lot fewer passes on the first round of conditional statements.</p>
<p><span id="more-172"></span></p>
<p>So my poor man&#8217;s method of making lines is done by interpolating the position of a particle from the previous to the current frame, for a total of 3 <code>setPixel32()</code> operations per iteration. (We can use <code>setPixel()</code> for a solid performance gain, but at a different kind of cost that I&#8217;ll explain later.) To give the particles a long tail we simply decrease the alpha of the particle bitmap a little bit every frame, making older particles fade more as time goes by. This means we can skip <code>fillRect()</code> to clear the bitmap every frame, but I&#8217;m wondering if that&#8217;s faster or slower than <code>ColorTransform</code>. Haven&#8217;t tested, for shame.</p>
<p>I&#8217;ll admit that I haven&#8217;t tried this method with bitmap-based particles but those would work just as well, in theory (using blitted rendering). One of my current projects demands those trailing things so I didn&#8217;t look into it. If you try it, please comment on this post below with your findings <img src="http://coldconstructs.com/random/pint.gif"></img><br />
<em>Click on the right-side arrow to unroll this block of code.</em></p>

<div class="wp_codebox_msgheader wp_codebox_hide"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p172code3'); return false;">View Code</a> ACTIONSCRIPT3</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table width="100%" ><tr id="p1723"><td class="code" id="p172code3"><pre class="actionscript3" style="font-family:monospace;">particleMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">lock</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">for</span> <span style="color: #000000;">&#40;</span>i = <span style="color: #000000; font-weight:bold;">0</span><span style="color: #000066; font-weight: bold;">;</span> i <span style="color: #000066; font-weight: bold;">&lt;</span> _numParticles<span style="color: #000066; font-weight: bold;">;</span> <span style="color: #000066; font-weight: bold;">++</span>i<span style="color: #000000;">&#41;</span> <span style="color: #000000;">&#123;</span>
	p = particles<span style="color: #000000;">&#91;</span>i<span style="color: #000000;">&#93;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// get our velocity from the perlin noise map</span>
	vel = noiseMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">getPixel</span><span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span>x<span style="color: #000066; font-weight: bold;">&gt;&gt;</span>3<span style="color: #000066; font-weight: bold;">,</span> p<span style="color: #000066; font-weight: bold;">.</span>y<span style="color: #000066; font-weight: bold;">&gt;&gt;</span>3<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// because noiseMap is 1/9 the size of particleMap</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> brightness<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = vel <span style="color: #000066; font-weight: bold;">/</span> 0xFFFFFF<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> speed<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = 0<span style="color: #000066; font-weight: bold;">.</span>1 <span style="color: #000066; font-weight: bold;">+</span> brightness <span style="color: #000066; font-weight: bold;">*</span> p<span style="color: #000066; font-weight: bold;">.</span>speed<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> <span style="color: #004993;">angle</span><span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = 360 <span style="color: #000066; font-weight: bold;">*</span> <span style="color: #000000;">&#40;</span>brightness <span style="color: #000066; font-weight: bold;">*</span> p<span style="color: #000066; font-weight: bold;">.</span>wander<span style="color: #000000;">&#41;</span> <span style="color: #000066; font-weight: bold;">*</span> <span style="color: #000000; font-weight:bold;">0.0175</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// roughly PI / 180 to convert to radians</span>
	p<span style="color: #000066; font-weight: bold;">.</span>vx = <a href="http://www.google.com/search?q=math%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:math.html"><span style="color: #004993;">Math</span></a><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">cos</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">angle</span><span style="color: #000000;">&#41;</span> <span style="color: #000066; font-weight: bold;">*</span> speed<span style="color: #000066; font-weight: bold;">;</span>
	p<span style="color: #000066; font-weight: bold;">.</span>vy = <a href="http://www.google.com/search?q=math%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:math.html"><span style="color: #004993;">Math</span></a><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">sin</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">angle</span><span style="color: #000000;">&#41;</span> <span style="color: #000066; font-weight: bold;">*</span> speed<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// absolute value for velocity calculations</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> pvx<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = p<span style="color: #000066; font-weight: bold;">.</span>vx <span style="color: #000066; font-weight: bold;">&lt;</span> 0 <span style="color: #000066; font-weight: bold;">?</span> <span style="color: #000066; font-weight: bold;">-</span>p<span style="color: #000066; font-weight: bold;">.</span>vx <span style="color: #000066; font-weight: bold;">:</span> p<span style="color: #000066; font-weight: bold;">.</span>vx<span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// use bitwise sign flippage</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> pvy<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = p<span style="color: #000066; font-weight: bold;">.</span>vy <span style="color: #000066; font-weight: bold;">&lt;</span> 0 <span style="color: #000066; font-weight: bold;">?</span> <span style="color: #000066; font-weight: bold;">-</span>p<span style="color: #000066; font-weight: bold;">.</span>vy <span style="color: #000066; font-weight: bold;">:</span> p<span style="color: #000066; font-weight: bold;">.</span>vy<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// poor man's lineTo ENGAGED</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> nx<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> <span style="color: #000066; font-weight: bold;">+</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span>vx <span style="color: #000066; font-weight: bold;">&gt;&gt;</span> 1<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// where we are now + half the distance to where we will be</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> ny<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> <span style="color: #000066; font-weight: bold;">+</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span>vy <span style="color: #000066; font-weight: bold;">&gt;&gt;</span> 1<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> mx<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = nx <span style="color: #000066; font-weight: bold;">-</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// then half THAT distance for a third position...</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> my<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=number%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:number.html"><span style="color: #004993;">Number</span></a> = ny <span style="color: #000066; font-weight: bold;">-</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// actually apply velocity to pixel</span>
	p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> <span style="color: #000066; font-weight: bold;">+</span>= p<span style="color: #000066; font-weight: bold;">.</span>vx<span style="color: #000066; font-weight: bold;">;</span>
	p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> <span style="color: #000066; font-weight: bold;">+</span>= p<span style="color: #000066; font-weight: bold;">.</span>vy<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// bounds-check</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> <span style="color: #000066; font-weight: bold;">&lt;</span> 0<span style="color: #000000;">&#41;</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> = h <span style="color: #000066; font-weight: bold;">-</span> <span style="color: #000000; font-weight:bold;">1</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">else</span> <span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> <span style="color: #000066; font-weight: bold;">&gt;</span> h<span style="color: #000000;">&#41;</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> = <span style="color: #000000; font-weight:bold;">1</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> <span style="color: #000066; font-weight: bold;">&lt;</span> 0<span style="color: #000000;">&#41;</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> = w <span style="color: #000066; font-weight: bold;">-</span> <span style="color: #000000; font-weight:bold;">1</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">else</span> <span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> <span style="color: #000066; font-weight: bold;">&gt;</span> w<span style="color: #000000;">&#41;</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> = <span style="color: #000000; font-weight:bold;">1</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// pick our color based on speed</span>
	speed <span style="color: #000066; font-weight: bold;">*</span>= <span style="color: #000000; font-weight:bold;">60</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>speed <span style="color: #000066; font-weight: bold;">&gt;</span> 255<span style="color: #000000;">&#41;</span> speed = <span style="color: #000000; font-weight:bold;">255</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #004993;">color</span> = 255 <span style="color: #000066; font-weight: bold;">&lt;&lt;</span> 24 <span style="color: #000066; font-weight: bold;">|</span> speed <span style="color: #000066; font-weight: bold;">&lt;&lt;</span> 16 <span style="color: #000066; font-weight: bold;">|</span> speed <span style="color: #000066; font-weight: bold;">&lt;&lt;</span> 8 <span style="color: #000066; font-weight: bold;">|</span> speed<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// render the particle three times, each in different places to get a line-ish thing going</span>
	particleMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">setPixel32</span><span style="color: #000000;">&#40;</span>p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span><span style="color: #000066; font-weight: bold;">,</span> p<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span><span style="color: #000066; font-weight: bold;">,</span> <span style="color: #004993;">color</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	particleMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">setPixel32</span><span style="color: #000000;">&#40;</span>mx<span style="color: #000066; font-weight: bold;">,</span> my<span style="color: #000066; font-weight: bold;">,</span> <span style="color: #004993;">color</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	particleMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">setPixel32</span><span style="color: #000000;">&#40;</span>nx<span style="color: #000066; font-weight: bold;">,</span> ny<span style="color: #000066; font-weight: bold;">,</span> <span style="color: #004993;">color</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #000000;">&#125;</span>
<span style="color: #009900; font-style: italic;">// and we're done. release the pixels!</span>
particleMap<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">unlock</span><span style="color: #000000;">&#40;</span>_r<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></td></tr></table></div>

<p>So that gives us some spotty-but-close-enough trails to help with our collision detection. It works like this: We create a single bitmap to use as a canvas for our particles. We render those particles using <code>setPixel32()</code> as mentioned above. <strong>Sprites will use this bitmap as a source for collision data.</strong> Every other frame or so (more on this later) the sprites will grab a section of pixels from the particle bitmap using something like <code>getVector()</code> (>= Flash 10) or <code>getPixels()</code> (< Flash 10), using their own position and dimensions for the <code>sourceRect</code> parameter.</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p172code4'); return false;">View Code</a> ACTIONSCRIPT3</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table width="100%" ><tr id="p1724"><td class="line_numbers"><pre>133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
</pre></td><td class="code" id="p172code4"><pre class="actionscript3" style="font-family:monospace;">shipVec = buffer<span style="color: #000066; font-weight: bold;">.</span>getVector<span style="color: #000000;">&#40;</span>_rc<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// get an array of pixels from the whole sprite</span>
_rc<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> = <a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">this</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// change rect to particleBMD's coordinate space</span>
_rc<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> = <a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">this</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
pixVec = _particlebmd<span style="color: #000066; font-weight: bold;">.</span>getVector<span style="color: #000000;">&#40;</span>_rc<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// grab an array of the same area of pixels that our sprite is occupying</span>
<span style="color: #6699cc; font-weight: bold;">var</span> a<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=uint%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:uint.html"><span style="color: #004993;">uint</span></a><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #6699cc; font-weight: bold;">var</span> i<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a> = <span style="color: #000000; font-weight:bold;">0</span><span style="color: #000066; font-weight: bold;">;</span>
buffer<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">lock</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">for</span> <span style="color: #000000;">&#40;</span>i<span style="color: #000066; font-weight: bold;">;</span> i <span style="color: #000066; font-weight: bold;">&lt;</span> _l<span style="color: #000066; font-weight: bold;">;</span> <span style="color: #000066; font-weight: bold;">++</span>i<span style="color: #000000;">&#41;</span> <span style="color: #000000;">&#123;</span>
	_pval = pixVec<span style="color: #000000;">&#91;</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span>i<span style="color: #000000;">&#41;</span><span style="color: #000000;">&#93;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// first look at the particle's image for opaque pixels</span>
	a = _pval <span style="color: #000066; font-weight: bold;">&gt;&gt;</span> <span style="color: #000000; font-weight:bold;">24</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>a <span style="color: #000066; font-weight: bold;">&lt;</span> 100<span style="color: #000000;">&#41;</span> <span style="color: #0033ff; font-weight: bold;">continue</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// it found an opaque-ish pixel, so let's see if there's an opaque pixel in the ship there too</span>
	_sval = shipVec<span style="color: #000000;">&#91;</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span>i<span style="color: #000000;">&#41;</span><span style="color: #000000;">&#93;</span><span style="color: #000066; font-weight: bold;">;</span>
	a = _sval <span style="color: #000066; font-weight: bold;">&gt;&gt;</span> <span style="color: #000000; font-weight:bold;">24</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>a <span style="color: #000066; font-weight: bold;">&lt;</span> 100<span style="color: #000000;">&#41;</span> <span style="color: #0033ff; font-weight: bold;">continue</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #3f5fbf;">/* if we get this far then we have a collision because one
	 * of the ship's pixels is overlapping a particle's pixel.
	 * we're only going to collide with red-colored particles though */</span>
	_pval = _pval <span style="color: #000066; font-weight: bold;">&gt;&gt;</span> 16 <span style="color: #000066; font-weight: bold;">&amp;</span> 0xFF<span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// red channel extraction</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>_pval <span style="color: #000066; font-weight: bold;">&gt;</span> 100<span style="color: #000000;">&#41;</span> <span style="color: #000000;">&#123;</span>
		<span style="color: #6699cc; font-weight: bold;">var</span> px<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a> = <a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span>i <span style="color: #000066; font-weight: bold;">%</span> w<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// translate 1d array coordinate to 2d grid coordinates</span>
		<span style="color: #6699cc; font-weight: bold;">var</span> py<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a> = <a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a><span style="color: #000000;">&#40;</span>i <span style="color: #000066; font-weight: bold;">/</span> h<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
		buffer<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">setPixel32</span><span style="color: #000000;">&#40;</span>px<span style="color: #000066; font-weight: bold;">,</span>py<span style="color: #000066; font-weight: bold;">,</span>0xFF4e88c9<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// colliding pixels are painted on the top of our sprite in a cold blue-ish color</span>
	<span style="color: #000000;">&#125;</span>
<span style="color: #000000;">&#125;</span>
buffer<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">unlock</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></td></tr></table></div>

<p>As you can see on line 133 and 136, each sprite has a block of pixels ready to examine on each tick. The sprite loops through that block and compares every pixel of its own with the pixels in the Vector it got. If there's a match (eg both pixels are opaque) then look at the particle's pixel in detail to see if it's the <del datetime="2009-10-10T20:40:55+00:00">droid</del> one we're looking for and record its findings. </p>
<p>So you can alter line 151 so that the sprites check for specific colors in the particle bitmap, like anything brighter than dark grey (which I did here, or anything with an alpha greater than <code>0.1</code> or... use your imagination I guess?).</p>
<p>Because grabbing a new Vector from the particle bitmap can be so expensive (depending on the size of the sprite), you can time limit the collection so it only samples the particle bitmap once in a short while. In the demo SWF above I sample it once every 100 milliseconds or so, which comes out to about 24 samples a second (given 25 milliseconds per frame at 60 FPS)... as opposed to 2400 samples a second. The casual human eye can't tell the difference but it yields a significant increase in performance. Most performance tricks I've learned are based are smoke and mirror stuff like this.</p>
<p>You can use <code>setPixel()</code> (no alpha) but you'll <em>have</em> to test for color--obviously for a color that isn't what the background of the particle bitmap is, so it's a little more tricky. It's also totally possible to use other sprites as particles as long as you blit them (using <code>copyPixels()</code> or <code>setVector()</code>) to a single bitmap that can be checked by other sprites that collide with them. If you don't know what blitting is, 8bitRocket <a href="http://www.8bitrocket.com/newsdisplay.aspx?newspage=13430">has a good rundown</a> (it's where I first learned about it actually).</p>
<p>And that's pretty much it. You can download the example files/source below.</p>
<p><a title="download source" href="http://labs.coldconstructs.com/e/vonLocalCD.zip"><img class="centered" src="http://coldconstructs.com/siteFiles/download_button.png" alt="download source" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2009/11/pixel-perfect-collision-detection-with-5000-particles/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>AS3 to Pixel Bender guide</title>
		<link>http://coldconstructs.com/2009/10/pixel-bender-gap-guide/</link>
		<comments>http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#comments</comments>
		<pubDate>Mon, 12 Oct 2009 22:00:23 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Discussions]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Pixel Bender]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=134</guid>
		<description><![CDATA[

Best resources for beginners
Syntax overview
More performance tips
Realtime use of Pixel Bender

Asynchronous mode
Synchronous mode


Conclusion


When I set out to write a very simple Pixel Bender (PB) kernel/script thingy, I expected it to be relatively straight-forward, mostly because Adobe has been so good writing quality documentation for its products and/or there is a wealth of info on their [...]]]></description>
			<content:encoded><![CDATA[<div class="toc">
<ol>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-best-resources-for-beginners">Best resources for beginners</a></li>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-syntax-overview">Syntax overview</a></li>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-more-performance-tips">More performance tips</a></li>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-realtime-use-of-pixel-bender">Realtime use of Pixel Bender</a>
<ol>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-asynchronous-mode">Asynchronous mode</a></li>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-synchronous-mode">Synchronous mode</a></li>
</ol>
</li>
<li><a href="http://coldconstructs.com/2009/10/pixel-bender-gap-guide/#toc-conclusion">Conclusion</a></li>
</ol>
</div>
<p>When I set out to write a very simple Pixel Bender (<em>PB</em>) kernel/script thingy, I expected it to be relatively straight-forward, mostly because Adobe has been so good writing quality documentation for its products and/or there is a wealth of info on their products produced by their users. Unfortunately I didn&#8217;t find the dev guide in the Help menu and I missed some key AS3 bits from the links I&#8217;ll post below, but even so I still had a lot of trouble finding some info that really should already have been out on the interwebs. So this post is to fill in the gaps when going from AS3 to Pixel Bender.<br />
Hope it helps <img src="http://coldconstructs.com/random/pint.gif"></p>
<h4 id="toc-best-resources-for-beginners">Best resources for beginners</h4>
<p>Here&#8217;s the best tutorials and explanations I&#8217;ve found so far:</p>
<ul>
<li><a href="http://help.adobe.com/en_US/ActionScript/3.0_ProgrammingAS3/WS3E659D01-10C0-479d-8175-B40950BBC223.html">The official guide</a> and <a href="http://help.adobe.com/en_US/AS3LCR/Flash_10.0/index.html">reference</a>. Slap that F1 key! Also, don&#8217;t forget the Help menu in the toolkit like I did (there&#8217;s the PB-specific language spec and dev guide there).</li>
<li><a href="http://www.flashmagazine.com/tutorials/detail/using_pixel_bender_to_calculate_information/">Using PB as a calculator</a>. Completes the official tutorial.</li>
<li><a href="http://www.kaourantin.net/2008/05/adobe-pixel-bender-in-flash-player-10.html">Great in-depth article</a> with general+performance tips.</li>
<li>Very <a href="http://blog.gamingyourway.com/default.aspx">straight-forward examples</a> + comedy. Can&#8217;t go wrong there.</li>
<li><a href="http://www.derschmale.com/2009/07/23/some-flash-pixel-bender-performance-tips-benchmarks/">Nice user article</a> on optimizations and some speed tests (turns out, for input <code>bitmapData</code> beats <code>ByteArray </code>beats <code>Vector.<T></code>)</li>
</ul>
<h4 id="toc-syntax-overview">Syntax overview</h4>
<p>As a casual programmer of high-level languages and no mid- to low-level ones, I was thrown off by PB&#8217;s awkward syntax. It&#8217;s strongly typed, which is fine, except I&#8217;m not familiar with low-level languages like C or any previous shader language (PB is based on GLSL from what I hear). Here&#8217;s a basic difference:</p>
<blockquote><p>AS3: <code>var i:Number = 12;</code><br />
&#8230;in PB is: <code>float i = 12.0;</code><br />
The decimal in <code>12.0</code> tells PB it&#8217;s a floating point number. If it was just <code>12</code> PB would think it&#8217;s an <code>int</code>.</p></blockquote>
<p>When dealing with &#8220;vectors&#8221; (which are arrays, as in Flash 10&#8217;s odd use of the word &#8220;vector&#8221;) it&#8217;s <code>float2 i = float2(12.0, 2.0)</code>. Notice there&#8217;s no brackets or anything suggesting any type of array present. It&#8217;s simply the type + how big the array is, eg <code>float3</code>. It goes up to 4, for the 4 channels in images: Red, Green, Blue, Alpha). Then, as you can see, intializing the array is a simple matter of putting in the numbers you said would be there. So <code>float4(1.0, 24.2, 0.1, 3.4)</code> is valid whereas <code>float2(1.0, 24.2, 2)</code> is not, because there&#8217;s an extra number in there and it&#8217;s an <code>int</code> (adding insult to injury).</p>
<p><span id="more-134"></span></p>
<p>An important thing to keep in mind is that Pixel Bender sees channels in the order described above (RGBA). This little detail cost me a bit of time because I&#8217;m used to AS3&#8217;s order of ARGB&#8211;the alpha channel is first in AS3 while it&#8217;s <em>last</em> in PB.</p>
<p>To use any of the built-in functions you simply call them as they appear in the reference doc: <code>all(x); atan(x,y);</code> etc., no <code>Math</code> calls like we have to do in Flash (this through me for a loop, lemme tell ya).</p>
<p>For those of you who use the shortcut operations like <code>var i:int = foo < bar ? foo : bar;</code>, then you'll be pleased to hear they're supported in PB too. Just about the only thing "Hydra" (formally the codename for Pixel Bender, now--I guess--the name of the PB Flash implementation) does not support is loops of any kind<strong> and their related break/continue statements</strong>. That last bit is bad because there are times when I want to stop the filter if a certain condition is met. You just have to design your logic to take this into account from the start.</p>
<p>That's the basics but take special note that <code>shader.data</code> is actually an array, so you can do some naughty stuff like iterate through some kinky data and set the input as <code>shader.data['whatever'+i].input = kinky[i]</code>. Also note that in order to set the input for a shader in AS3 you <strong>must</strong> set it to <code>shader.data.vdipb.INPUT = inputImage</code> where <code>vdipb</code> is the variable name you declared in the PB shader itself.</p>
<h4 id="toc-more-performance-tips">More performance tips</h4>
<p>Turns out that after I converted my kernel from using boolean methods (like <code>boolean4()</code> etc.) to <code>if</code> statements, it consistently executed faster. I also got some fractional FPS increases by using the age-old optimization of putting real values (eg 1.2) in the evaluation statement instead of references (eg pixel.r). See the last blog I linked above for some other obvious and not-so-obvious performance tips.</p>
<p>PB math is much faster than straight AS3 math but it's slightly brighter (I wouldn't say it <em>shines</em> per se...) when it runs in asynchronous mode, which is enabled by using <code>ShaderJob</code>. You use <code>addEventListener(Event:ShaderEvent...)</code> and then run <code>start(false</code>) to put it in asynchronous mode (the param is <code>waitForCompletion</code> and it's already <code>false</code> by default). See <a href="http://www.boostworthy.com/blog/?p=243">Ryan's post</a> for a great example of how the <code>ShaderJob</code> has to be setup (<a href="http://blog.gamingyourway.com/default.aspx">Squize's post</a>, linked above, is an even clearer example).</p>
<h4 id="toc-realtime-use-of-pixel-bender">Realtime use of Pixel Bender</h4>
<h5 id="toc-asynchronous-mode">Asynchronous mode</h5>
<p>Reading the above linked performance tips for PB you, like me, might be thinking "OH MAN I can rule the universe with ShaderJob doing bitchwork like heavy collision solving" and you'd be <em>totally wrong</em>. You only have to set the input for a shader once, but you <em>do</em> have to create <strong>a new ShaderJob per computation of the filter every frame/tick</strong>. This is the depressing because <strong>ShaderJob takes a LONG time to start up</strong> and it, unlike the job itself, <em>does</em> use CPU from Flash's main thread--you do not get the asynchronous hotness until the actual job is started. And it is <em>sloooooowwwww</em>. Unless you're doing some serious number crunching or temporary special effect, you will not see a huge benefit from using PB in your game.</p>
<p>To be clear, ShaderJob works well enough for realtime usage but my experiments have shown that it's not fast enough to be executed every frame (unless you're SWF is running at 20 FPS or so). I tried to get it to fulfill my game's collision detection system by processing the entire map, but PB just couldn't handle the job. Still, I do recommend you try it (using Squize's recursive implementation) and see if it works for you. Just keep your hopes down <img src='http://coldconstructs.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<h5 id="toc-synchronous-mode">Synchronous mode</h5>
<p>You can set <code>ShaderJob.start(true)</code> but if you're going the synchronous route, I suggest applying your Pixel Bender kernel by using the filter method. It starts up much faster than ShaderJob and doesn't have to be restarted every time you want to update the input. You do have to wait for it to finish processing before it will move to the next line in your code though, but as I mentioned above, PB math is a lot faster than AS3's Math library. So if you're doing something intense(r) like severe image distortion then PB is definitely worth a shot, but if it's just conditionals then you're probably better off in pure AS3 land.</p>
<h4 id="toc-conclusion">Conclusion</h4>
<p>Besides doing complex calculations, another place where PB would really help though is processing large (like 600 or 10000 pixels wide or bigger) images. It loops through each pixel faster than AS3 does. But remember that in AS3 you can do loops, so easily skipping pixels (using the <code>continue</code> statement) can result in some significant performance gains if you're not processing all the pixels in the input data (eg skipping transparent pixels). There's a lot of pro/cons so experimenting is, as always, the way to go (if you can afford it).</p>
<p>So there it is, all the info I wish was out there when I started learning PB (<em>I can't stop thinking of Peanut Butter!</em>). Hope some of it was helpful and of course I could be wrong about something (except about declaring input once, I've heard otherwise but in practice it worked fine) so please don't hesitate to correct me if so. Good luck and have fun <img src="http://coldconstructs.com/random/pint.gif"></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2009/10/pixel-bender-gap-guide/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Status update: games, the MTX dilemma, housekeeping</title>
		<link>http://coldconstructs.com/2009/10/status-update-2/</link>
		<comments>http://coldconstructs.com/2009/10/status-update-2/#comments</comments>
		<pubDate>Sat, 10 Oct 2009 23:16:11 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Discussions]]></category>
		<category><![CDATA[Housekeeping]]></category>
		<category><![CDATA[Cold Constructs]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[status update]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=187</guid>
		<description><![CDATA[Makin&#8217; games
I&#8217;ve been working on a couple game concepts and want to prototype a few more before committing to one to build out. I&#8217;ve been hacking the hell out of Flixel, which I&#8217;ve decided to use for a most of the games. There&#8217;s a screenshot of game3 on the right there. Weird, eh? Also fugly, [...]]]></description>
			<content:encoded><![CDATA[<h4 id="toc-makin-games">Makin&#8217; games</h4>
<p><img src="http://coldconstructs.com/siteFiles/blogImages/game3_screen01.png" class="alignright bordered" />I&#8217;ve been working on a couple game concepts and want to prototype a few more before committing to one to build out. I&#8217;ve been hacking the hell out of <a href="http://flixel.org">Flixel</a>, which I&#8217;ve decided to use for a most of the games. There&#8217;s a screenshot of game3 on the right there. Weird, eh? Also fugly, but it&#8217;s placeholder art so there. I have a new collision detection system for it that I&#8217;ll be posting about eventually (at least, I&#8217;ve never heard of it before).</p>
<h4 id="toc-the-microtransaction-mtx-dilemma">The microtransaction (MTX) dilemma</h4>
<p>I&#8217;m really excited about all the new services that have been released to allow Flash developers to monetize their games through microtransactions. I fucking hate ads, plus the ROI of them in Flash games is usually shit. Many many years ago I knew microtransactions (MTX) were the future of digital content and I&#8217;m pleased to see the idea coming to the mainstream (in America at least, Asia was quicker on it as usual).</p>
<p><strong>The problem</strong> I&#8217;m seeing with MTX is that Flash developers need to try a lot harder by making <strong>much</strong> bigger games in order to really reap the rewards. Before, you could make a pretty simple, fun and addictive game and monetize it easily with ads. But with MTX, you can&#8217;t do that as easily since you need to build more content for players to buy into. For example, to me, putting premium content in a Tower Defense game isn&#8217;t viable&#8211;the game concept is so small that I doubt anyone is going to pay anything for more turrets or maps (for example). There just isn&#8217;t enough <em>game </em>there.</p>
<p><span id="more-187"></span></p>
<p>So in order to realistically bring MTX into our games I think we&#8217;re going to have to build much bigger games, and that kind of sucks because that makes it much harder for indie devs to make good on their work. Hell, this might actually decrease the quality of Flash games due to the higher gate devs will need to jump to get in. Well, let&#8217;s just see how it goes but I for one am having to take a lot more time building a game worthy of MTX-enabled content <img src='http://coldconstructs.com/wp-includes/images/smilies/icon_sad.gif' alt=':(' class='wp-smiley' /> </p>
<p>By the by, below is my current list of MTX-enabling services currently available. If you know of any others, please leave a comment <img src="http://coldconstructs.com/random/pint.gif"></p>
<ul>
<li><a href="https://www.gamersafe.com/index.php">GamerSafe</a> &#8211; Seems to be the best choice so far. Adds achievements, microtransactions, save games, leaderboards, etc in a unified, web-wide accessible account.</li>
<li><a href="http://www.nonoba.com/developers">Nonoba</a> &#8211; Like GamerSafe, but also has a multiplayer network&#8230; but you must have a nonoba account to keep multiplayer stats/items etc (but guests can still play, just not save). Anyone used their multiplayer API yet?</li>
<li><a href="http://www.mochimedia.com/developers/coins.html">MochiCoins</a> &#8211; MTX only. Can&#8217;t use with other systems so I&#8217;m completely ignoring this one.</li>
<li><a href="http://www.heyzap.com/developers">HeyZap</a> &#8211; Also MTX only.</li>
</ul>
<p>It&#8217;s best to include as many options for your players as possible, so given this list, you would allow premium content to be purchased with GamerSafe, Nonoba and HeyZap.</p>
<h4 id="toc-new-additions-to-c3">New additions to C<sup>3</sup></h4>
<p>I&#8217;ve made a significant number of changes to the site itself. Besides the better layout (<a href="http://960.gs">960gs</a> ftw) I added <a href="http://wordpress.org/extend/plugins/wp-codebox/">this awesome</a> Wordpress plugin that does an excellent job highlighting AS3 code (see previous posts with code)&#8230; except it&#8217;s fat and makes the site load slower, but whatever. I can fix that with another plugin (I <3 WP). </p>
<p>Also you can socialize my posts now, using <a href="http://blogplay.com/">Sociable</a>; you&#8217;ll also see new blog posts updating my Twitter status (I mainly wrote this post to test that actually). I still have a bit to do for the site aesthetically though&#8230; but I kinda like tweaking themes, and now that IE is growing up (sort of) web design has been a little easier. I still can&#8217;t wait for Google&#8217;s <a href="http://code.google.com/chrome/chromeframe/">bitch-slap</a> to MS though. That&#8217;s so baller.</p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2009/10/status-update-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Pixel transition</title>
		<link>http://coldconstructs.com/2009/04/pixel-transition/</link>
		<comments>http://coldconstructs.com/2009/04/pixel-transition/#comments</comments>
		<pubDate>Wed, 01 Apr 2009 20:35:18 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Experiments]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[source]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=79</guid>
		<description><![CDATA[What I wanted was a fast, seamless way to transition from clickable thumbnail on a zui canvas while dynamically loading the content of whatever the thumbnail represented. I just loved the idea of loading content while zooming into a thumbnail without loading a higher-res image to take its place, then having the pixelated thumbnail disintegrate [...]]]></description>
			<content:encoded><![CDATA[<p>What I wanted was a fast, seamless way to transition from clickable thumbnail on a zui canvas while dynamically loading the content of whatever the thumbnail represented. I just loved the idea of loading content while zooming into a thumbnail without loading a higher-res image to take its place, then having the pixelated thumbnail disintegrate to reveal the actual content that got loaded during the transition. Anyway, it was the best idea that I could come up with for my application, so here we are.</p>
<p><a href="http://labs.coldconstructs.com/e/pixelTransition.swf?width=550&amp;height=400" rel="prettyPhoto" title="Click anywhere in the app to restart the effect."><img src="http://labs.coldconstructs.com/i/pixeltransition.png" alt="Pixel Transition demo" class="centered" /></a><br />
<span id="more-79"></span></p>
<p>I started by converting the thumbnail to a Vector array of Bitmaps. I planned on using TweenLite to shuffle each bitmapped pixel off the screen, and hoped I could do some fancy stuff with the Bitmaps like scale them for interesting effects. I did this by dumping the uint values of the bitmap into a ByteArray using getPixels(), then creating a new Bitmap for each value in the ByteArray using readUnsighnedInt() in a while loop. Each new Bitmap (representing a pixel of the original image) was added to that Vector array I mentioned:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p79code6'); return false;">View Code</a> ACTIONSCRIPT3</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table width="100%" ><tr id="p796"><td class="code" id="p79code6"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #6699cc; font-weight: bold;">var</span> pixels<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=bytearray%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bytearray.html"><span style="color: #004993;">ByteArray</span></a> = srcBMD<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">getPixels</span><span style="color: #000000;">&#40;</span>srcBMD<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">rect</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
pixels<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">position</span> = <span style="color: #000000; font-weight:bold;">0</span><span style="color: #000066; font-weight: bold;">;</span> <span style="color: #009900; font-style: italic;">// make sure we start reading from the beginning</span>
<span style="color: #6699cc; font-weight: bold;">var</span> newx<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a> = src<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #6699cc; font-weight: bold;">var</span> newy<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=int%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:int.html"><span style="color: #004993;">int</span></a> = src<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">while</span> <span style="color: #000000;">&#40;</span>pixels<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">bytesAvailable</span><span style="color: #000000;">&#41;</span> <span style="color: #000000;">&#123;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> splodeParticle<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=bitmap%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmap.html"><span style="color: #004993;">Bitmap</span></a> = <span style="color: #0033ff; font-weight: bold;">new</span> <a href="http://www.google.com/search?q=bitmap%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmap.html"><span style="color: #004993;">Bitmap</span></a><span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">new</span> <a href="http://www.google.com/search?q=bitmapdata%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmapdata.html"><span style="color: #004993;">BitmapData</span></a><span style="color: #000000;">&#40;</span>1<span style="color: #000066; font-weight: bold;">,</span> 1<span style="color: #000066; font-weight: bold;">,</span> <span style="color: #0033ff; font-weight: bold;">false</span><span style="color: #000066; font-weight: bold;">,</span> pixels<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">readUnsignedInt</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">,</span> <a href="http://www.google.com/search?q=pixelsnapping%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:pixelsnapping.html"><span style="color: #004993;">PixelSnapping</span></a><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">ALWAYS</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	splodeParticle<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> = newx<span style="color: #000066; font-weight: bold;">;</span>
	splodeParticle<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">y</span> = newy<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #000066; font-weight: bold;">++</span>newx<span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>newx <span style="color: #000066; font-weight: bold;">&gt;</span> src<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span> <span style="color: #000066; font-weight: bold;">+</span> src<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">width</span><span style="color: #000000;">&#41;</span> <span style="color: #000000;">&#123;</span>
		<span style="color: #000066; font-weight: bold;">++</span>newy<span style="color: #000066; font-weight: bold;">;</span>
		newx = src<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">x</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #000000;">&#125;</span>
	container<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addChild</span><span style="color: #000000;">&#40;</span>splodeParticle<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	pixArray<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">push</span><span style="color: #000000;">&#40;</span>splodeParticle<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #000000;">&#125;</span></pre></td></tr></table></div>

<p>I&#8217;d then loop through each item in the Vector to tween them off stage, revealing the loaded content below them.</p>
<p>Turns out this was a pretty dumb idea. The performance was extraordinarily sluggish during the while and for loops (naturally) and I wasn&#8217;t able to get a smooth tween because of this. Also, the ByteArray did not recreate the original image correctly &#8212; it came out rather distorted:</p>
<p><img class="centered" src="http://labs.coldconstructs.com/i/pt-err.png" alt="oops" /></p>
<p>I&#8217;m still not sure why, as this is my first time dealing with the ByteArray class, but I figured I&#8217;d cut my losses and try a different approach.</p>
<p>Since I was getting great results with blitting in other experiments, I figured I should try holding a Vector array of Points that represented the pixels I wanted to move around. The actual &#8220;moving&#8221; simply ran setPixel() on a Bitmap for each Point in the array after I ran some translation calculations to get shit moving all nice-like. Points have a lot of extra baggage that I didn&#8217;t want though, so I just used a custom class that simply stored some dimensional variables and called it good.</p>
<p>I based my classes off of Andre Michelle&#8217;s <a href="http://lab.andre-michelle.com/bitmap-particles-2">Bitmap Particle</a> experiment &#8212; he knows more math than I ever will and came up with a fucking brilliant effect there that I can only dream of achieving, so mad props to that bloke.</p>
<p>Anyway, as you can see this worked out pretty damn well. I could spend a whole week on this experiment, playing with the variables (especially the ignite var) to get different transitional effects, as well as adding more filters&#8230; but I&#8217;ll just leave this basic example for you to play with. Just be sure to show me anything particularly cool you come up with!</p>
<p><a title="download source" href="http://labs.coldconstructs.com/src/pixelTransition.rar"><img class="centered" src="http://coldconstructs.com/siteFiles/download_button.png" alt="download source" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2009/04/pixel-transition/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Pixel particle trails</title>
		<link>http://coldconstructs.com/2009/03/pixel-particle-trails/</link>
		<comments>http://coldconstructs.com/2009/03/pixel-particle-trails/#comments</comments>
		<pubDate>Wed, 04 Mar 2009 04:13:46 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Experiments]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[source]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=31</guid>
		<description><![CDATA[I&#8217;ve been messing around with particles, particularly the blitted, traily kind I guess. Click on the image below to pop and watch it. Grab the source at the bottom and let me know if you do something cool with it.


The particle trails you see are actually all on one bitmap that I draw to after [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve been messing around with particles, particularly the blitted, traily kind I guess. Click on the image below to pop and watch it. Grab the source at the bottom and let me know if you do something cool with it.</p>
<p><a href="http://labs.coldconstructs.com/e/pixelparticletrails.swf?width=600&amp;height=400" rel="prettyPhoto" title="Yay pretty."><img src="http://labs.coldconstructs.com/i/pixelparticletrails.png" alt="Pixel Particle Trails demo" class="centered" /></a><br />
<span id="more-31"></span></p>
<p>The particle trails you see are actually all on one bitmap that I draw to after updating each particle in sequence, per frame tick. The particles themselves are a simple class that keeps track of a few variables such as velocity and position. The class doesn&#8217;t extend anything, instead the Main class of the swf draws a line from where the particle was in the previous frame to where it is in the current frame.</p>
<p>To make them fade over time I simply did a colorTransform on the whole bitmap at the begining of the tick method. I didn&#8217;t alter any hues obviously, I just subtracted the alpha value of the bitmap a little. So the longer the pixel has been in the bitmap, the lower it&#8217;s opacity. I wish I can claim that cleverness but I actually got the idea from somewhere else&#8230; probably <a href="http://www.8bitrocket.com/"/>8bitRocket</a>.</p>
<p>This method of graphics manipulation, called blitting, is the way to get a metric fuck-ton more performance out of Flash than is possible with mere Sprites. You can see there&#8217;s 600 &#8220;particles&#8221; in the demo &#8212; had I simply extended the Sprite class and used that to render the scene, I probably would have only been allowed a few hundred sprites while keeping the framerate at around 30.</p>
<p>If you want to see some great examples of blitting, check out 8bitRocket&#8217;s posts on the subject. You can even find a blitting engine called <a href="http://code.google.com/p/pixelblitz/"/>PixelBlitz</a> &#8212; check out <a href="http://www.photonstorm.com/archives/264/pixelblitz-first-2009-update-lots-of-new-toys-and-shmup-test-1"/>this badass schmup demo</a> of his!</p>
<p><a href="http://labs.coldconstructs.com/src/pixelparticletrails.rar" title="download source" /><img src="http://coldconstructs.com/siteFiles/download_button.png" alt="download source" class="centered"/></a></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2009/03/pixel-particle-trails/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Scaling dynamic text in AS3</title>
		<link>http://coldconstructs.com/2008/06/scaling-dynamic-text-in-as3/</link>
		<comments>http://coldconstructs.com/2008/06/scaling-dynamic-text-in-as3/#comments</comments>
		<pubDate>Tue, 24 Jun 2008 22:27:56 +0000</pubDate>
		<dc:creator>Corey</dc:creator>
				<category><![CDATA[Experiments]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[source]]></category>

		<guid isPermaLink="false">http://coldconstructs.com/?p=29</guid>
		<description><![CDATA[Recently I&#8217;ve had the need to scale a dynamic text field which was fed by XML. Readability after scaling was not important, but it did have to look good (it&#8217;s for a full Flash site). However, scaling the MovieClip that the text field was in would cause some pretty chaotic behavior with the text &#8212; [...]]]></description>
			<content:encoded><![CDATA[<p>Recently I&#8217;ve had the need to scale a dynamic text field which was fed by XML. Readability after scaling was not important, but it did have to look good (it&#8217;s for a full Flash site). However, scaling the MovieClip that the text field was in would cause some pretty chaotic behavior with the text &#8212; the text would try to scale with its parent but in doing so would shift around spastically until the parent MC settled into a new scale. This was unacceptable.</p>
<p><a href="http://labs.coldconstructs.com/e/bitmapText.swf?width=550&amp;height=400" rel="prettyPhoto" title="Click the bottom buttons to see the difference between the two rendering methods."><img src="http://labs.coldconstructs.com/i/bitmapText.png" alt="Scaling dynamic text" class="centered" /></a></p>
<p>A quick google didn&#8217;t yield anything relevant, so I was left to my own devices. I remembered being able to draw pixels to a BitmapData object while writing my game in order to improve performance, so I figured I&#8217;d see if I could just copy the pixels from the text field and &#8220;bake&#8221; it into a bitmap.</p>
<p>Turns out you can. In fact, Adobe had already done this in the help files and it&#8217;s actually extremely easy. Check it out:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p29code8'); return false;">View Code</a> ACTIONSCRIPT3</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table width="100%" ><tr id="p298"><td class="code" id="p29code8"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #6699cc; font-weight: bold;">var</span> tf<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=textfield%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:textfield.html"><span style="color: #004993;">TextField</span></a> = <span style="color: #0033ff; font-weight: bold;">new</span> <a href="http://www.google.com/search?q=textfield%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:textfield.html"><span style="color: #004993;">TextField</span></a><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
tf<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">text</span> = <span style="color: #990000;">&quot;bitmap text&quot;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #6699cc; font-weight: bold;">var</span> myBitmapData<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=bitmapdata%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmapdata.html"><span style="color: #004993;">BitmapData</span></a> = <span style="color: #0033ff; font-weight: bold;">new</span> <a href="http://www.google.com/search?q=bitmapdata%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmapdata.html"><span style="color: #004993;">BitmapData</span></a><span style="color: #000000;">&#40;</span>80<span style="color: #000066; font-weight: bold;">,</span> 20<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
myBitmapData<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">draw</span><span style="color: #000000;">&#40;</span>tf<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #6699cc; font-weight: bold;">var</span> bmp<span style="color: #000066; font-weight: bold;">:</span><a href="http://www.google.com/search?q=bitmap%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmap.html"><span style="color: #004993;">Bitmap</span></a> = <span style="color: #0033ff; font-weight: bold;">new</span> <a href="http://www.google.com/search?q=bitmap%20inurl:http://livedocs.adobe.com/flex/201/langref/%20inurl:bitmap.html"><span style="color: #004993;">Bitmap</span></a><span style="color: #000000;">&#40;</span>myBitmapData<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">this</span><span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">addChild</span><span style="color: #000000;">&#40;</span>bmp<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></td></tr></table></div>

<p>No sweat right? Anyway, since I didn&#8217;t find any help on this anywhere else (granted, I didn&#8217;t look very hard), I thought I&#8217;d share this little adventure of mine. Hope it&#8217;s helpful.</p>
<p><a href="http://labs.coldconstructs.com/src/bitmapText.fla" title="download source" /><img src="http://coldconstructs.com/siteFiles/download_button.png" alt="download source" class="centered"/></a></p>
]]></content:encoded>
			<wfw:commentRss>http://coldconstructs.com/2008/06/scaling-dynamic-text-in-as3/feed/</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
	</channel>
</rss>
