Flash on Tap slides

Flash on Tap 2009

Jamie KosoyAssociate Technical [email protected]

Thursday, June 4, 2009

mailto:[email protected]

mailto:[email protected]

the situation


the situation


the situation


the situation


4 weeks until launch.

the situation


the situation


10 fundamentals to our process.


1. Give everyone a say.


give everyone a say

StrategyProductionDesignDevelopment


give everyone a say


bad.


give everyone a say


good.


2. Never say it’s too hard.“Non-trivial” is better.


3. Build fast.


In Flash:

+ Set relative publish settings.

+ One Document root to rule them all.

In HTML/CSS/JavaScript:

+ Publish main SWF to the root directory.

build fast


+ Leverage the community.

- GTween

- BulkLoader

- Corelib

- SWFObject

- SWFAddress

build fast


Simple Code Rules

- $argument

- _private

- public

- __private static

- CONSTANT

build fast


Oh yeah, protected variables:_vvv$_$$pppp$_$p____$_$$$$protected__$p_________myInfo_loadercontentloaderinformation

build fast


Main

Header Footer

Model

BigScreen

(Some Footer Component)

build fast


obligatory code slide

build fast


public function Main()

{

if(stage) _initialize();

else addEventListener(Event.ADDED_TO_STAGE,_initialize,false,0,true);

}

private function _initialize($evt:Event = null):void

{

Security.allowDomain('*');

stage.scaleMode = StageScaleMode.NO_SCALE;

GTween.timingMode = GTween.FRAME;

Out.enableAllLevels();

if(Environment.IS_IN_BROWSER) Out.disableAllLevels();

_layers = [];

_layers[Model.ABOUT] = new About(about_mc);

_layers[Model.HEADER] = new Header(header_mc);

_layers[Model.FOOTER] = new Footer(footer_mc);

_layers[Model.SCREENS] = new Sprite(); // jk: screens will get added to this sprite.

_layers[Model.SUBMIT] = new Submit(submit_mc);

for(var i:int=0;i<_layers.length;i++)

{

_layers[i].tabEnabled = false;

addChild(_layers[i]);

}

_layers[Model.FOOTER].addEventListener(“foo”,_footerOnFoo,false,0,true); // jk: an example event.

}

build fast


4. Build ugly.


build ugly


build ugly


build ugly


build ugly


5. Trust the timeline.


trust the timeline


trust the timeline


stop();

dispatchEvent(new AnimationEvent(AnimationEvent.ANIMATE_IN));

trust the timeline


+ Developers

- No motion chops.

+ Designers

- Lots of motion chops.

So the equation in codespeak:

if(developer.chops.motion < designer.chops.motion)

assignMotionWorkTo(designer); // jk: duh

trust the timeline


TimelineHelper class: http://www.adobe.com/devnet/flash/articles/timelinewatcher.html(tinyurl version): http://tinyurl.com/cybwnr

trust the timeline


http://www.adobe.com/devnet/flash/articles/timelinewatcher.html






6. Buy the developer whiskey.


7. Mise en place.


In Flash:

+ Deep linking

+ Loading scheme(s)

+ Library items organized

In HTML/CSS/JavaScript:

+ SEO

+ Flash detection

+ Minimum browser resize

mise en place


mise en place


mise en place


mise en place


8. Start from scratch.


9. Strive for exellence.(not perfection)


strive for excellence


+ Idea was pretty... but not a mathematically perfect helix.

+ Bottles need to dynamically “swing” on rollover.

+ Each bottle is used in the site in several other places.

- 120kb per bottle.

- Must be front loaded.



Were you invited?Reindeer Games


Were you invited?Reindeer Games






10. Think simple.


+ Give everyone a say.

+ Never say it’s too hard.

+ Build fast.

+ Build ugly.

+ Trust the timeline.

+ Buy the developer whiskey.

+ Mise en place.

+ Start from scratch.

+ Strive for excellence, not perfection.

+ Think simple.

in conclusion


bigspaceship.com

labs.bigspaceship.comtwitter: jkosoy

thanks.


Technology

Flash on Tap slides