creating multiscreen apps using adobe flash platform

Creating Multi-Screen ApplicationsAdobe Flash Platform

Hemanth SharmaPlatform Evangelist, Adobe Systems Inc.

Handheld Devices Personal Computers Tablets Other Devices

Screens

Identification...

• Platforms - Windows, Macintosh, Android, etc.

• Devices - Tablet, Set Top Box, Mobile (Device != Mobile Only)

• Flavor - Standalone, Web Application, etc.

• etc...

Problems...

• Screen Sizes - Portrait, Landscape

• Operating Systems - Windows, Macintosh, Linux, Android, etc.

• Capabilities - Processor, Memory

• More Capabilities - Accelerometer, Multi Touch, Geolocation

• Programming Languages

More Problems...

• Packaging - Desktop, Mobile, etc.

• Distribution - Web, Desktop, Mobile, etc.

Solution!

Adobe Flash Platform

Flash Professional Flash Builder Flash Catalyst

Adobe Flash Platform Tools

Flash Player 10.1 AIR 2.x

Runtimes

Development Techniques

Code Base & Design

Design + Code

Desktop

Design + Code

Web

Design + Code

Mobile(320x480)

Design + Code

Mobile(640x360)

Cumbersome Duplicates Maintenance Cost

Single Code Base, Multiple DesignCore Code

Design

Desktop

Design

Web(320x480)

Design

Mobile

Design

Mobile(640x360)

Web Connectivity Core Logic

Platform Code System Capabilities

Error Messages Interaction Logic

Still difficult to manage... Also not smart enough!

Single Code Base & Design

Desktop Web Mobile(320x480)

Mobile(640x360)

Core Code Core Design

Intelligent Code

Smart way to achieve... And pays off!

•Core Logic•Error Messages•Web Connectivity•Interaction Logic

•Flexible Layout•Seamless UX

•Screen Dimensions •Platform Logic•System Capabilities

Flash Professional to Flash Builder Workflow

&Multi-screen Development

(Demo)

Example GameLandscape

Example GamePortrait

Example GameSquare

Create Project

Flash Professional Flash Builder

Run the Content

Debug Application

/ Create Project

Create Packages & Class

How did/can we do it?

Structure SummaryMain Project

Generic Package for all my gamesGame 1 Package - Crazy Gems

Game 1 Logic ClassGame 2 Package - Crazy Maze

Game 2 Logic Class

Game 1 UI Elements (Flash Pro)Game 2 UI Elements (Flash Pro)

Publish Settings set in Flash Pro

Best Practices• Core, Platform and Logic

Write these as separate Class

• User InterfaceTry and have Flexible Layout

• Interface LogicWrite this as a separate Class

• Hardware CapabilitiesUse .isSupported API wherever necessary

• JSFLUse JSFL to automate compilation process

• Flex Library ProjectUse Flex Library Project to share code inside projects

Get in touch...

Blog: http://www.hsharma.com/tech

Twitter / Facebook: hemanthsharma

Email: hsharma@adobe.com

Thank You