Chicago Flex User Group Presentation - Adobe Flex Frameworks

38
Introduction to Flex Application Architecture & Frameworks 1 Adobe Flex User’s Group Dave Meeker & Rhazes Spell [email protected] | [email protected]

description

Dave Meeker and Rhazes Spell gave this presentation to the Chicago Adobe Flex and AIR User Group: Flex Application Architecture and Framework Considerations for Adobe Flex Applications that deliver a killer user experience.

Transcript of Chicago Flex User Group Presentation - Adobe Flex Frameworks

Page 1: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Introduction to Flex Application Architecture & Frameworks

1

Adobe Flex User’s Group

Dave Meeker & Rhazes [email protected] | [email protected]

Page 2: Chicago Flex User Group Presentation - Adobe Flex Frameworks

2

Community Is Important

Thanks for coming to this event, and for being a part of the Flex Development Community.

It is the community of developers that have made Flex what it is today.

Please encourage others to get involved!

Page 3: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Who Are We?Dave Meeker - UX Strategy Lead, Roundarch

• Working with Flex Since 2003

• Has Lead a Lot of Projects

• Loves Creative Technology Because it Allows for the Building of Better User Experiences

• Adobe Product Advisory Panels

• Regular Conference Speaker

Rhazes Spell - Lead Interactive Developer, Roundarch

• PhD, Biomedical Engineering -- Specializes in UX and Data Visualization

• Using Flex since 2006 & Knows a Lot of Different Languages

• Specializes in Creative Technology Innovation and HCI

• Conference Speaker

3

Page 4: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Who Are You?

4

Flash Developer Learning Flex?

Seasoned ActionScript Guru?

Java / .NET / .PHP Developer?

Web Developer? (HTML, CSS, JavaScript)

Software Architect?

Project Manager?

Business Person

Project Manager?

Designer?

Page 5: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Why This Topic?

Chicago Flex User Group is New

Flex can be a bit overwhelming at first

Especially learning “the right way” to build an application

So many choices... So many opinions

It is a “Community” Topic & working together can help further define ways to approach things

There is no single “right way”, so opinions can help

5

Page 6: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Architecture

6

Page 7: Chicago Flex User Group Presentation - Adobe Flex Frameworks

What Architecture is Not

7

Software architecture is not low-level design

Individual Component Workings

Algorithms

Implementation

Software Architecture is not the data (model)

Software Architecture is not the architecture of the physical system

Page 8: Chicago Flex User Group Presentation - Adobe Flex Frameworks

What Architecture Is

8

Software architecture is "the structure of the components of a program/system, their interrelationships, and principles and guidelines governing their design and evolution over time."

Software Architecture is:

An overall view of the solution to a problem

The high-level design of modular components and how they interact

A foundation that one can build on to solve a problem (e.g., rules, policies, attributes, etc.)

An efficient method to meet a fixed set of well-defined attributes

Garlan and Perry, guest editorial to the IEEE Transactions on Software Engineering, April 1995

Dave Meeker & Rhazes Spell, Chicago Adobe Flex User’s Group, June 2008

Page 9: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Framework(s)

9

Page 10: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Framework - A system of rules, ideas or principles that is used to plan or decide something.

10

Page 11: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Framework - A framework is an abstract design of a set of related applications in a particular domain.

11

Page 12: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Framework - A logical structure for classifying and organizing complex information.

12

Page 13: Chicago Flex User Group Presentation - Adobe Flex Frameworks

The Adobe Flex Framework

13

Flex is a Framework for building .SWF files

“Movies” / “Files” that run in the Adobe Flash Player

ActionScript

MXML

Flex Compiler

Output >>> .SWF

Page 14: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Using Frameworks in RIA Development

14

Should allow you to deploy incremental changes to your applications and allow team members to work independently from one another because things are decoupled

Forces you and your team to implement code in a way that promotes consistent coding, fewer bugs, and more flexible applications

Allows anyone working on the team to easily test and debug the code, even code that they didn't write

Allows for easy re-use of code

Why Use a Framework?

Page 15: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Using Frameworks in RIA Development

15

Wrappers

Simplifies the interface to a technology/language

Reduces & eliminates repetitive tasks

Increases application flexibility through abstraction

Re-usable regardless of high level design considerations

Architecture

Methodologies

What should a framework include?

Page 16: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Using Frameworks in RIA Development

16

Wrappers

Architecture

Helps to manage a collection of discrete objects

Implements a set of specific design elements

Methodologies

What should a framework include?

Page 17: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Using Frameworks in RIA Development

17

Wrappers

Architecture

Methodologies

Enforce the adherence to a consistent design approach

Decouples the dependencies of objects

Typically Re-usable regardless application requirements

What should a framework include?

Page 18: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Frameworks: What is a Wrapper ?

A wrapper is way of repackaging a function or set of functions (related or not) to achieve one or more of the following goals:

* Simplification of use

* Consistency in interface

* Enhancement of core functionality

* Collecting discrete processes into a logical association (an object)

18

Page 19: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Frameworks: Architecture

Obviously, a framework needs to have a design/architecture.

A Framework’s architecture is separate from the collection of wrappers that it implements and from the enforcement of a specific implementation methodology.

An architecture implements associations between objects--inheritance, container, proxy, collection, etc.

If you don’t like how your framework is architected... you can ignore it or replace it. (Well, in the beginning anyway...)

Architectures can and are useful because they create a re-usable structure.

19

Page 20: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Frameworks: MethodologyMethod - a way of doing something

-ology - in a "scientific" manner - designed, consistent, repeatable, testable, proven

Methodology: A body of practices, procedures, and rules used by those who work in a discipline.

• While architectures deal with the associations between things, a methodology deals with the interaction between things.

• Most Methodologies are implemented to assist in the activity of:

• Communicating between objects

• Managing data persistence

• Responding to User Events

• Within those activities are architectures that associate interrelated objects.

20

Page 21: Chicago Flex User Group Presentation - Adobe Flex Frameworks

and... Design Patterns

21

Design patterns are both architectures and methodologies

Structural Patterns = Architecture

Creational Patterns / Behavioral Patterns = Methodologies

Because their usage enforces a particular method of interaction

When Implementing Behavioral Patterns, the Entire Application has to Adhere to that Implementation

Page 22: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Frameworks For Flex RIAs

22

Page 23: Chicago Flex User Group Presentation - Adobe Flex Frameworks

RIAs don’t do well in waterfalls

23

The Traditional “Waterfall” Project Approach has typically NOT been successful for RIA Projects

A Great User Experience can hardly be defined on paper up front and then developed months later by a different group

Teams typically shouldn’t be isolated or work in any sort of a vacuum

You can’t effectively communicate discrete User Experience elements (animation, depth, physics, etc) on paper alone.

Page 24: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Iterative & Agile = Happy Apps!

24

Agile Development - Choose an Approach that works best for you and your client and the type of project you are building

Agile Doesn’t mean Chaos

Iterative Releases

Client/User Acceptance Releases

Public “Perpetual” Beta Concept

Page 25: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Flex Application Frameworks

25

Page 26: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Things to Consider

26

Thanks to Ali Mills & Like Bays (Bunchball / Pattern Park) for all the Research & Hard Work & Following Info! (Silicon Valley Flex Users Group)

Using an Application Framework can make you more efficient than using Flex by itself

Some frameworks are more effective than others

Relying on a framework without knowing it well enough to complete your project successfully can make you very, very, unhappy!

Page 27: Chicago Flex User Group Presentation - Adobe Flex Frameworks

A Framework Should Be:

27

Approachable

Documentation

Adoption

Active Project Community

Code/Shared Knowledge

Scalable

Testable Code

Encourages clear encapsulation

Accommodates Change

Supports Parallel Development

Allows for Modular Applications

Flexible

Open Source

Context Independent

Page 28: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Evaluated Frameworks

28

Slide

ARP

Servebox

Guasax

Flest

MVCS

Model-Gleu:Flex

Cairngorm

PureMVC

No Framework

Page 29: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Evaluated Flex Frameworks

29

Slide

ARP

Servebox

Guasax

Flest

MVCS

Model-Gleu:Flex

Cairngorm

PureMVC

No Framework

Page 30: Chicago Flex User Group Presentation - Adobe Flex Frameworks

PureMVC Vs Cairngorm

PureMVC

Created By Cliff Hall

Harder to Learn

Seemingly More Flexible

Singletons are Hidden

Cairngorm

Named after a Mountain

Created by Steven Webster

Officially used by Adobe Consulting

Highly Singleton-Based

30

Page 31: Chicago Flex User Group Presentation - Adobe Flex Frameworks

PureMVC Vs CairngormPureMVC

Model

View

Controller

Command

Facade

Proxy

Mediator

Observer

Notification

Cairngorm

Model

View

Controller

Command

CairngormEvent

Delegate

Service

ValueObjects

31

Page 32: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Final Thoughts...

You don’t NEED to use a Framework

Cairngorm is probably easier to learn than PureMVC (But neither are “easy”)

Cairngorm is “The Standard” in today’s enterprise market

If you are using Cairngorm take a look at Cairngen to save LOTS of typing

PureMVC is arguably more flexible and easier to develop on once you know it

PureMVC is implemented in multiple languages (Perl, Java, Ruby, Python...)

PureMVC seems more efficient overall

Both PureMVC & Cairngorm require a bit of study

32

Page 33: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Building a Bridge Between Adobe AIR and Java

33

h t t p : / / m e r a p i p r o j e c t . n e t

Page 34: Chicago Flex User Group Presentation - Adobe Flex Frameworks

What is Merapi?

34

Merapi is a bridge between applications written in Java and those running in and created for Adobe AIR™ (Adobe Integrated Runtime™).

Merapi has been designed to run on a user's machine, along with an Adobe AIR™application and provide a direct path between the Adobe AIR™ framework and Java, exposing the power and overall capabilities of the user's operating system, including 3rd party hardware devices.

Page 35: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Why Did We Create Merapi?

35

For Adobe AIR

For Java

To have access to the features of the Java language and the myriad of Java libraries

To have access to the powerful user interface framework available in Adobe Flex / AIR applications

Page 36: Chicago Flex User Group Presentation - Adobe Flex Frameworks

How Did We Create Merapi?

36

Flex <-> Java

Communication on a local socket using Adobe open source libraries for AMF serialization

Page 37: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Ways to Use Merapi

37

Control Lego MindStorm Robots from an Adobe AIR game.

Connect an AIR™ application to a Wii remote

Perform TWAIN Capturing of Video or Images from a camera or scanner

Use AIR™ to talk to a phone plugged in via USB

Connect an AIR application to system hardware and OS properties

Connect an AIR application UI to a GPS device

Sending MIDI signals to instruments over a network using a Flex application GUI running in the AIR framework

Create a new UI for a command-line Java application or Java Interface

Page 38: Chicago Flex User Group Presentation - Adobe Flex Frameworks

Open Discussion / Q&A

38