Mike Chambers: FlashForward

FlashForward Pictures

A couple of people have posted pictures from FlashForward:

If you post some pictures, let me know, and I will list them here.

FlashForward Slides Online

Here are all of the FlashForward slides that I have found posted online:

If you know of some more slides online, post them in the comments.

FlashForward Slides : Flash Remoting with Flash MX and ColdFusion MX

Christian Cantrell has posted his slides from his FlashForward session titled Flash Remoting with Flash MX and ColdFusion MX. If you are interested in getting started with Flash Remoting with ColdFusion or ServerSide ActionScript, this is a great resource, complete with both ActionScript and server side code samples.

You can view the slides here.

You can view a growing list of online FlashForward slide here.

More Flash Forward Stuff

A couple of FlashForward items from around the web.

I expect we will see a lot more FlashForward info online, as more people get home from the conference.

Home from Flash Forward

I just got home from Flash Forward. I was pretty busy at this one and didn't get to hang around with everyone as much i would have liked though. Branden Hall, Christian Cantrell and I all rode the train back from new York to DC. We had a contest to see who could make the coolest thing with the drawing API on the train ride back. Branden won (surprise). Actually, he won first, second and third place. He built a Flash movie that wrote some of the code for his main flash movie (showoff). Oh yeah, I made a little worm, ill post it if i get time (nothing too exciting).

Update, Branden has posted his entry, as did Christian, and here is mine (now you can see why i spend most of my flash time doing client / server stuff ; )).

ok, its late. I'll post more tomorrow and wrap up the Flash Forward stuff.

Oh yeah, the next FlashForward will be in San Francisco in the Spring.

Star Wars in Flash: Developing for the Playstation 2 : Fred Sharples

I came in a little late.

orangedesign created the menus for lucasart's starfighter games (2) for ps2. All of the menus were created within macromedia flash, and played back within a Flash player included with the game.

Have to conisder localization. They do the German version first since the german words tend to be the longest.

Memory considerations, only 32 megs of ram on ps2. compressed sizes of images doesn't matter, it is the uncompressed size. reducing the number of colors. the butterflyed the images (symetrical, so they only have to load half of each image (and then flip it)).

design process

fred is showing some of the images they presented to the lucas arts to get an idea of the type of imagery they were looking for in the jedi starfigter menus. (just regular images they found on the web).

originally, they had a more dirty, mechaninal interface, but in the end it became more modern, clean look.

showed series of drawings of early menu prototypes. really cool.

tips and tricks

memory issues

use ntsc or pal on a television to determine how far you can compress bitmaps.
watch memory. major issue.
butterfly symetrical bitmaps whenever possible.
concern yourself with the unpacked size of images, not the file size.
Optimize your bitmaps before they are brough in.

framerate issues

try breaking text if it doesnt animate fast enough.
avoid using more that a paragraph of type on one screen.
build all of your alpha effects into your bitmaps.
give life to your art by animating smaller screen areas.
with vectors, try finding shapes that use the fewsest number of triangles.
don't use a lot of thin vector lines.

Localization

design with plenty of space for copy. 150%.
localize early in german (long words, design issues)
test doubel byte comparison.
work with native speaker to avoid embarressment.
have experienced designer do the final layout.

Sony Requirements

memory cards stuff is more than half of the work. (what happens when the user pulls a card out, inserts it, etc...).
sony design documentation manual. very big.

card issues, example:

is card full
formatted?
saved data?
ps2 card or ps1?
damage?
is it being formatted?
being read?
did you tell the user how much space is required?
does the user want to format or save the data?
etc...

these all have to be asked and considered within the flash movie.

Middleware layer. the layer of scripting between the hardware / game and flash.

written by game programmer.
a simple script layer
communicates between game, flash and hardware.
almost all UI logic resideds in the flash later.
middleware never drives the flash movie.

example of setting something in the game's middleware. this tells the game to play in stereo mode:

getURL("callback://SetStereoStatus", 2);

getURL("callback://GetStereoStatus", "variableName");

this tells the middleware what variable name to use when it passed the data back to flash. you have to wait one frame in flash before you can reference the data.

Why should flash be on Playstation 2?

Currently not avaliable. playstation 2 is very popular platform.

three versions of flash player for ps2

generation one, used on starfighter. only supported flash 4. built by secret level. software only, very slow. doesn't support loadmovie, so memory issues cause problems.
strobe : (gen 2) - used by lucasarts for some other games (they have in house flash team). supports flash 5, working on MX version. hardware enabled. also ported to xBox and Directx8. supports loadmovie command.
internet version for ps2 : developed by macromedia and sony. deomonstrated at E3 in may 2001. may be related to to linux os and network adaptor kit released by sony. did not play in browser.

showing pictures on ps2 linux kit. pretty cool. comes with harddrive and ethernet port.

website:

Fred wrote a chapter on Flash for the PS2 in Flash Enabled : Flash Design and Development for Devices.

orangedesign.com

secretlevel.com

lucasarts.com

future they want to be able to use the flash player within the games, overlaying the action and even showing video.

testing. worked on pc. they had firewire connection into test unit that they used to upload the entire game into the ps2, and then test it on the console.

orange did not do the sound.

end of session.

Wearable Technology : Wireless Fashion : Phillip Torrone

Phillip started with an overview of the Pocket PC platform, and show some accessories for the Pocket PC (keyboards, cameras, storage, etc)...

Can you make money with Flash on the Pocket PC? Yes.

Microsoft Enterprise Platform : Phillip show a really nice application they did for Microsoft, that deomnstrated and gave information on their enterprise platform. They initially made it for the web, and then took the same assets, and a little tweaking and created it for the Pocket PC platform.
EDS : Portable Pocket PC Based Kiosk : made for executives so they could carry it around and show information. it contained video of some of the EDS ads (cat herding).
Showed a fantasy football application that had data integrated with video sports highlights and ads.
BWM films : showed bmw film on device.

Phillip brought out a pocket pc phone edition (very nice and sleek).

phillip talk about his animated today program. this is a prgram that allows you to run flash animations as your pocket pc today screen background. he showed some fish, a nyc subway map and a flash movie that displays current stock data.

phillip showed his store for animated today screens. he then looged onto handango.net to show how he is making money selling them. showed some new screens that he is going to releas (some really cool animations, some of garfield).

showed erricson t68 phone, and some of its accessories.

showed how to dial phone from flash. use fscommand and tellurl (supported by multiple phones).

phillip then showed some clothes made specifically to hold and work with devices.

he showed his wireless operation app. a flash interface of the classic operation game that controls a vest phillip wears. if you tuch the sides, it shocks whoever is wearing the vest (over the web). phillip keeps track of where people try to shock him (the crouch).

showed buddy lee challenge / staring contest. cobranded with television campaign.

phillip said that he has seen a watch with a flash interface (but he cant talk about it).

showed wearfi, gps bracelets for kids (lets you know where you kids are). he then showed a flash interface for a gps movie trailer tracker, as you walk near a movie theature it tells you what movies are avaliable.

then showed his gps walking stick. basically a pocket pc on top of a walking stick with a flash interface.

phillip is a co-author of flash enabled. his web site is flashenabled.com.

end of session

Rich Application Development with Flash Remoting : Mike Chambers

This was my session on Flash Remoting (sorry, i couldn't blog it in real time). It was an advanced session, and i spent a lot of time talking about architeting Flash Remoting Applications.

I discussed Object Oriented Client / Server interfaces, which is a design patter where you encapsulte all of your client / server code within ActionScript objects. This makes the code more reusable, but also creates a simplified ActionScript API for the service. It also abstracts all of the complexity of the code, and client / server communications away from the developer / user.

I show some simple ActionScript examples that demonstrated this (i will upload them later). I then went through and showed some Applications that used some Client / Server Service Libraries (Email and Stock). I showed an stock charting app, and well as a Flash Email client i created (which has a sneak peak of some new components).

I then showed a simple flash application that called the google web service via Flash Remoting, and allowed you to search google from Flash.

Finally, i pulled up the stock application again, change one line of code (pointing to the server), and switched the back end code from ColdFusion to an .NET DLL written in c#. The Flash Remoting code was the same conencting to both. The server side code has no flash specific code in it, and I pulled up a windows app that used the DLL to deomstrate this.

I will try to post some more details and files later.

end of session

Flash Remoting on ColdFusion MX QA Session

Christian Cantrell.

Christian started by covering some of his slides that he was not able to get to yesterday. He also showed some of his code for the Flash mp3 player that hooks up to his iPod, and finally he show a simple app that uses Flash Remoting to create a Flash console for OSX (allows him to run a pseudo console from a Flash app).

I just realized thay my session is at 10:15 and not 11:00, so I am going to have to cut these notes short.

Video of Flash Forward Keynote?

I noticed a couple of people taping the Macromedia Keynote on Thursday. Does anyone plan on posting video online? If so, let me know.

FlashForward Film Festival Winners

Josh Dura has posted the winner's of the FlashForward Film Festival.

You can view them here.

[via jdb]

Flash Forward : Day 3

Last day of Flash Forward, and it looks like it will be as busy as the previous couple of days. I am going to go to the Flash Remoting QA for Christian Cantrell's session, I then have my session titled Rich Application Development with Flash Remoting. After that I have my QA session (I am going to miss Eric Natzke's session ; (). In the afternoon, i am going to phillip torrone's sessions, Fred Sharples (Star Wars in Flash: Developing for the Playstation 2), (i am not sure what session I will go to at the end.) Anyways, I am going to try to post my notes and comments. You can view them and all of my other FlashForward notes in my FlashForward section.

Pre Film Festival Reception

Everyone is waiting for the Flash Film Festival to start (drinking free beers). I was planning to blog the film festival winners during the session, but my battery is super low so i might not be able to.

Check back later for updates.

Flash Remoting with Flash MX and ColdFusion MX : Christian Cantrell

Christian Cantrell : qantrell@yahoo.com : note all code examples, and slides (very nice) will be included online.

Flash Remoting is a server-side technology which allows for the intergration of Flash applications with existing application server logic.

Exposes remote services through a simple ActionScript API.

Uses AMF (Action Messaging Format) to communicate with player / server. Very efficient binary format made specifically for ActionScript.

Getting started : need

Flash MX
Flash Remoting Components (avaliable from macromedia.com)
A server that has the Flash Remoting Adaptor installed.

Flash Remoting ActionScript objects:

NetServices.as : core ActionScript logic of Flash Remoting. Provides functionality to connect to Flash Remoting adaptor on server.
RecordSet : Object representing a set of data records, usually returned from a database.
DataGlue : Utility object for mapping columns in a RecordSet to proerties of UI components.
NetDebug : Utlity object for helping to debug client/server interactions (using NetConnectoin Debugger Panel).

Creating packages for Flash Remoting Services

A package is implimented as a logical directory structure where the files that contain Flash Remoting services are kept. (start from the document root).

Uses domain name in reverse (com/domainname) to prevent namespace collisions (i.e. two services with the same name). by placing them in a directory structure like this, you dont have to worry about other peoples files overwriting yours (just like java packages).

In actionscript, you use dots, instead of slashes to refer to directory structure (com.domainname) (note, i think you can do it either way-mc).

Creating Flash Remoting Services with ColdFusion pages (.cfm)

ColdFusion pahes that are called through Flash Remoting have access to the "flash" variable scope, which contains all of the data sent from Flash.

The directory containing the page is considered the service, and the page name is treated like the function name.

simple flash remoting service in CFML

<!---package com.macromedia.flashforward--->

<cfset str = #flash.params[1]# />

<cfset flash.result = Reverse(#str#) />

This is a ColdFusion service that takes a string, and returns it in reverse. The params array is an array that contains all of the aruguments and data passed in from the Flash applicaiton (via Flash Remoting).

ActionScript:

NetServices.setGatewayURL(url); this tells Flash where the server is located.

var con = NetServices.createGatewayConnection(); //this returns a reference to the server.

var pageService = con.getService("com.macromedia.flashforward", this); //this gets a reference to the remote service. the second parameter, specifies where the functions that will handle the data sent back from the server will be (in this case on the same timeline as the ActionScript code).

(note : christian is running his presentation from a powerbook with OSX. He is running ColdFusion MX on OSX.).

Creating services for Flash using ColdFusion Components

A single ColdFusion Component can provide multiple services (implimented as functions). These can also be called directly from ColdFusion pages, or as web services.

note : code will be avaliable online.

ActionScript

Instead of specifying callback functions that receive the data from the server, on the main timeline, you should attach them to an object, so you keep the functions within their own scope / namespace.

var result = new Object();

result.onResult = function(data){//stuff here};

christian named his buttons the same as his remote service, that way he can use the button labels to decide which function to call:

function clickHandler(button){urlService[button.getLabel()](input.text);};

performing a databse query using a ColdFusion Component (CFCs)

The entire ColdFusion Query object can be returned directly to Flash. it will be converted to an ActionScript RecordSet object.

You can set a pagesize which determines the number of rows the server wil lreturn to the client until the client asks for more (i.e. only initially send first 10 rows of 1000). Server will then send the rest of the rows on demand (without going back to the database, only to Flash Remoting Adaptor).

Just use a regular CFQUERY tag to get a Query object. You can then return it directly to Flash using CFRETURN.

ActionScript

function that receives data from server:

function onResult(result)

//dataConsumer, dataProvider, labelString, dataString

DataGlue.bindFormatStrings(name, result, "#LastName#, #FirstName#"," #EmployeeID#")

note, my battery is running low.

ServerSide ActionScript

SSAS allows Flash Developers and designers access to server-side programming with almost no learning code.

simple SSAS service:

function sayHello()

    return "Hello World";

called the same way from Flash as you would call ColdFusion services.

my battery died. Christian showed some server side actionscript examples, and (connecting to DB and loading files).

he then showed an Flash App that used Flash Remoting to play mp3s off of his iPod. pretty sweet.

end of session.

Dynamic Drawing with Flash MX : Robert Penner

The slides for this presentation are online.

Robert started off by showing off some of the Flash drawing experiments that have been done by the flash community (all to the tune of "Christmas on acid").

(btw, the room is packed).

Shape Drawing API

Every shape that you draw will be within a movie clip.

MovieClip.lineTo() : draws a line. initially it is invisble, so you need to use lineStyle to give it a color. starts at 0,0 coordinate of movie clip that it is contained within.

MovieClip.moveTo : moves the drawing point to a new position. does not do anything visible.

MovieClip.curveTo : draws curves. takes 4 numbers, two for each curve. control and anchors. anhors are where they end up, and control influences the curve. curves toward control points, but doesn't touch it.

MovieClip.beginFill : for creating solid shapes.

MovieClip.endFill :

If you are not at the starting point, then the final side will automatically be drawn to the starting point. you can then remove the line style (leave it empty), and it will remove the last line.

MovieClip.beginGradientFill : for dynamically creating gradient fills.

MovieClip.clear : will clear all drawings within movieclip. it resets drawing properties (such as linestyle).

framebased, use onEnterFrame event. First step is clear graphics from previous frame, and then draw. repeat. (try putting a lot of values set by random()).

showing more cool drawing api examples. (a bunch of 3d wireframe worlds by glenn thomas, a cad like drawing program, sam wan's mysterons, ).

extending drawing API.

MovieClip.drawLine() (see robert's site for notes / example code). takes a starting and ending corrdinate and draws a line.

showing a bunch of other custom drawing functions (triangles).

note, i had to leave early (halfway though).