AS3 Coding Conventions & FlashDevelop Snippets

0

Why Use Standards?

As a programmer, attention to detail, consistency, and thoroughness are critical attributes. Coding standards (aka “coding conventions” or “coding style”) aid and develop these abilities. They make it easier to recognize when something is out of place or incomplete.

Additionally, standards simplify and strengthen team development. If everyone on the team writes with the same style, it can greatly reduce the time it takes to understand each other’s code. If multiple styles exist within a given project, class, or even a single function, a great amount of time might be wasted interpreting the style, before one can even attempt to understand the functionality.

Finally, good standards and naming conventions encourage code that is well thought out and self-­documented.

Which Style is Correct?

It should be noted that there aren’t really correct or incorrect styles. The important thing is that the team agrees to comply with a single set of standards, setting aside personal bias for the greater good of the team.

Having said this, there is also no reason to reinvent the wheel or go against the grain. Most languages or industries have standards published by the big players within that industry. For example:

AS3CodingStandards.pdf

The purpose of this document is to suggest a simplified set of standards to be followed for ActionScript 3.0 (AS3) programming. The majority of the standards are directly taken from Adobe’s Coding Conventions (link above), with simplification in certain areas and expansion in others.

Code Snippets/Templates

Adhering to coding conventions may seem like a time sink, but it doesn’t have to be. A good set of code snippets/templates for your IDE of choice can make much of this process automatic. My editor of choice is FlashDevelop. I have created a robust set of code snippets over the years that adheres to these standards perfectly. You can download my snippets here if you would like utilize them.

 

 

AS3 DisplayObject Auto Depth Sorter

3

A common issue I have while creating Flash/ActionScript 3 games is needing to depth sort DisplayObjects based on some property of the display object itself (most often, their y coordinate). I do this so often that, a while back, I created a special class that extends Sprite and automatically handles this for you. I thought it was finally time to share this handy utility class with the world, so here it is.

Example:

For an example, check out the Kung Fu Panda Tales of Po game I worked on (also, reference this article for how I handled pseudo 3d collision detection). When the characters pass by each other across the “y” plane, they are automatically depth sorted without any extra coding work on my part.

Usage:

var mcContainer:SpriteAutoSorter = new SpriteAutoSorter();
mcContainer.sPropertyToSortOn = "y"; // "y" is actually used by default so this line is not necessary
mcContainer.beginSorting();

And that’s it! Now just addChild and removeChild like normal and everything will be handled for you. To save on performance, you should call stopSorting() when it is no longer required. Enjoy!

Source

Kung Fu Panda game - Tales of Po (title screen)

Flash Game: Kung Fu Panda Tales of Po

2

At Seven2, I served as the lead developer on the pilot game for a brand new Nickelodeon tv series based on Kung Fu Panda! This recently released game, called called Tales of Po, is in the running to be Nickelodeon’s 2011 Game of the Year (along with Voltron Ultimate Victory, another game that I served as lead dev on)! It’s a side-scrolling rpg-brawler with similarities to Double DragonCastle Crashers, etc. Stay tuned for future posts on some of they key development issues & solutions encountered while developing this game. In the mean time, go play it!

Kung Fu Panda – Tales of Po (PLAY NOW)

Unite11 (Unity3D) Flash Day 9/27/11

0

Unite11 logo, Unity conference

Today was “Flash Day” at Unite11, which discussed using Unity to publish a swf.  Lucas Meijer & Ralph Hauwert (who started working for Unity in June) were the presenters and did an excellent job with it.

Why?

Unity decided to add Adobe Flash support for people who needed a larger installation customer base. This became possible since the Flash team created Stage3d at such a low API level. But, basically, Unity’s goal is to make sure that you don’t get locked into any one platform.

How?

They created an AS3 API for a large portion of Unity. They will not be publishing this yet, primarily since it is not intended to be read by humans). So Unity scripts are converted to AS3 which then tie in to their AS3 version of the API, and all of this is compiled using the mxmlc compiler.

Demos

They again referenced the impressive ShadowGun demo. Then they showed a few live demos (some spheres with physics falling, being shot, etc). It seemed to work great, but the compile time seemed to take a while. Also, I think I saw the output swf was 13.5 Mb, but I might have seen the wrong file as it flashed by quickly.

They showed a demo of Angry Bots running in the Flash player. They claimed no code changes to target the Flash Player. The game ran nearly perfect (minus a few missing explosions, etc). But nevertheless, it was a very impressive conversion.

What?

  • Pricing: “TBA”
  • Release: “TBA”
  • Awesome: “yes”

Supported in Flash:

  • Unity Physics (IDE controlled)
  • Unity Particle systems
  • Unity Custom & Standard shaders (ported to Agal code automatically for Flash)

Not supported in Flash:

  • Any thing that needs depth textures
  • Advanced audio (Doppler, reverb)
  • Dynamic shadows
  • No mouse-lock (so you can’t make a true FPS where the mouse controls looking)

Be cautious:

  • Huge assets means a huge swf. Be careful.
  • Feel free to push the GPU all you want, be go easy on the CPU.

Supported Scripting:

  • C#
  • JS (strict)
  • Boo

Performance:

Fun quote of the day: “The best way to make your game go faster, is to have it not do stuff” – Lucas Meijer

But basically he was talking about how many things Unity does during compile time instead of runtime, to increase performance. These benefits are translated over to Flash. Examples include Lightmapping/Beast, light probes, occlusion culling, etc. All of these features are extremely awesome and a great benefit.

Asset Imports:

For release 1, there will be no way to import native Flash assets, only a way to control them.

Output:

Everything is published to a single swf (you can include the standard Unity branded preloader if you want it, or create your own). They will eventually support separate asset swf’s from each unity scene, but not for version 1.

Conclusion:

This feature looks freaking awesome. The performance was significantly better than I expected. Nevertheless, for full-blown, large-scale projects, the workflow seems like it could get complicated or bulky quickly. Having said that, this was an early demo, and the team was very open to hearing feedback from the community and adjusting the implementation accordingly (kudos!). So, I will definitely eagerly await the release and believe there can definitely be some clear benefit use-cases for it.

First Think Labs class starts tonight

0

Think Labs Logo

The company I work for, Seven2, along with its sister company, 14Four, or co-sponsoring Think Labs. Think Labs is a series of free classroom training sessions in online and mobile development. For years we’ve been putting our new employees through a rigorous training program and we’ve decided to share this training with the community. We had a large number of talented creatives apply, but only 10 spots were available. Narrowing it down was difficult! So I wanted to first say congratulations to the 10 all-stars that made the cut:

  • Carlos Rivera
  • Eli Snavely
  • Ginny Baxter
  • Jame Stinehart
  • Karli Ingersoll
  • Manny Trembley
  • Mitch Rickman
  • Nicholas Malara
  • Peter Jantz
  • Tyreil Poosri

The first session is an 8-week series dedicated to ActionScript 3.0 programming and it starts tonight! I’ll be co-teaching this course along with my adept partner-in-crime, Kipp Ashford.

If you didn’t make the cut this time around, stay tuned to the blog or the facebook page and we’ll let you know when the next session begins!

Adobe Wallaby (Flash to HTML) gotcha’s & clarification

1

Adobe announced “Wallaby” today, which is the codename for “an experimental technology that converts the artwork and animation contained in Adobe® Flash® Professional (FLA) files into HTML”. To clarify, Wallaby does NOT mean that you now get “Flash on your iOS device” as some sites are misleadingly claiming. Here are the notes from their announcement:

“The focus for this initial version of Wallaby is to do the best job possible of converting typical banner ads to HTML5. Wallaby does a good job of converting graphical content along with complex, timeline-based animation to HTML5 in a form that can be viewed with browsers using a WebKit rendering engine. Supported WebKit browsers include Chrome and Safari on OSX, Windows, and iOS (iPad, iPhone, iPod).

Wallaby‚s design goal was not to produce final-form HTML ready for deployment to web pages. Instead it focuses on converting the rich animated graphical content into a form that can easily be imported into other web pages in development with web page design tools like Dreamweaver.”

The tool as pretty impressive. However, there are definitely some things to be aware of:

  • It (currently) only supports WebKit browsers (as mentioned above)
  • Fla files must be saved in Flash CS5 or later
  • Many features aren’t (currently) supported, including Blend Modes, Tweening attributes, code, certain filters, dynamic masks, etc. A comprehensive list can be found here.
  • Your file size is going to go up, by a factor of 4x-10x (based on my tests) depending on what you’re doing and how you’re going about it. There certainly are some ways to be more efficient, but regardless, your gross file size is going to be higher than your swf was (and this doesn’t include the 74 KB jquery file).
  • Your performance *might* decrease (depending on the # of objects on screen and how you’re going about things).
  • Adobe is welcoming feedback in their Wallaby forum.

This certainly is an impressive tool and can save a ton of time. But it’s not exactly the magic bullet that some are making it out to be. I’m excited to see what Adobe will do next with it!

TUFF Unleashed Title Screen

Flash Game: T.U.F.F. Puppy Unleashed

0

At Seven2, I served as the lead programmer on the pilot game for a brand new Nickelodeon cartoon show called T.U.F.F. Puppy. This game is now in the running to be Nickelodeon’s 2010 Game of the Year. The game is called T.U.F.F. Puppy Unleashed! It’s a grid-based combat game similar to Final Fantasy Tactics.

This game will go up against a different game each day of this week (including one other game I did, Penguins of Madagascar: Oh Snow You Didn’t), and a winner will be crowned at the end of the week. Then this week’s winner will go up against the previous 3 weeks’ winners and one game will be appointed to rule them all (for 2010). A “vote” is cast simply by playing the game.

A shout out to all of the peeps that created open source libraries that we leveraged on this game including: AS3 Signals, TweenMax, Cool Console, Electrotank’s A*, and Bulk Loader.

Now, go play it!

Specifying keyword shortcuts for Google Chrome search engines

Become an Internet Ninja Using Chrome’s Search Keywords

1

You know that awesome Google Chrome address bar that doubles as a search bar? Did you know you can quickly tell it what website you want to search without taking your hands off of the keyboard?

In my Google Chrome search bar, if I want to search a specific website, I just type one of the following strings, followed by a space, followed by my query:

i	Google Images
v	Google Video
m	Google Maps
>	Google: I'm Feeling Lucky
yt	YouTube
w	Wikipedia
a	Amazon
t	Browse Twitter discussions
imdb	imdb.com

So, if I wanted to search for the word “flower” in a Google Image search, I would just type “i flower” in the search bar and press Return.

Settings these keyboard shortcuts up is very easy. Launch Chrome, and then open up Preferences. Then click on the Manage button:

Then, double click on any Search Engine you’re interested in, modify the “Keyword”, and you’re officially an internet ninja!

Flash bug: G KeyCode mysteriously different on key down vs key up

0

I was making a Flash game that required the “G” keyboard key today. It listens for the KEY_DOWN event, stores that this key is currently down in an array indexed by they G keyCode, and then looks for the same array index when a KEY_UP event occurs.

The problem is, it’s not the same keyCode. Every other key on my keyboard traces the same uint for both KEY_DOWN and KEY_UP, but the G key, traces 71 for key down, and 144 for key up.

Don’t believe me? Try it for yourself. Here’s the code:

actionscript3
< view plain text >
  1. this.stage.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler, false, 0, true);
  2. this.stage.addEventListener(KeyboardEvent.KEY_UP, keyUpHandler, false, 0, true);
  3. function keyDownHandler($e:KeyboardEvent):void
  4. {
  5.     trace(&quot;\nkeyDownHandler() $e.keyCode:&quot;+$e.keyCode+&quot;&quot;);
  6. }
  7. function keyUpHandler($e:KeyboardEvent):void
  8. {
  9.     trace(&quot;&gt; keyUpHandler() $e.keyCode:&quot;+$e.keyCode+&quot;&quot;);
  10. }

Update 1: Apparently this only happens when compiling in Flash CS5. If you re-run the swf after compiling it in the debug player, 71 is properly traced both times. Still a bug, but not as severe.

Update 2: Valerio Virgillito, a Flash Professional Sr. Quality Engineer for Adobe, has verified that “This is a known issue on Mac. It’s a player bug and has nothing to do with Flash CS5we have an internal bug filed for [it]. Once it’s fixed for the player the changes will trickle down to authplay

I filed a bug report, which you can see and vote for here:
https://bugs.adobe.com/jira/browse/ASL-154

iPhone development in Flash CS5 Beta (link dump)

1

[In light of recent events, I thought this worth reposting]

It took some digging for me to find all of the resources available on the subject so far, so I thought I’d share what I found:

Designing Flash Applications for iPhone, Arno Gourdol (MAX, 2009)
Source to 4 Flash iPhone apps
, Ted Patrick
Building iPhone Applications with Flash CS5
, Mike Chambers (FITC Edmonton, 2009)
Flash CS5 multi-touch (with source & video)
, Lee Brimelow
Flash Player 10.1 multi-touch FAQ
, Lee Brimelow
Multitouch and the Flash Platform
, Daniel Dura, Matt Bugbee (Max 2009)
Preparing for Multi-touch in Flash (including some 10.1 API’s)
, Kevin Suttle
Designing and Developing for the Multiscreen web
, Thibault Imbert (Max 2009)
Flash CS5 iPhone FAQ
, Lee Brimelow
Example iPhone apps built with Flash CS5
, Adobe TV
Example iPhone apps built with Flash CS5
, Adobe Labs
iPhone Geolocation AS3 API
, Mark Doherty
Applications for iPhone:Developer FAQ
, Adobe Labs
Developing for the Apple iPhone using Flash
, Aditya Bansod
Building Applications for iPhone w/ Flash Pro CS5
, Aditya Bansod (Adobe TV)
Optimizing Flash Content for iPhone Applications
, Scott Peterson & Chris Brichford (MAX 2009)
Adobe’s Flash CS5 iPhone forums
, Adobe
Flash to iPhone
, Veronique Brossier
Flash on iPhone: My Experience
, Ben Garney

Using a Mac? Check out these must-have Quick Look plugins

2

It has been about year since I switched from Windows to Mac and I thought I would release a series of articles that discusses my workflow and the vital tools that I have discovered along the way.

Today, we talk about one of the best features of Apple’s OS: Quick Look. Highlight any file, press the spacebar, and instant preview! The lack of this feature is my biggest complaint whenever I switch back to a Windows OS. Unfortunately, there are a few file types that are either not supported, or else not supported as well as they could be. Enter Quicklook Plugins.

First off, here’s how to install them:
http://www.quicklookplugins.com/how-to-install/

And here are my favorite plugins:

Steve Jobs and Flash: The real “most important reason”

1

If you haven’t, first go read Steve Jobs’ “Thoughts on Flash“.

First, there’s “Open”.
Seriously? Apple is one of the most closed companies in the world. The iPhone & iPad are the most closed and regulated system I have ever seen in my life–by far. I can’t count the # of apps that have been rejected because of ridiculous reasons. I’ve owned 2 different non-iPhone chargers that didn’t work because, according to my iPhone, ”this charging device isn’t supported”. Funny, if I wiggle the device just right so the iPhone doesn’t realize it’s not “genuine”, it works perfectly. If I want to get my stuff into the app store, I HAVE to use Obj C, no alternatives. Around every corner, Apple is the most closed minded, “our way or the highway” company I have ever heard of.

Adobe, on the other hand, has open sourced the ActionScript VM of Flash (Tamarin). And there are multiple efforts to create alternative Flash player’s too: FlirtGnash.

For a much better discussion on this, read Serge Jespers “Flash is as open as HTML5” article.

Give the consumer back the power of choice.

Second, there’s the “full web”.
“Adobe has repeatedly said that Apple mobile devices cannot access “the full web” because 75% of video on the web is in Flash. What they don’t say is that almost all this video is also available in a more modern format, H.264…” -Steve Jobs

“Although Flash has recently added support for H.264, the video on almost all Flash websites currently requires an older generation decoder that is not implemented in mobile chips and must be run in software” -Steve Jobs

So which is it? Most of it is H.264, or most of it is not H.264?

SJ says we should use HTML5, but there are currently so many problems w/ HTML5:

  • The support between browsers is still totally varied and inconsistent. I have to write all sorts of browsers exceptions and include duplicate copies of media in different formats for different browsers (such as mp3 for Safari and ogg for Chrome or Firefox).  And, this is assuming the end user even has the latest browser. The penetration of the latest Flash Player is 98%. But what is the penetration of HTML5 supported browsers? Significantly less. I can’t possibly recommend to our clients that they should target HTML5 if they want to reach the masses (yet).
  • By definition, everything written in HTML5 is public (good old “view source” command). But this becomes a problem when Disney or Nickelodeon pays my company tens of thousands of dollars to make an online game, and they prefer the source to remain private.
  • There are still no designer-friendly tools for creating HTML5. Nor are there timelines for character animations. Nor does HTML5 provide the full feature set currently available to Flash developers. Hopefully this will change someday, but I can’t help but feel like we are taking a huge leap backwards in what can be done on the web right now.
  • Even if a web-based game could be made in either Flash or HTML5 (and there are many that certainly could not), our budget would go WAY up if we had to make it in HTML5 instead of Flash since it would require so many extra hours. Our clients will not be happy to hear this.
  • There is a SIGNIFICANT amount of content on the web today that is done in Flash. Much of this content (most?) will never be redone in HTML5–even if Flash died tomorrow. Many companies can’t or won’t justify re-spending the money to rebuild past projects from scratch using HTML5. There is a large amount of content on the web that I will NEVER be able to access on an iPad. Ever.

Give the consumer back the power of choice.

Third, there’s reliability, security and performance.
I won’t argue this point: Flash has crashed on me many times. But it’s silly to try and say this is solely Adobe’s fault. Have you ever had an iPhone app crash? This is a regular occurrence for me. So should I switch to Android then because iPhone OS sucks? What a silly thought process. Sometimes the app crash might be Apple’s responsibility, but more often than not, the fault lies on the software developer who has bugs or memory leaks in their apps. I should no more abandon Flash over this than I should abandon iPhone OS over this.

Flash security holes? Sure, no doubt about it. But does Apple really think their software doesn’t have security holes also?

Give the consumer back the power of choice.

Fourth, there’s battery life.
Playing games drains my battery way faster too. So should I quit playing games on my iPhone then? Using 3G, GPS, or Blue Tooth drains my battery way faster too. So should I quit using all of those technologies? No. Leave it up to me how I want to spend my battery. Disable Flash by default if you want and post a warning about battery life as a user tries to enable it. This is more than I can say is done when I turn on my 3G which has an extremely significant impact on my battery life. Give the consumer back the power of choice.

Fifth, there’s Touch.
True enough. But touch has only recently become “main stream”. People will slowly stop using roll overs as touch interfaces become more of “the norm”. In the meantime, I’d rather be able to see the “outdated” content than have it blocked altogether. Give the consumer back the power of choice.

Sixth, the most important reason.
Ignoring the fact that Apple themselves have spotlighted multiple apps in the app store created with 3rd party software, sure, I can’t argue with this one. If I wanted to take advantage of iPhone OS 4′s multitasking features, and I was using Flash CS5 to create my app, I would be at the mercy of an Adobe update. But what you are referring to here is Flash in the app store. But with all of your talk about HTML5 earlier, I thought we were talking about Flash in the browser. HTML5 is not going to allow me access to the multitasking API’s either. In-fact, I’m sure we can agree that HTML6 is a LOOOONG way off. Flash in the browser can continue to push the web further in the meantime (as they have been doing for many years). Give the consumer back the power of choice.

Conclusions, and the real “most important reason”.
Two words: business strategy. This is all about Apple making more money–locking more developers into their ecosystem, their stores, their ad systems, their developer licenses, their hardware, etc. Now, I’m not faulting SJ for this–after all, as a CEO, that’s his job. But it’s too bad that consumers are deceived into thinking that the real “most important reason” their freedom of choice is being taken away, is anything other than the value of AAPL.

Changes and Updates

0

Sorry I’ve been MIA for a while, but a lot has changed for me in the past year: my wife Megan and I traveled A LOT (Thailand, Italy, London, Las Vegas, Grand Cayman, Mexico, Belize, Honduras), she got pregnant, we now have a 3 month old, I sold a car and bought a brand new RAV4, and I changed careers. Whew, busy year.

I chose to leave DigiDeal and the casino industry and I now work for a fantastic interactive agency called Seven2 (we’re hiring btw). I haven’t been here for long, but so far, I’m really enjoying it! The owners are awesome, the creatives are genius, the accounts reps are fun and on the ball, and the clients are big (Disney, Nickelodeon, Nick Jr., AT&T, MTV, etc).

Here are two of the games I’ve programmed so far for Nickelodeon:

The Penguins of Madagascar: Oh Snow You Didn’t

Back at the Barnyard: All Cooped Up

Anyway, hopefully I’ll back to posting more regularly now. Stay tuned…  =)

Resizing a Parent Sprite Without Resizing the Child Sprite

0

A co-worker approached me with a problem today. He wanted to resize a parent Sprite (or MovieClip, DisplayObject, etc) without resizing the child Sprite. So, in a nutshell, here’s how you do it:

[ActionScript]

_mcParent._mcChild.scaleX = 1 / _mcParent.scaleX;
_mcParent._mcChild.scaleY = 1 / _mcParent.scaleY;
_mcParent._mcChild.x = _nChildStartX / _mcParent.scaleX;
_mcParent._mcChild.y = _nChildStartY / _mcParent.scaleY;

[/ActionScript]

And here’s a simple demo to illustrate the problem and the solution:

Resizing a Parent Sprite without Resizing the child Sprite

demo | source (.fla)

Go to Top