Author Archive for: srivello

Considering Flash-To-Mobile Development

Category: Industry News | Tags: AIR, Flash, Flex, HTML5, Mobile

THE CHOICES

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.

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).

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;

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

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 for Flash & Flex Introduction

Category: Full Tutorials | Tags: HTML5

While researching technologies for a new Flash multiplayer gaming project, I came across Node.js as a backend techology. I’ve heard of it for a while, but have not yet used it. Its nice.

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)

Download Node.js
Run the installer
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.
Done!

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

Create a new text file HelloWorldNodeJS.js and save (anywhere?) on your local machine
Edit the file in your favorite text editor. For now, just enter the code below this list into that file and save.
Open Terminal and run one line - ‘node /path/to/your/dir/HelloWorldNodeJS.js’
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.

Open Terminal (on Mac) and run ‘ps aux | grep node’
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’.
Where you see ‘PID’ that is the PID. Your PID will be different it will be a #.
Then run ‘kill -9 PID’. Replace PID with your #.

D. Running the client in AS3 (via Socket)

Create a new Flash project using your favorite IDE. My example uses Flash Builder 4.6.x.
Edit your main document class. For now simply replace the class with the code below this list and save.
Compile and run the code. See your output window for the exciting details.
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

Revisit steps B.2 and B.3 for server
Revisit steps C.2, D.2 and D.3 for client
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

'Free Member'-Only Content

You must be a 'Free Member' to see this content. With your access you will enjoy members-only content like this, HD video tutorials, and access to complete source code.

Ready To Join?

Already A Free Member?

Will HTML5 Ever Catch Up to Flash on Features?

Category: Industry News | Tags: Games, HTML5

While reading Transitioning.to, a blog ‘Supporting the Flash Community’s Diversification into New Technologies’, I came across a good post about Flash vs. HTML5.

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/

Alternativa3D Engine for Adobe Flash Goes Open Source

Category: Industry News | Tags: 3D, API, Flash, Games

The Alternativa3D 3rd-party 3D engine for the Flash Platform recently announced it is going open source after 6 years of closed development. An example of this kick-ass engine is the recent release of LastStand Deadzone for Facebook.

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.

Adobe Flash Player Premium Features for Gaming

Category: Industry News | Tags: Business, Flash, Games

So…

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.

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.

Setup Flash Builder For AIR 3.2 Stage3D for iOS/Android

Category: Quick Tips | Tags: AIR, Flash, Flex, Mobile

Stage3D was introduced in Flash Player 11. It allows for GPU-Accelerated 2D and 3D performance in the Flash Player that is 1000x faster than before. It was not publicly available for AIR mobile projects until AIR 3.2.

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

Super Easy Setup

Download the new SDK (“Step 2″)
Unzip the new SDK
Open Flash Builder. Open Preferences. Search for “Installed Flex SDKs”. Look at the URL for an existing SDK. See the image below.
Open Finder (or Windows Explorer) to that ‘sdks’ folder. Drag the new SDK next to the existing sdk(s).
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.

For Step #3
Thats it. Enjoy!

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!

Live Online Training: Intro To The Starling Framework For AS3

Category: Events, Full Tutorials

Starling is a 3rd-Party AS3 framework For Flash Development. It mimics the Flash displaylist API but enables powerful 2D GPU-accelerated rendering.

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

'Free Member'-Only Content

You must be a 'Free Member' to see this content. With your access you will enjoy members-only content like this, HD video tutorials, and access to complete source code.

Ready To Join?

Already A Free Member?

Robotlegs Framework Template

Category: Quick Tips, Source Code, Standards & Best Practices | Tags: AS3, Flash, Flex, Mobile, Robotlegs

Robotlegs (from Robotlegs.org) is a great architectural framework for AS3. It works for both Flash and Flex projects. I have been a fan since the beginnings of the framework and I even created the official “Robotlegs Framework Diagram“.

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

'Free Member'-Only Content

You must be a 'Free Member' to see this content. With your access you will enjoy members-only content like this, HD video tutorials, and access to complete source code.

Ready To Join?

Already A Free Member?

Wishlist Member WordPress Plugin Tutorial

Category: Screencast Tutorials | Tags: WordPress

Now And There

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;

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

'Free Member'-Only Content

You must be a 'Free Member' to see this content. With your access you will enjoy members-only content like this, HD video tutorials, and access to complete source code.

Ready To Join?

Already A Free Member?

FlyerGame – One Game, Many Many Frameworks

Category: Industry News, Quick Tips | Tags: AS3, Games, HTML5, PushButtonEngine, Smash

I wanted to test out a few game frameworks learn more about AS3, Unity, HTML5, and other platforms. Here is a complete list of many, many version with full source code (See ‘Members Resources’ below).

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

'Free Member'-Only Content

You must be a 'Free Member' to see this content. With your access you will enjoy members-only content like this, HD video tutorials, and access to complete source code.

Ready To Join?

Already A Free Member?

Polls

Page 1 of 1412 3 ›»

Author Archive for: srivello

THE CHOICES

CHOOSE – THE PLATFORM

CHOOSE – THE DEVICE

CHOOSE – THE MONETIZATON

CHOOSE – THE DEVELOPMENT PATH

CROSS-PLATFORM DEVELOPMENT

BACKEND

EXAMPLE…

FLASH-TO-MOBILE

NATIVE EXTENSIONS

LINKS

THE FUTURE

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

II. The Second Coming (Halleluiah) – Stage3D

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

Stage3D Games

Spaced Away

Angry Birds Facebook

Waste Invaders

Uses for Node.js with Flash

Tutorial

A. Installing Node.js (on Mac)

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

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

D. Running the client in AS3 (via Socket)

E. Updating your client/server

Next Steps

Member Resources

HTML5 Is Open

Going Open Source (Is Not Evil)

Stay Tuned

What do YOU Think?

So…

Who Pays?

How Much?

Community Reaction

Related Posts

Stay Tuned

The Vocal Minority

What do YOU Think?

Super Easy Setup

Next Steps

Live, Free Online Training

Next Steps

Member Resources

Screenshots

Mix-ins

Next Steps

Member Resources

Now And There

Why Add Membership?

1. The Plan

2. The Process

The Membership Plugin

Installation

Setup

3. The Result

Next Steps

Member Resources

Articles

Downloads of FlyerGame

Next Steps

Member Resources

Polls

Free Member Login

Support Our Sponsors

Category

Tag

Brazilean Developers

Developers

Free Assets

HTML5 Games

Italian Developers

Products

RMC

Spanish Developers

Tutorial

Unity3D Games

I Am Great!