Yes, it is a Mobile World
Yes, it is a Mobile World
This photo was NOT photo‐shopped. It is an actual images of old recycled 90’s devices.

Some “Boston‐ian Lingo”
1. CLAM CHOW‐DAHH
1 CLAM “CHOW‐DAHH”
2. DOOR‐CHEST‐AHHH
3. P‐ahh‐k the K‐ahh on the T‐ahh

The Art and Zen of Mobile
Game Creation with Flash
Scott Janousek, Technical Director
Scott Janousek, Technical Director
www.hookenmobile.com
fitc2007@hookenmobile.com
fitc2007@hookenmobile com

About Me
About Me
GENERAL INFO
From Boston, Massachusetts, USA
F Bt M h tt USA
–
Working with desktop Flash for six years
–
Designer & Developer
Designer & Developer
–
3+ year old blog (time for a new one!)
–
MOBILE
Working with Flash Lite 1.1 and 2.x
–
Flash Lite 1.1/2.x Training Instructor
–
Coauthor: “Foundation Flash Applications for Mobile Devices”
–
Mobile Gaming Enthusiast
–
– ™

Flash Lite Design, Development, Training, Consulting

Mobile Games Portfolio
Mobile Games Portfolio
• Flash Lite 1 1 and 2 x
Flash Lite 1.1 and 2.x
• Distribution:
– Working directly with 3rd party mobile game companies
Working directly with 3 party mobile game companies
– Flash Lite Exchange
• More products in 2007
More products in 2007
– Don’t Wake the Dragon, MORE!
viliv p1 Sudoku game
Symbian Series 60 content iRiver Clix game

M bil G
Mobile Games
“Worldwide revenue for mobile gaming
Worldwide revenue for mobile gaming
subscriptions could increase from $3 billion
to $10.5 billion in 2009 “– Juniper Research
Ltd.
Ltd

Mobile Game Markets
Mobile Game Markets
“Power” “Casual”
– Power Gamers – Fun, Addictive
– High Learning Curve No learning curve
–
– More Expensive Inexpensive
–
– Guilt in not finishing No guilt
–
– More time Less time investment
–
investment

Mobile Game Genres
Mobile Game Genres
• Arcade/Action • Multiplayer
– Snake Bomber Alien
Snake, Bomber, Alien – Mario Kart Texas Hold’em
Mario Kart, Texas Hold em
Invasion … • 2‐D, 3‐D Racers
• Role playing games (RPG) – Tron, Mario Kart
Tron, Mario Kart
– Final Fantasy, etc. • Card and board games
• Sports – Slots, Blackjack, Monopoly
– EA SPORTS™ Madden 07 • First Person Shooters
• Skill, Strategy, Logic – Quake, Doom …
– Mi S
Mine Sweeper, Sudoku
Sdk
Above: these just happen to be Flash Lite games that fit some of the genres …

Mobile Game
Design with Flash
“Casual Games make most use of the inherent advantages of the
mobile platform. People want to fill ‘dead time’ with easy to use, but
fun games Bruce Gibson, Research Director with Juniper Research.
fun games” – Bruce Gibson Research Director with Juniper Research

Mobile Game Challenges
Mobile Game Challenges
Smaller Screen Sizes
Smaller Screen Sizes User Input
User Input
• •
Color Depths Walled Gardens
• •
Limited Memory Portability
• •
Limited Processor
Limited Processor Learning Platforms
Learning Platforms
• •
File Size Fragmentation
• •
Battery Life … many more!
• •

“Holy Grail” = W.O.R.A.
Holy Grail W.O.R.A.
• Write Once Run Anywhere
• Nice idea for mobile, but …
– Lots of devices different capabilities implementations etc
Lots of devices, different capabilities, implementations, etc
• Fragmentation is “fact of life”
– N ti J2ME t
Native, J2ME, etc
– Flash Lite is NOT immune, but much LESS affected
Handsets PDAs “Consumer Electronics”

Platform Decisions for
Mobile Games …

Flash Lite Players *
Flash Lite Players
* From Boston? Say “Play‐ahs” ☺

Flash Lite Game Life Cycle
DESIGN GAME
Idea/Concept
DEVELOP GAME
DEVELOP GAME
TEST GAME
Other platforms …
pf Symbian Series 60
y
DISTRIBUTION
DEPLOY OTHER
DEPLOY OTHER DEPLOY
Operators, Aggregators
O t A t
PLATFORMS
& Content Providers
.sis packaging

Mobile Game
Mobile Game
Development with Flash
with Flash
“The Flash Lite Platform offers one of the best environments
for rapid mobile game development for casual type content
for rapid mobile game development for casual type content
found today.” ‐ Me

Flash Lite 1.1 vs. 2.x
Coding Paradigms
FL 2.x ‐ Class Based FL 1.1 ‐ Timeline Driven
• Penetration = Lower
Penetration = Lower • Penetration = Higher
Penetration = Higher
• ActionScript 2.0 • “ActionScript 0.5”
Code Reuse Code Reuse
– –
Modularity Modularity
– –
Maintenance Maintainance
– –
Extensibility Extensibility
– –
Less time to learn
Less time to learn Less time to learn
Less time to learn
– –
Larger project content Smaller project content
– –

Flash Lite 1.1 Syntax Refresher
Flash Lite 1.1 Syntax Refresher
• tellTarget()
– tellTarget( /player_mc/ ) { /:x =+ 1; }
– movie clips can act as libraries (“function clips”)
p ( p)
• eval()
– Si l t P d A
Simulate Pseudo Arrays using variables and eval
i i bl d l
– x1 = 23; eval( “x” add i );
• Game state Frame Labels (menu, gameplay, etc)
• More ...
More ...
– My Flash Lite 1.1 “Reference Sheet” (PDF)

Device Keys/Text Input
Device Keys/Text Input
• Target devices often vary
g f y
• Keys: 0,1,2,3,4,5,6,7,8, #, *
• Soft Keys
y
– Typically LEFT, RIGHT
– FL 2.x supports multiple
softkeys
• Text Input
– FL 1.1 uses device for input
uses de ce o put
– FL 2.x built in text input (T9)
• 5 Way Direction Joystick
– UP, DOWN, LEFT, RIGHT,
SELECT

Keys in Flash Lite 1.1
Keys in Flash Lite 1.1
• Flash 4 style syntax
• “Key Catchers”
– button off Stage with ActionScript
button off Stage with ActionScript
on( keyPress “<UP>” ) { /player_mc/:y += 1; }
• Soft Keys
Soft Keys
– Typically 2 or more
retVal = fscommand2( setSoftKeys left right );
retVal = fscommand2( “setSoftKeys”, “left”, “right” );
on( keyPress “<PAGEUP>” ) { //‐‐do xyz }
EXAMPLE

Keys in Flash Lite 2.x
Keys in Flash Lite 2.x
//‐‐ method #2 – Key Listener //‐‐ method #2 – keyDown event
move_obj:Object = new Object();
bj Obj t Obj t() player_mc.onKeyDown = function() {
l KD f ti () {
switch (Key.getCode()) {
move_obj.onKeyDown = function() {
case Key.UP :
switch (Key.getCode()) {
this y += 1;
this._y += 1;
case Key.UP :
break;
player_mc._y += 1;
}
break;
} }
} }
Key.addListener( move_obj ); Key.addListener( player_mc );
//‐‐ method #3 ‐ onEnterFrame and isDown()
move_mc.onEnterFrame = function() {
EXAMPLE
if (Key.isDown(Key.UP)) { player_mc._y += 1; }
if ( i ( )) { l }
}

ne Button Casual Games
ne Button Casual Games
• Focus 5 Min Sample
– user input, game play and graphics
i t l d hi
• Should be very responsive
–SSmooth Animations
th A i ti
– Immediate Actions
• Game Challenge
Game Challenge
– Better to have many stages/levels
– Timing + Rhythm + Reaction = GAME EXPERIENCE
Timing Rhythm Reaction GAME EXPERIENCE
• Key Lag
– Between device platforms
Between device platforms
– Tweak timing calculations (if needed)

Collision Detection
Collision Detection
FLASH LITE 1.1 FLASH LITE 2.x
FLASH LITE 1.1 FLASH LITE 2.x
Flash 4 syntax ActionScript 2.0 !
• •
hitTest()
hitT t() hitTest() available
hitT t() il bl
• •
Like Math? More complexity possible
• •
Chapter 6 in our book
Ch 6i bk … also in 6
l i6
• •
EXAMPLE EXAMPLE

onEnterFrame()
• Can be your friend for Flash Lite 2.x games
y g
– i.e. Character movement, etc.
enemy_mc.onEnterFrame = move;
player_mc.onEnterFrame = function() { //‐‐ do xyz }
• Performance
– Remember call is executed X times per FPS
– LIMIT multiple onEnterFrames()
p ()
• Use only for more robust target devices
• I l h Li 1 1 “f
In Flash Lite 1.1 = “frame looping”
l i”

File Size
File Size
• Typically no more than 500 KB for SWF
• Some carriers restrict file size (KB)
• Available Bandwidth
Available Bandwidth
– GPRS, 2/2.5G, 3G, others …
• OTA content delivery
– Sometimes user pays per kB download
• Decompression
– FL 2 x SWF decompresses incurring penalty
FL 2.x SWF decompresses incurring penalty
– Images, Sounds must decompress

Mobile Sound
Mobile Sound
Device Sounds Native Sounds
• Playback outside of Flash Lite • Playback within Flash Lite
• Smaller size • Larger Size
• Common formats: • Common formats:
– MIDI, MFi, SMAF, AMR, others – PCM, ADPCM, .WAV, .MP3
“Proxy Sounds”
“P S d”
•
FL 2.x device sound synch
•
Background MIDI Tracks
Background MIDI Tracks
•
Lots of handsets support MIDI
•
SONIFY ORG SOUND RESOURCES
SONIFY.ORG: SOUND RESOURCES
Articles by Hayden Porter

Mobile Game Text
Mobile Game Text
Device Fonts Pixel Fonts
• Preinstalled device fonts • Hundreds available
• Results in smaller file size • Larger file size
• Position anywhere on x, y • Position on x, y integer values
doesn’t matter – i.e. x=0.0, y=0.0
• Nt
Not consistent look & feel
i t tl k&f l • C i t tl k&f l
Consistent look & feel
• No anti‐aliasing • No anti‐aliasing
• Point Size Restrictions
Point Size Restrictions • Use various point sizes
Use various point sizes
Device fonts save space Use pixel fonts for look/feel
Use pixel fonts for look/feel
Device fonts save space
Use pixel fonts for look/feel
Device fonts save space

Mobile Game Graphics
Mobile Game Graphics
“Versus”
Bitmap Vector
“Larger” file size “Smaller” file size
• •
Less CPU resources More CPU resources
• •
More memory Less memory
• •
Scaling/Rotating = Bad
Scaling/Rotating Bad Scaling/Rotating = OK
Scaling/Rotating OK
• •
Vectors preserve look when scaled
Pixilation occurs on bitmap assets when scaled

Target Device Memory
Target Device Memory
• Memory Heaps:
• Static – nearly guaranteed
l d
• Dynamic
• Typically 1000 KB 0 kB and up to 6 000 KB
1000 KB … 0 kB and up to 6,000
• Fluctuates depending on other apps, etc.
• FSCommand2 API
FSCommand2 API
var total_num:Number = fscommand2( “GetTotalPlayerMemory” );
var free_num:Number = fscommand2( “GetFreePlayerMemory” );
• P bl
Problem with Content #1: “Out of Memory”
ith C t t #1 “O t f M ”
• Garbage Collection
• 60
60 seconds idle or significant rise in memory usage
d idl i ifi t i i
• We need an API to avoid memory leaks!

Memory Profiling Tools
Memory Profiling Tools
“OLD” SCHOOL “NEW” SCHOOL
TASK SPY Adobe Device Central
– Symbian Series Devices – Static/Dynamic Heap Info
– Download: – Memory usage graphing
www.pushl.com/taskspy – Heap Adjustments

Target Device Performance
Target Device Performance
• CPU
• Equivalent to “Pentium PC”
Equivalent to Pentium PC
• Target FPS
• CPU “Timer Resolution”
CPU Timer Resolution
• Nokia: 16 FPS, iRiver: 20 FPS
• Other Flash Lite 1 1 devices
Other Flash Lite 1.1 devices
• 8 to 20+ FPS
• Speed‐o‐meters
Speed o meters
• Test FPS capabilities
• K I S S Principle
K.I.S.S. Principle
Keep It Simply Silly
•

Memory & Performance Tools
Memory & Performance Tools
OLD NEW !
Adobe Device Central
TASK SPY
“Performance Calibration Tool”
– Symbian S60 Devices
Each device has index
Each device has “index”
– Download: –
Simulated CPU usage
–
www.pushl.com/taskspy
Performance reporting
–
Only visual elements
–
• AS 2.0 Profiling Tool
http://www.nochump.com/asprof

Screen Sizes
Screen Sizes
• Some common screen sizes on target devices …
176 × 208: Nokia Symbian Series 60
320 × 240/128 x 160: Nokia Series 40
176 × 220 (“204”): Verizon v3c (BREW)
176 220 (“204”) V i 3 (BREW)
320 × 240: Chumby
320 × 240: iRiver u10, Clix 1/2, u20
128 × 128: iRiver e10
480 × 272: PSP
Many others!
Many others!
• Adobe Device Central
– Screen size searching, etc
Screen size searching etc
– Device “Profile sets”

Pixel Depths and Color
Pixel Depths and Color
• Not all devices support the same color depth!
Not all devices support the same color depth!
• 12‐bit to 24‐bit … typically 16‐bit
• Example Devices
l i
• Nokia S40 6131 (24‐bit) versus Nokia S40 (18‐bit)
• Adobe Device Central
• Search capabilities
Color Palette may need adjusting if ported to new target device.

Debugging
Flash Lite Games
• trace() statement
trace() statement • Flash Lite Error Codes
Flash Lite Error Codes
trace( “Got here!” );
• Common Errors
• Toggling trace
Toggling trace – O t fM
Out of Memory
– “Bad Data”
//trace( “Got here!” ); … or:
– ActionScript Stuck
• Friendly Ghost Tool
• Flash Lite 1.1
Orison Technologies Product

Optimization
“Tips and Tricks”
Use bitmaps over vectors where possible
•
.PNG’s over .JPG’s for bitmaps
p
•
Optimize shapes and outlines
•
Split up and tile complex Background Bitmaps
Split up and tile complex Background Bitmaps
•
AVOID:
•
– animating simultaneous movieclips
– complex uses of Math and looping
– a lot of ActionScript contained in one frame

Optimization
“Tips and Tricks”
• Analyze size reports and optimize
l d
• Devnet Articles have LOTS OF TIPS!
– http://www.adobe.com/devnet/devices/
p
• MANY MORE tricks for Flash Lite (2.x) …
“Optimizing content for Flash Lite 2.0” ‐ Josh Ulm (Adobe)
http://www.adobe.com/devnet/devices/flash_lite_optimization.pdf

Misc Platforms
“Perhaps the hardest thing with Flash Lite is
knowing the strengths and weaknesses of
the each and every reference platform.
the each and every reference platform ” –
Me

iRiver Clix Game
iRiver Clix Game
• ALIEN INVASION
– Casual Game
– Rapid Game Development = 2‐3 days for DEMO
p p y
– Flash Lite 2.0 (ActionScript 2.0)
– OOP (Object based style architecture)
j y
WALKTHROUGH

Chumby Games
Chumby Games
• Flash Lite “2.1” Player running under Linux
•TTarget Frame Rate: 12 fps
F R
• Screen size: 320 px × 240 px
• Sound: MP3
• User Inputs:
• Touch Screen, Bend Sensor,
• Light Sensor, Accelerometer
• “Channels” and “Widgets”
• “Throw‐away” type games
• Simple == better Experimental Chumby Games

PSP Flash Games
PSP Flash Games
• Download update configure not preinstalled
Download, update, configure … not
– Sony PSP ROM update version 2.70 or later
• Flash Player 6 (6 0 72 27)
Flash Player 6 (6,0,72,27)
– Reality = Think “Flash Lite 2.1”
• Run methods
Run methods
– embedded in HTML page, standalone SWFS in web browser
– file:/flash/filename.swf
• PSP Dev Center on Adobe
– Features and Technical Info:
• http://www.adobe.com/devnet/devices/psp.html

Flash Lite Multiplayer games
Flash Lite Multiplayer
“’Turn style’ games make most sense … but it depends
on your deployment environment including: operator,
dl i i l di
bandwidth, target devices, etc.” – Me

Multiplayer Games
Multiplayer Games
• What kind of games make sense?
– Turn based games … Card Games, Puzzles, etc.
bd d l
• Communication Methods
– HTTP (Polling) Flash Lite 1 1
HTTP (Polling) – Flash Lite 1.1
• loadVariables(), loadVars(), etc Custom Socket Server … Chapter 6
– XML Socket
• Flash Lite 2.1 or higher
• Sushi Socket Server (Flash Lite API)
– Flash Lite = Bluetooth
• Intercommunication with 3rd party application
p y pp
Sushi Socket Server
• Look for an “article” soon …
EXAMPLES

Mobile Game Testing
Mobile Game Testing
Emulators help … but “Rule #1: Always test on actual
target handsets
target handsets” ‐ ME

“Emulators”, Simulators, & Testing
Emulators , Simulators, & Testing
• All target devices
All target devices
– Adobe Device Central
• GSM
– Nokia 3rd Edition SDKs
• BREW
– Qualcomm Simulator
Qualcomm Simulator
• Others …
ALWAYS TEST CONTENT ON TARGET DEVICES!

M bil G
Mobile Game
Deployment
l
“Worldwide revenue for mobile gaming
subscriptions could increase from $3 billion
to $10.5 billion in 2009 Juniper Research
to $10 5 billion in 2009 “– Juniper Research
Ltd.

Game Distribution
Game Distribution
• Aggregators, Content Providers, Operators
Aggregators, Content Providers,
• Device Manufacturer Pre‐installation
… and MANY MANY OTHERS!
• Memory Card (MMC) = “Virally”

Wrap Up
W U
Q&A, Where to go from here?, Future thinking
Q&A Where to go from here? “Future thinking”

Q&A
Q & A
• Questions?
• What can we do with Flash Lite 3?
– Native Flash Video now supported
i l h id d
– T.B.D.
• “Wi h Li ” f Fl h Li
“Wish List” for Flash Lite > 2.x
2
Garbage Collection API
–
Bitmap Caching?
–
Access to Camera/Bluetooth Support
–
LBS Support (Location Based Services)
LBS Support (Location Based Services)
–
Others …
–

Where to go from here?
Where to go from here?
• Foundation Flash Applications for Mobile Devices
Foundation Flash Applications for Mobile Devices
– http://www.flashmobilebook.com
• Adobe DevNet articles
– http://www.adobe.com/devnet/devices/
•
– http //frame27 blogspot com
http://frame27.blogspot.com
• Contact Me
fitc2007@scottjanousek com
fitc2007@scottjanousek.com
• Game Groups:

This slide left blank intentionally (almost)

MISC (unused/”nix”‐ed)
MISC ( n sed/”ni ” ed)

Math and Physics
Math and Physics
• Limited Device Capabilities
– Handsets vs. portable consoles
– Memory and Performance
EXAMPLE
• Avoid overtly complex game computations
Avoid overtly complex game computations
• Flash Lite 1.1
– supports limited Flash 5 object
supports limited Flash 5 object
– Drawing API can be simulated (sort of)
• Flash Lite 2 x
Flash Lite 2.x
– supports AS2 Math object
– Drawing API
Drawing API
– onEnterFrame()

Flash Lite Games for iRiver
Flash Lite Games for iRiver
• iRiver Portable Media Players
• Fl h Li 1 1
Flash Lite 1.1: u10
• Flash Lite 2.x: e10, Clix, “u20” (Clix 2G)
• D‐Click Flash Lite interface
• Up, Down, Left, Right, “softkeys” are +/‐
• Capabilities:
• Flash Lite Games
Flash Lite Games
• MP3, stored data (u10), more!
• Custom fscommand2’s
• Yuck … Flash Lite API limitations

Methods of Game State
Methods of Game State
“Shared Objects” External Server
• Mobile Shared Objects (FL 2.x) • Requires external data
connection
• Write2File (FL 1.1)
• Databases (MYSQL)
• Pros: No data connection
• Pros: Persistent in db
• Cons: Not always supported
(only Flash Lite 2), file size
(only Flash Lite 2) file size • Cons: Requires connection
Cons: Requires connection
Entering Predetermined “Codes”
• Enter code “xyz” to get to level 3
• Pros: Simple to implement
• Cons: Can decompile to figure out codes
EXAMPLE

Leveraging Vibration
Leveraging Vibration
• Some devices support this feature
Some devices support this feature
– Nokia 6680 for example
• Simulate the result of an action or event
Simulate the result of an action or event
– Hit wall, Player died, alerts, etc.
• retVal = fscommand2(“StartVibrate”,on,off,repeat);
tV l f d2(“St tVib t ” ff t)
• Enhancement
– never require this for game play
EXAMPLE

fscommand2 API
fscommand2 API
SetQuality
•
FullScreen UnEscape
• •
StartVibrate
•
GetTimeHours GetPowerSource
• •
StopVibrate
•
GetTimeMinutes GetBatteryLevel
• •
GetVolumeLevel
•
GetTimeSeconds GetMaxBatteryLevel
• • GetMaxVolumeLevel
•
GetTimeZoneOffset SetSoftKeys GetSignalLevel
• • •
GetMaxSignalLevel
•
GetTotalPlayerMemory ResetSoftKeys
• •
GetNetworkConnectStatus
•
GetFreePlayerMemory GetDateDay
• •
GetNetworkRequestStatus
•
GetLanguage GetDateWeekDay
• •
GetNetworkStatus
•
GetDeviceID GetDateMonth
• • GetNetworkName
•
GetPlatform GetDateYear SetInputTextType
• • •
Quit
•
GetDevice GetLocaleShortDate
• •
ExtendBacklightDuration (FL 2.x)
•
Launch GetLocaleLongDate
• •
setFocusRectColor (FL 2.x)
•
Escape GetLocaleTime
• •
fscommand2’s execute immediately … not supported on desktop
retVal = fscommand2( “FullScreen”, true ); //‐‐ fullscreen mode (if supported)

“Toolsets”
Toolsets
• Mobile Tools • Simulators
• FEExplorer • i‐mode
• TaskSpy
py • Simulator
• Nokia
• PC Suite
• 3rd edition SDK
• Verizon
• App Loader
• BREW Simulator