Software development has gone mobile. We see a large audience using smartphones and tablets, and as developers/marketers/entrepreneurs we want in. When planning such a project there are myriad decisions.

CHOOSE – THE PLATFORM

The choice of target platform (e.g. iOS) and target device (e.g. iPad2) is a primary consideration. Apple’s iOS hits the majority of the market but with time others will mature and may offer more competition. Moreover to hit your market you may be best served to offer your software to more than one platform and more than one device-per-platform. Quite quickly a rather conservative project can target 5-10 unique pieces of hand-held hardware.

CHOOSE – THE DEVICE

Each device offers unique features. The market-penetration, platform, processor-speed, input-capabilities, screen-size, and other factors are all important. Two major form-factor camps are ‘phone’ size and ‘tablet’ size. There is some overlap between these categories such as the Samsung Galaxy 1000.

CHOOSE – THE MONETIZATON

There are many monetization schemes possible. Here are a few of the popular ones;

• Free – To gain experience and reputation.
• Freemium – Offer a free version and market within the experience for a pay-version with more features.
• Ads – Integrate video ads, animated ads, or still ads into the experience.
• Micro-transactions – Offer bite-sized purchase opportunities which enhance the experience.

CHOOSE – THE DEVELOPMENT PATH

When the platform(s) and device(s) have been chosen, the path to develop must be chosen. In general there are two strategies

a) Native App Development – This means you use the 1st-party language (and tools) offered by the platform creators. This means using XCode tool with Cocoa framework coded with the Objective-C language when developing for iOS. Native development generally offers the very best potential performance (i.e. for high-end gaming) and tightest integration to the devices (e.g. detect battery level, etc…) and OS/marketplaces (e.g. iOS in-app-purchase).

b) Non-Native App Development – Many 3rd parties offer code libraries and tools to ‘speed up development’. Some of these are in the native language and some are not. Some of these non-native solutions offer the ability to ‘code once (so to speak) and deploy to multiple platforms’.

c) Mobile Web Development – Instead of a standalone application, an experience can be made available via web-browser and development to fit the size of the target (mobile) device(s). With HTML5 much is possible, but in general this is used for less-expressive less-device-specific experiences. It can also be a very inexpensive way to ‘break into mobile’, as you can use assets/code from your existing website..

CROSS-PLATFORM DEVELOPMENT

While the ability to develop one project for multiple platforms offers many advantages in saved development time and ease in maintenance, it also offers many challenges. Designing a compelling application that takes advantage of the unique features of each device and looks polished on the dizzying array of screen sizes out there can be daunting. For Flash-To-Mobile there are many resources on Adobe’s Mobile Devnet to help you learn the basics.

BACKEND

It is possible for an application to be self contained, including all data/assets with the original install. This is common for games. However many projects require internet connectivity. The data/assets loaded can reside on existing servers outside of your control, or can reside on your own servers. Custom backend solutions using typical backend languages (c++, Java, PHP, Python, etc…) may also be required. All of this depends on your particular project. In general any of the development-paths can contact any of these backend solutions, but some may connect more easily than others.

EXAMPLE…

Let’s assume you have a great new game and want to capture a ‘big audience’ with ‘modest investment’. If the application does not require deep-device-integration a recommended choice is to target both iOS (iPad1/iPad2, iPhone3G/iTouch3G, iPhone4G/iTouch4G) and Android (various devices). If your team has Flash expertise the Flash-To-Mobile publish path may be ideal.

FLASH-TO-MOBILE

With Flash CS6 and more-so Flash Builder 4.6, Flash/Flex developers can publish ONE codebase to MULTIPLE platforms. Using Adobe’s AIR 2.7 (latest public release) you can develop many platforms & Devices.

Compatible Target Platform/Devices: Web-Browser (Mac+Windows+Linux+Non-iOS Mobile Browsers), Desktop (Mac+Windows+Linux), iOS (Ipad1+Ipad2, iPhone+iTouch 3rd Generation, iPhone+iTouch 4rd Generation-Retina), Android (Myriad Devices), Blackberry Tablet OS (Blackberry Tablet).

Supported Flash-To-Mobile Device-Specific Features: Flash-To-Mobile does offer view-persistance, data-persistance, video playback, still-camera capture, still-camera-roll save/load, internet access, in-app web-browsing, accelerometer/gyroscope, Microphone, Geolocation, Multitouch, File-system access. Not all devices offer the same features. In the future ‘Native Extensions’ (see below) offer a solution.

Project Setup: A recommended options is one bulky Flex Library with (most) all code and assets, and then one Flex Project *PER PLATFORM*. You add/edit to the library and publish each of the projects as needed. You can test with an mobile-emulator (fastest) window that appears on your computer, or on the device via USB (best to test hardware features like accelerometer. The ‘flash’ code is converted to ‘native code’ (so to speak) before deployment.

Deployment: Upon completion the platform-specific file is uploaded to the platform-specific marketplace (e.g. iTunes’ App Store for iOS). A Flash-to-Mobile project sits along-side native applications. Ostensibly users have no idea the application was developed with non-native tools. The marketplaces do not delineate this or otherwise make that info available in any way to users. The end-user experience can be indistinguishable from a native app (project type and project polish depending).

NATIVE EXTENSIONS

In light of the ‘Device-Specific’ features listed above, Flash-to-mobile currently leaves us without everything we may want to do (e.g. iOS in-app-purchase). The yet unreleased (release date is ‘early October 2011′) Adobe AIR 3.0 will include ‘Native Extensions’. In short, this allows for *ANY* Flash-to-mobile project to access *ANY* feature on *ANY* supported device (Android / iOS / Blackberry Tablet). Developer will require knowledge of both AS3 (flash) as well as the Native language(s) on the target device(s) to add new features. Or your team can find free and premium extensions which the community could share. This is not just for mobile, this technology will also allow AIR on desktop computers and AIR on TV’s to integrate with those devices too.

LINKS

Native Mobile Development

• Google Android
• Apple iOS
• Blackberry Tablet OS

Marketplaces

• iOS App Store (iTunes)
• Google’s Android Marketplace
• Amazon’s Android Marketplace

Non-Native Mobile Development – Flash-To-Mobile

• Flash-To-Mobile (Using Flash and/or Flex) for iOS/Android/Blackberry Tablet OS… also Desktop/TV/Browser
• Success Bringing Flash Games to iOS
• AIR 2.6 (Available in Full Release) – Commonly in use today.
• AIR 3.0 (Available in Public Beta Now) – Offering Native Extensions and more.
• Example of Best-Seller Flash-To-Mobile Game for iOS
• Example of Best-Seller Flash-To-Mobile App for iOS
• Flash-To-Mobile for iOS – Using SWC files to build large Flash and AIR projects with multiple SWF files

Non-Native Mobile Development – Others

• Corona for iOS/Android
• Corona vs Adobe AIR (Great Article)
• RhoMobile for iOS/Android
• Appcelerator for iOS/Android
• Mosync for iOS/Android
• Phonegap for HTML5 Mobile-Browsers

THE FUTURE

Some of what is coming in the future is listed below.. This may or may not all be included in the very-next tools. Recently Adobe has announced What’s new in Flex 4.6 SDK and Flash Builder 4.6.

I. The Second Coming (Halleluiah) – Flash-To-Mobile Native Extensions

This future feature will ostensibly allow Flash-To-Mobile projects to access *ANY* feature on *ANY* targeted device (e.g. in-app-purchase on iOS).

• Adobe AIR 3.0 Native Extension – Explained!
• Adobe AIR 3.0 Native Extension – Demo Mapview on iOS
• Adobe AIR 3.0 Native Extension – Tutorial 1
• Adobe AIR 3.0 Native Extension – Tutorial 2

Updated Febrary 23, 2012: See Here…

II. The Second Coming (Halleluiah) – Stage3D

Stage3D (Formerly codenamed ‘Molehill’) is a set of API’s available in the future that will ostensibly allow Flash Browser projects (using Flash Player 11) and Flash-To-Mobile projects (using Adobe AIR 3.0) to show high-grade hardware rendered 3D. Finally, the Flash Platform can truly compete as a 3D gaming engine. The same API (despite the name) can also be used for radically improved 2D gaming performance too.

NOTE: These API’s are low-level and challenging to understand. We expect 3rd parties will wrap this functionality with easy-to-use API’s for free/premium use.

• Stage3D – Explained!
• Stage3D – Demo!
• Stage3D – How-To! (For 3D Gaming)
• Stage3D – How-To! (For 2D Gaming)
• Unreal Releases ‘Citadel’ – The first interactive demo of UNREAL engine running in Flash Player.
• BlackSun Game for Stage3D

Update March 10, 2012: See Here…

III. The Second Coming (Halleluiah) – Air 3.2 = Stage3D for Mobile + Many Stage3D Frameworks

So with AIR 3.2  (See Adobe Press Release) we can use Stage3D for mobile. This means GPU-Accelerated graphics on iOS/Android. I think there is a marketable benefit on getting the Flash Player to compete against other 3D gaming solutions (such as Unity3D) and perhaps compete less with emerging 2D gaming solutions (such as HTML5 gaming) so I can sympathize with Adobe’s (better late than never) focus on 3D for Flash. This article “Why Starling (or any other 2D framework on top of Stage3D)?” explains some really good reasoning.

YouTube determined that the request did not contain proper authentication.

Mind-blowing Demo’s of AIR 3.2 on mobile

• Five AIR 3.2 Stage3D Mobile Demos That Will Knock Your Socks Off 
• Spaced Away is the first game in the iOS app store to feature Stage3D by developers Falanxia.

Regardless of why, Stage3D is here, and Starling’s power lies in how it uses the Stage3D – first available in Flash 11 and AIR 3.0. Stage3D is designed for GPU accelerated 3D. While its possible to use the Stage3D API’s directly, it is very difficult. There are 3D frameworks for AS3 , but for many game developers we can exploit its power for 2D gaming. That’s why Starling focuses purely on 2D. So an API like Starling helps developers make great content – quickly.

AS3 frameworks use Stage3D for 3D gaming;

• Flare3D,
• Alternativa3D,
• Away3D,
• Minko

AS3 frameworks use Stage3D for 2D gaming;

• Starling
• ND2D
• M2D
• AtomEngine
• Citrus Engine (Recently Upgraded To Stage3D)

Key Articles I’ve written on the subject

• Intro To the Starling Framework (Read It!)
• Angry Birds Launches on Facebook with Starling

Stage3D Games

Spaced Away

---

Falanxia brings its FWA Award –winning space physics puzzle game to both iPad and your web browser.

Play game Learn more

Angry Birds Facebook

---

Join your friends on Facebook to take out Rovio’s famous pigs with enhanced special effects.

Play game Learn more

Waste Invaders

---

Waste Creative’s tech demo lets you blast aliens at a silky smooth 60 fps, across browsers and iPad, with Stage3D.

Show demo Get the source

Node.js is a server software that allows you to a) run JavaScript on the server and b) talk to/from the client-side using http and socket connections. While not designed with Flash in mind, you can easily connect Flash (or Flex) to the socket connection and get real-time data flowing to/from. Very nice.

Uses for Node.js with Flash

What I think is immediately attractive is that you can easily setup a backend for your games. Its running in JavaScript which is easy to use and learn and the write-compile-test cycle couldn’t be faster. You could feed dynamic data to your game such as levels in a level based game. You could feed configuration information in so that you can easily edit it without editing your Flash project. You can create real-time data feeds or multiplayer gaming.

Note: Node.js is light-weight. You’ll have to code pretty much anything (multiplayer gaming) you want to add to it. It is a great starting point though.

Tutorial

I created the following example, and this post within an hour. Within 5 minutes you can setup your own running version of the demo shown in the post. Follow along here or simply download the full source code (See ‘Member Resources’ below) and check it out.

Note: I’m running the node.js server and the Flash swf on my local computer. I imagine this is where I would develop the full game. Its fast and easy to run/edit/run. Then I’d migrate the project to a server. I *think* its trivial to get this running up on a webserver for your users to enjoy, but I have not done that yet.

A. Installing Node.js (on Mac)

1. Download Node.js
2. Run the installer
3. You now use the Mac OSX Terminal program on Mac (or Find any ssh terminal emulator program for Windows) to run Node. We’ll do that farther below.
4. Done!

B. Running the server on Node.js (via Socket)

1. Create a new text file HelloWorldNodeJS.js and save (anywhere?) on your local machine
2. Edit the file in your favorite text editor. For now, just enter the code below this list into that file and save.
3. Open Terminal and run one line -  ‘node /path/to/your/dir/HelloWorldNodeJS.js’
4. Done!

// --------------------------------------
// Imports
// --------------------------------------
var net = require('net');
var mySocket;

// --------------------------------------
// Construct The Socket
// --------------------------------------
// create the server and register event listeners
var server = net.createServer(function(socket) {
	mySocket = socket;
	mySocket.on("connect", onConnect);
	mySocket.on("data", onData);
});

// --------------------------------------
// Events
// --------------------------------------
/**
 * Handles the Event: <code>"connect"</code>.
 *
*/
function onConnect()
{
	console.log("Connected to Flash");
}

/**
 * Handles the Event: <code>"data"</code>.
 *
 * When flash sends us data, this method will handle it
 *
*/
function onData(d)
{
	if(d == "exit\0")
	{
		console.log("exit");
		mySocket.end();
		server.close();
	}
	else
	{
		console.log("From Flash = " + d);
		mySocket.write(d, 'utf8');
	}
}

// --------------------------------------
// Start the Socket
// --------------------------------------
server.listen(9001, "127.0.0.1");

C. Stopping the server on Node.js (via Socket)

Once you run B.3 above, the server runs and stays running unless you program your client or server to kill the connection. If you try to run B.3 without killing the connection you’ll see an error in Terminal (on Mac) containing “Error: listen EADDRINUSE”. To manually kill the connection (this is required if you want to edit and run B.3 again) then run the following sequence.

1. Open Terminal (on Mac) and run ‘ps aux | grep node’
2. This will show a series of lines like this ‘srivello       PID   0.0  0.1  3064476   7152 s002  T     4:41PM   0:00.12 node HelloWorldNodeJS.js’.
3. Where you see ‘PID’ that is the PID. Your PID will be different it will be a #.
4. Then run ‘kill -9 PID’. Replace PID with your #.

D. Running the client in AS3 (via Socket)

1. Create a new Flash project using your favorite IDE. My example uses Flash Builder 4.6.x.
2. Edit your main document class. For now simply replace the class with the code below this list and save.
3. Compile and run the code. See your output window for the exciting details.
4. Done!

package
{

// --------------------------------------
// Imports
// --------------------------------------
import flash.display.Sprite;
import flash.events.DataEvent;
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.events.KeyboardEvent;
import flash.events.MouseEvent;
import flash.net.XMLSocket;
import flash.text.TextField;
import flash.ui.Keyboard;

// --------------------------------------
// Class
// --------------------------------------
/**
 * <p>The <code>NodeJSDemo</code> class is ...</p>
 *
 */
public class NodeJSDemo extends Sprite
{

	// --------------------------------------
	// Properties
	// --------------------------------------
	// PUBLIC GETTER/SETTERS
	/**
	 * The core object which connects client to
	 * 	server for real-time communication
	 */
	private var _xmlSocket:XMLSocket;

	/**
	 * The sole UI element to show some test output
	 */
	private var _textField:TextField;

	// PUBLIC CONST

	// PRIVATE

	// --------------------------------------
	// Constructor
	// --------------------------------------
	/**
	 * This is the constructor.
	 *
	 */
	public function NodeJSDemo()
	{
		// SUPER
		super();

		// EVENTS
		addEventListener(Event.ADDED_TO_STAGE, _onAddedToStage);

		// VARIABLES

		// PROPERTIES
		_textField = new TextField ();
		_textField.width = 300;
		_textField.height = 300;
		_textField.multiline = true;
		_textField.htmlText = "";
		addChild(_textField);

		// METHODS

	}

	// --------------------------------------
	// Methods
	// --------------------------------------
	// PUBLIC
	/**
	 * Handles the Event: <code>Event.CHANGE</code>.
	 *
	 * @param aEvent <code>Event</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onAddedToStage(aEvent : Event):void
	{
		//	CREATE THE SOCKET AND CONNECT - I'M NOT SURE WHAT PARAMETERS ARE VALID HERE
		//		BUT IT MUST MATCH THE SETTINGS WITHIN THE 'HelloWorldNodeJS.js' FILE YOU ARE USING
		_xmlSocket = new XMLSocket("127.0.0.1", 9001);

		// EVENTS
		stage.removeEventListener(MouseEvent.CLICK, 		_onAddedToStage);
		//
		_xmlSocket.addEventListener(Event.CONNECT, 			_onConnected);
		_xmlSocket.addEventListener(IOErrorEvent.IO_ERROR, 	_onIOError);

	}

	// PRIVATE

	// --------------------------------------
	// Event Handlers
	// --------------------------------------
	/**
	 * Handles the Event: <code>Event.CHANGE</code>.
	 *
	 * @param aEvent <code>Event</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onConnected(aEvent : Event):void
	{
		//	TRACE
		trace("onConnect() aEvent: " + aEvent);

		//	EVENTS
		_xmlSocket.removeEventListener(Event.CONNECT, 			_onConnected);
		_xmlSocket.removeEventListener(IOErrorEvent.IO_ERROR, 	_onIOError);
		//
		_xmlSocket.addEventListener(DataEvent.DATA, 			_onDataReceived);
		_xmlSocket.addEventListener(Event.CLOSE, 				_onSocketClose);
		//
		stage.addEventListener(KeyboardEvent.KEY_UP, 			_onKeyUp);

	}

	/**
	 * Handles the Event: <code>Event.CHANGE</code>.
	 *
	 * @param aEvent <code>Event</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onSocketClose(aEvent : Event):void
	{
		//	TRACE
		trace("_onSocketClose aEvent : " + aEvent);

		//	EVENTS
		stage.removeEventListener(KeyboardEvent.KEY_UP, _onKeyUp);
		_xmlSocket.removeEventListener(Event.CLOSE, _onSocketClose);
		_xmlSocket.removeEventListener(DataEvent.DATA, _onDataReceived);
	}

	/**
	 * Handles the Event: <code>KeyboardEvent.KEY_UP</code>.
	 *
	 * @param aEvent <code>KeyboardEvent</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onKeyUp(evt:KeyboardEvent):void
	{
		//	HANDLE KEYS
		if (evt.keyCode == Keyboard.ESCAPE) {
			//1. SEND 'KILL THE SERVER' TO THE SERVER
			_xmlSocket.send("exit");
		}
		else {
			//2. SEND ANY NON-ESCAPE KEY'S CODE ('38' FOR EXAMPLE) TO SERVER
			//		THIS IS A SILLY EXAMPLE OF SENDING A NUMBER TO THE SERVER
			//		JUST SO THE SERVER CAN SEND IT BACK. SIMPLE.
			_xmlSocket.send(evt.keyCode);
		}
	}

	/**
	 * Handles the Event: <code>DataEvent.DATA</code>.
	 *
	 * @param aEvent <code>DataEvent</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onDataReceived(aEvent : DataEvent):void
	{
		try {

			//	Show the server data in text
			_textField.htmlText += ("From Server: " + aEvent.data + "n");

			//scroll down to show latest line
			_textField.scrollV = _textField.maxScrollV;

		} catch (error : Error) {
			//	TRACE
			trace("_onDataReceived error:  " + error);
		}
	}

	/**
	 * Handles the Event: <code>IOErrorEvent.IO_ERROR</code>.
	 *
	 * @param aEvent <code>IOErrorEvent</code> The incoming aEvent payload.
	 *
	 * @return void
	 *
	 */
	private function _onIOError(aEvent : IOErrorEvent):void
	{
		//	TRACE
		trace("_onIOError aEvent: " + aEvent);

		//	EVENTS
		_xmlSocket.removeEventListener(Event.CONNECT, _onConnected);
		_xmlSocket.removeEventListener(IOErrorEvent.IO_ERROR, _onIOError);
		stage.addEventListener(MouseEvent.CLICK, _onAddedToStage);
	}

}
}

E. Updating your client/server

1. Revisit steps B.2 and B.3 for server
2. Revisit steps C.2, D.2 and D.3 for client
3. Done!

Pretty awesome.

Next Steps

• Read an overview of What is Node.js?
• Checkout the official homepage for Node.js
• Download the full source code (See ‘Member Resources’ below).

Member Resources

I shudder at the constant comparison and the partisan callousness on both sides. The article was indeed good, but I wanted to clarify something. When I hear the title question “Will HTML5 Ever Catch Up to Flash on Features?”, I rephrase it a bit. Will ‘HTML5′ (Meaning HTML5 + JavaScript + CSS) and community libraries for each, and developer-friendly IDE’s, create a cohesive replacement that runs predictably across browsers for what is offered by the technology of the Flash Player.

Well, will HTML5 do it?

I say yes, and no.

HTML5 Is Open

I’m underlining here the fractured nature of the HTML5 offering. I think HTML5 is awesome. It can do so much, it performs so well, and as a developer I love that it ‘compiles’ in 1 second instead of 5 or 10 or more with Flash. I think that the low level capabilities we see in HTML5 on Chrome (for instance) facilitated by a useable library (such as a game framework) could cherry pick most any feature offered by Flash and create compelling feature-parity. It could create competition feature per feature. However it is more correct to ask and more challenging to expect that that one feature-set to easily play with some other set of features created by some other developer for another library perhaps focused on another platform or device. HTML5 is by its nature spread more thin than the ‘closed’ Flash System. This allows for more freedom in what the community can do but also places a huge responsibility on the community.

As a game developer, there exist, today, HTML5-based game engines which present an compelling alternative Flash. Some are playable only on the hottest latest browsers, some can also be packaged to mobile ‘apps’ and offered in mobile marketplaces, and some need some time before they can be played by enough people. Depending on the target audience (and their browsers and devices) the feasibility of using a game framework may or may not be viable yet.

What I suspect is that based on early adoption, solid bug and new feature management, and good marketing several of these game frameworks will mature and become defacto choices for game development. But then the question is not – can HTML5 ‘catch up’ to Flash, the question becomes – can ‘Game Framework X’ catch up to Flash.

As a quick aside, AS3 for OOP developers, is a dream compared to JavaScript. Sure, both will mature, but I’m unsure a wholesale improvement in JavaScript is technically or politically possible.

There is news of ActionScript 4.0 though;
http://www.rivellomultimediaconsulting.com/actionscript-4-revealed/

Relevant to this issue, I have recoded one simple, complete game using many (13 as of today) different game frameworks. Check out all the source and learn from it. Its all available free and it is ideal for those who are interested in transitioning.to.

FLYER GAME, ONE GAME, MANY FRAMEWORKS
http://www.rivellomultimediaconsulting.com/flyergame-one-game-many-many-frameworks/

The source code is published on the GitHub, and support can be found on the Knowledge Base and community discussion can be found on the forum.

No concrete reasons are given for the change to open source.

The Alternativa company hopes that the community will continue to use and extend the engine. It hopes this is only the beginning of a new life for the engine.

Going Open Source (Is Not Evil)

Going open source is interesting. Open source is the philosophy which promotes free distribution of a code-base and the community involvement to modify that code-base. Many AS3 projects start as open source and I think the general reception is ‘wow, thanks for starting this project, I may use it, and maybe I’ll even help extend it’. However the community response seems to be quite different if a close project exists for some time as a closed project and then goes open source. It feels to many like the project which was ‘created for my use for free’ now has been ‘abandoned’.

The community reaction to the Adobe Announcement that Flex went open source was strongly negative. Same when the popular Pushbutton Engine was recently rebranded as the community-based ‘Smash‘ game engine.

These fear based reactions are reasonable. The feeling is that what was once taken for granted as a concrete cared-for project now has a questionable future. However like most fear based reactions they are not beneficial reactions.  Project owners are free to chose if/when they release a project open source, and the community can care for a project or choose an alternative. The power is in the hands of the community.

Conversely, and open source project that becomes closed and introduces fees to the community (I have no examples of that) is indeed sad. But that is not the case here.

Stay Tuned

• Sign up for ‘Free Member’ level of this blog now. Its free!
• Like RMC on Facebook. We like likes!
• Follow @srivello on Twitter.

What do YOU Think?

• Is going open source good or bad?
• Please comment below.

On March 28th, 2012 Adobe Announced “Adobe Flash Player Premium Features for Gaming“. Adobe will have new pricing for those creating certain types of advanced content. Content that is much more performant and of much higher quality than what developers (and their end-audience) are used to seeing in the browser.

It is my estimation, that the amount of current projects that this pricing will affects is very small. The amount of developers now or in the future that this pricing will affect is very small. However overreaction and misunderstanding about Adobe, this announcement, and the last 6 months of related news does have a negative affect on public perception, business owners, and the technologies chosen for new projects.

Before the community takes it out of context that “Adobe explains that in the near future, some developers will be required to pay Adobe on royalties from their projects” and overreacts about it — here is a clear programmer-friendly explanation shown below.

Who Pays?

Image URL: http://www.RivelloMultimediaConsulting.com/wp-content/uploads/2012/03/adobe_flash_player_premium_v1.jpg

How Much?

Let’s assume a company (or individual) creates a royalty-applicable project (see above). Here are a few sample payment scenarios to Adobe. If my math is wrong, please send a comment below. Prices are USD$.

• 50,000 revenue (or less):  Payment to Adobe = 0
• 75,000 revenue:  Payment to Adobe = 2,250
• 100,000 revenue:  Payment to Adobe = 4,500
• 500,000 revenue:  Payment to Adobe = 40,500
• etc…

Community Reaction

Using Google, Twitter, and Facebook we see the reaction of the community over this announcement. The gross majority of media, bloggers, and developers are exaggerating the effect of this announcement. I appreciate the anger, but not the libel. Many err to say something like ‘all Flash developers will pay Adobe soon’, which is as we I’ve outlined here, not true.

The few balanced reactions to the announcement are here;

• Rob Rusher’s -  Adobe Flash Player licensing doesn’t apply to you!
• Lee Brimelow’s – Quick comments about Unity and premium features 
• Any more?

Full disclosure: Some of those listed are of course Adobe employees or have an otherwise vested interest in Adobe’s side.

Related Posts

• Setup Flash Builder For AIR 3.2 Stage3D for iOS/Android
• FlyerGame – One Game, Many Many Frameworks
• Angry Birds’ Screams on Facebook with Flash
• Considering Flash-To-Mobile Development

Stay Tuned

• Sign up for ‘Free Member’ level of this blog now. Its free!
• Like RMC on Facebook. We like likes!
• Follow @srivello on Twitter.

The Vocal Minority

Bad press will hurt Flash being chosen for new projects. That I agree with and that is sad. Blame the messenger sure, but also blame the sensationalism of the community.

Truly, relatively few developer’s projects are affected directly by this pricing. And the quality offered by ‘Flash Player Premium’ is different than what is currently considered ‘Flash’ and is so high-quality that there are no rival alternatives to in-browser technologies. Don’t agree..

• Please comment a  link to any ‘Flash Player Premium’ project (Using BOTH API’s mentioned, regardless of revenue) which is in-development or already launched?
• Please comment a link to any in-browser non-Flash project that rivals the quality of a ‘Flash Player Premium’ which is in-development or launched?

What do YOU Think?

• Is this good or bad? Remember taxes pave your roads. Ha.
• Please comment below.

There are lot of new significant features like mouseLock, middle click, right click, silent auto-update and Stage3D on mobile.

Super Easy Setup

1. Download the new SDK (“Step 2″)
2. Unzip the new SDK
3. Open Flash Builder. Open Preferences. Search for “Installed Flex SDKs”. Look at the URL for an existing SDK. See the image below.
4. Open Finder (or Windows Explorer) to that ‘sdks’ folder. Drag the new SDK next to the existing sdk(s).
5. Open the same Flash Builder Panel. preferences panel again. Choose ‘add’ and browse to the new SDK. Don’t set it as ‘default’. But for each new project you create, it will be a choice for you to use.

Next Steps

Checkout other related articles.

• Intro To The Starling Framework For AS3 with Stage3D
• Angry Birds’ Screams on Facebook with Flash with Stage3D
• What *IS* Wrong With AIR 3.0 Native Extensions!

With the help of the Hawaii Adobe Flash User Group, on Thursday April 26th at 5pm EST (2pm PST), I will give a live online screencast to explain more about Starling. Come join us!

Live, Free Online Training

Title: Introduction To Stage3D Flash Gaming With Starling
Date: April 26, 2012 05:00 PM – 06:00 PM (GMT-5 Eastern Time US & Canada). Duration: 50-60 minutes.
RSVP: The event is closed.
Location: Free, On-line through Adobe Connect. The event is closed.
Speaker: Samuel Asher Rivello is the principal of Rivello Multimedia Consulting (RMC). RMC’s Flash and Flex services include software architecture, consulting, development, and training. Sam has over a decade of experience creating games and applications, and is currently traveling the globe to collaborate with top companies. Sam is an Adobe Certified Designer and Developer for Flash, an Adobe Flex Champion, an international public speaker, and a university instructor. His writing and coding have appeared in leading publications such as Adobe’s “EDGE”™ online magazine, and Futurenet Publishing’s “Computer Arts Projects”™ print magazine.

Follow Sam on Twitter: @srivello

Agenda:The session will start with the benefits of Flash for gaming and some new features. We’ll look at Stage3D – Flash Player 11′s GPU accelerated rendering pipeline for 2D and 3D gaming. The bulk of the session will be looking at code for a very simple, yet complete 2D game built with the Stage3D Starling Framework. All source code will be provided to attendees.

Bonus: Time-permitting we’ll checkout two hot Starling extensions – a vector graphics plugin and a particle effects plugin.

Next Steps

• Now Available!: The full 65 minute recording of the online session (See ‘Member Resources’ below).
• Now Available!: The full source-code will be available (See ‘Member Resources’ below).
• Now Available!: The presentation slides will be available (See ‘Member Resources’ below).
• Now Available!: The relevant links will be available

Member Resources

One of the drawbacks of using an architectural framework is the time required to setup the project. To help new developers, veteran developers, and myself, I create and update several templates for Robotlegs (RL). Each is a complete publishable “Hello World” type project. When I start any new RL project I begin with one of these Robotlegs Templates (RLT).

It kicks ass, enjoy!

Screenshots

It is a simple app. (Note images may vary slightly depending on template)

Mix-ins

I combine RL with some other fantastic technologies in some templates.

• AS3-Signals – Events replacement
• BabelFX – Language localization
• Union Platform – Multiplayer

Next Steps

• RLT_Web_Flex – The original! (See ‘Member Resources’ below)
• RLT_Web_Flex_AS3Signals – My favorite! (See ‘Member Resources’ below)
• RLT_Web_Flex_AS3Signals_BabelFX – (See ‘Member Resources’ below)
• RLT_AIR_FlexMobile_AS3Signals_BabelFX – (See ‘Member Resources’ below)
• RLT_AIR_FlexMobile_AS3Signals_Multiplayer – (See ‘Member Resources’ below)

Member Resources

One of my companies is Now And There. The website NowAndThere.com was launched ages ago, and is updated regularly with new blog articles. Currently users come via Google search or perhaps following a Twitter post and arrive to read an article or two. There is no login. Its just a simple blog. I would like to add membership to the site.

This RMC post is a fantastic, thorough tutorial on the before and after of a membership website. It includes text and images here in the post. Below the post there are 3 great HD Screencast Videos (See ‘Member Resources’ below) which repeat what we have here in the post plus much more!

Why Add Membership?

I would like to increase traffic on NowAndThere.com. The 2-prong goal is to get traffic and then keep traffic. Getting new traffic is outside the scope here, but I figure once people visit, I’d like them to stay for a while and even return another day. I think a newsletter (monthly, quarterly, etc…) is a great way to invite current readers back to the site. But, if users are going to express interest in a newsletter and fill out a form (with at least their email), why not keep them as ‘members’? With membership I can offer the newsletter as well as exclusive content. Plus by keeping some content for members only, I can encourage more casual readers to become members (and thus receive the newsletter. I’m rambling, but for me membership + newsletter is the best plan to meet my goals.

1. The Plan

The site currently (See ‘Figure 1′) features no membership. We will change the page layout to provide a membership widget (See ‘Figure 2′).  This membership will allow for non-members to log-in/sign-up and allow logged-in members to see their membership information and to log-out.

Figure 1.

Figure 2.

Membership allows to protect (or restrict) the content on the site for certain members. Its a fairly flexible content. A site could have an entire site that requires membership or just select content which require membership. A site could offer just one level of membership or have multiple levels (at various prices for example).

An analysis of how I would like the site to work is as follows (See ‘Figure 3′). I would like the site’s content to be unprotected by default, but to offer a quick, free membership sign-up to see some posts and in some specific cases to see some parts of some posts. In a broad sense its a 90% unprotected site, with 10% of the content that requires membership. My idea is to encourage sign-up WITHOUT turning away the casual readers. I can always change the 90/10 balance in the future as I see fit.

Figure 3.

The schemes shown (See ‘Figure 3′) will work as follows;

• Scheme #0 - Unprotected content. No membership required. (See ‘Figure 5′ for an example)
  
• Scheme #1 - An unprotected post which gives the gist of the story and then protects the rest  (See ‘Figure 6′ for an example)
• Scheme #2 - A protected post. Users will see it listed on the front page, but cannot see any of the post without membership. (See ‘Figure 7′ for an example)
• BONUS - This last scheme is a modified version of #1 where the entire post is unrestricted and only a list of links at the very bottom is protected. (See ‘Figure 8′ for an example)

Figure 4.

Figure 5.

Figure 6.

Figure 7.

Figure 8.

2. The Process

The Membership Plugin

As mentioned before (See ‘Figure 3′) the NowAndThere.com website was created with the popular website creating tool WordPress. If you are new to WordPress, checkout my complete WordPress: Install & Introduction post which includes HD screencast video. To add membership to NowAndThere we will be using the Wishlist Member (WLM)Wordpress plugin.  If you want to know more about the plugin, read my Wishlist Member WordPress Plugin Review post or simply follow along with the tutorial post you are currently reading.

Before You Start

In addition to this post and the 3 HD screencast videos (See ‘Member Resources’ below) I recommend reading the features on the Wishlist Member website’s features section, the showcase of example websites, the support/documentation, and review the extensive Wishlist Member video series.

All of this will help you learn – what is possible, what you want to do, and how to do it.

Installation

First, do a complete backup of your website. I recommend that before any website development, especially significant development like this.

Second, you must purchase and download the plugin from the Wishlist Member website. Then access the admin of your existing WordPress site, visit the plugins page, and upload the new plugin. Activate the plugin. You will notice (thankfully) that after activation your site has not changed. This allows you to install the plugin safely without changing your user experience.

Setup

Now that the plugin is activated you will begin setting up the plugin. During the course of this process your website will be in limbo. Your user experience will change. For instance you may restrict access to a page but not yet add the widget allowing users to sign-in. So no one can reach that page. This is ok. Its just something to remember. You will want to plan well to minimize the effect on your users. Depending on your familiarity with WordPress and Wishlist Member and the complexity of your site and content protection scheme the entire process may take hours or days of development.

Here is the ordered approach I used with NowAndThere after activating the WLM plugin;

1. Access the WLM dashboard within your WordPress admin
2. Add licensing information you get via email from WLM
3. Follow the ‘Setup Wizard’
4. Add the Registration Widget to your Sidebar
5. Create Membership Levels (I created just 1)
6. Add/Edit Error pages. This is what users see during the sign-up process, sign-out process, and other situations
7. Edit the WL Member » Settings » Protection Defaults
8. Edit the WL Member » Settings » Protection Defaults » “Text to display for content protected with private tags”. This is what users see for Scheme #1.
9. Edit the WL Member » Settings » Email Text. This is what users see during the sign-up process.

–

Expert Tip: Open two web browsers. With #1 – log-in to WordPress and the WordPress Admin. Open your website too (like a logged in user). With #2 – do not log-in to your website. Open the website (like a non-logged-in users). This way you can easily test the logged-in and not-logged-in experience during your development.

3. The Result

Since starting this post, obviously the NowAndthere website has been updated. It now has full membership integration. Nice!

I have not yet added the newsletter. I will gather some members for a while and then use a 3rd party email system, such as MailChimp.com to send my first newsletter to all my current members next month or next quarter.

Ready to see the results? Great. Remember you must sing-up to NowAndThere (click here) to see the logged-in experience and log-out (use the sidebar widget) to see the logged-out experience. Have fun!

Live Examples of each protection scheme;

• Scheme #0 - NowAndThere – 9.5 Simple Habits to Make Your Life Better
• Scheme #1 - NowAndThere – Considering Sicily
• Scheme #2 - NowAndThere – 2012 Annual Preview Of Goals
• BONUS - NowAndThere – Small Countries Worth Visiting

Next Steps

• Watch the 3 HD screencast videos (See ‘Member Resources’ below). This complete post is explained with commentary and examples.
  

Member Resources

Articles

I wrote ‘Flyer Game’ for a series of articles I wrote for Adobe’s “Inspire” (formerly ‘EDGE’) online magazine. To appreciate the HTML5 versions of the game, its great to look back at the general game theory as well as the Flash theory shown in these articles.

• In “An introduction to developing games on the Adobe Flash Platform” I overview the complete AS3 source code in my article
• In “Developing Flash Platform games with the PushButtonEngine” I used a popular framework (PBE) to create the same game.

Downloads of FlyerGame

I provide full source-code to several versions of the FlyerGame. You can compare how each works, and learn more about gaming frameworks that way.

FLASH VERSIONS

• 1. Flash Pro and AS3 (Very Simple) – [Download in 'Members Resources' below]
• 2. AS3 and PushButtonEngine (Component-Based) [PBEv1] – [Download in 'Members Resources' below]
• 3. AS3 and PushButtonEngine (Component-Based) [PBEv2] – [Download in 'Members Resources' below]
• 4. AS3 Stage3D [Starling Framework] (Very Simple) – [Download in 'Members Resources' below]
• 5. AS3 Stage3D [Starling Framework] (OOP Version) – [Download in 'Members Resources' below]
• 6. AS3 and Smash Framework – [Download in 'Members Resources' below]
• 7. AS3 and Flixel (Coming soon!)
• 8. AS3 and FlashPunk (Coming soon!)

OTHER VERSIONS

• Unity3D w/ C# – [Download in 'Members Resources' below]

HTML5 VERSIONS

• EaselJS Framework – [Download in 'Members Resources' below]
• ImpactJS Framework – [Download in 'Members Resources' below]
• CraftyJS Framework – [Download in 'Members Resources' below]
• MelonJS Framework – [Download in 'Members Resources' below]
• Spaceport.io Framework – [Download in 'Members Resources' below]
• LimeJS Framework – Github Source (Coming soon!)

Next Steps

• Wow, there is so much content here!
• Are you new to gaming? There is tons of gaming basics in this posts and code.
• Are you a veteran? Learn to compare/contrast each framework for yourself using the source code (See ‘Member Resources’ below).

Member Resources

Polls