FLASH

FLASH

Presenters:Tin HoangAndrew McdonaldMehran Panahi AkhavanMatthew Tang

Agenda

• Flash History• Animation• Action Script• Accessibility• Criticism• Questions

Flash History

Flash History | Animation | Action Script | Accessibility | Criticism | Questions

• Jonathan Gay – creator of FutureSplash• Macromedia bought and renamed to Flash 1.0• 2005 Adobe bought Macromedia


Basic animation concepts:• frames

– individual frames– Keyframes– blank frames

• Timeline• Stage

Animation


Types of animation:• Motion http://www.kirupa

.com/developer/mx2004/motion_tween.htm • Shape

http://www.webwasp.co.uk/tutorials/001/index.php

• Guided Motionhttp://www.tutorialized.com/tutorial/Guided-motion-tween-animation-create-an-air-chase/13548

Animation

Introduction to Action Script


• Actionscript in itself is a very flexible language.• There are very few constraints to the type of code

you can write and execute.• This makes Actionscript a very moldable yet

volitile and unstable langauge.• Semicolons are not needed on the end of code

lines but should be used for code clarity.

Arrays


• Associative arrays are used in Actionscript.• This means that arrrays can be referenced with

keys which are numeric, strings, or• concatenated variables and string.

• <actionscript> myArray[2] = 56;

myArray["id"] = 78; myArray["id" + i]

</actionscript>

Arrays Continued.


• This makes using a for loop to traverse through an array more difficult than usual.

• However, there are special conventions in Actionscript which allows a for loop to access an

• entire array.

• <actionscript>for (var i in frames) { ...}</actionscript>

Casting


• There is no true casting in Actionscript; however, "new" can be used.

• This is important for numbers made from a string arguement.

• <actionscript> var i:String = "5"; var j:Number = new Number(i); </actionscript>

Delegate


• When eventhandlers are used, the reference to 'this' has finicky behaviour. It may not necessarily refer to the object you intend to.

• The delegate function ensures the proper reference to objects within a movie clip.

Delegate


• If delegate is not used and you import a nested movie clip, every reference to 'this' will refer to the parent clip.

• When using delegate, this will ensure that all 'this' references talk about the parent movie clip or the nested movie clip, depending on where the 'this' is located.

Delegate


• In most cases, the delegate is not necessary but is good practice to include it.

• Delegate has only one function, create. Include the following line of code in either your constructor or your initializer.

• <actionscript> onLoad = Delegate.create(this, onLoadScreen);</actionscript>

• This will let the page load, and continues the code execution in onLoadScreen.

Delegate


• For a more in-depth explaination refer to the Actionscript.org tutorial.

• http://actionscript.org/tutorials/beginner/the_delegate_class/index.shtml

Dynamic Components


• Classloader is used to create a new instance of a class that extends MovieClip.

• The first parameter is the owner of the newly created object.• The second is the class of the object, which can accept a

string or the class itself.• The third is the unique instance ID.• The forth is the depth at which the new instance is

initialized.• The last one is the list of modified parameters for the new

object to take on.

Dynamic Components


• <actionscript> // This is a sample of how to dynamically create a button. ClassLoader.createClassInstance( this, componentClass, "buttonName", getNextHighestDepth(), { fontSize:21, width:350, height:40, _x:209, _y:225 }); </actionscript>

• attachMovie and createEmptyMovieClip can also be used depending on the purpose.

Event Listeners


• <actionscript> private function thisFunction():Void () { this["buttonName"].addEventListener("click", this,

"buttonEvent"); }

private function buttonEvent():Void { ... }</actionscript>

Functions


• Most functions are declared like in Java or C++. <actionscript> [scope] functionName([parameters]) { ... }

private myFunction():Void { ... }</actionscript>

Functions


• A unique feature is that, variable properties can be bound to functions. This can be done in two ways:– the variable can be bound to an already existing functionor– it can be bound to a dynamically created function.

<actionscript> onLoad = myFunction; // or onLoad = function() { ... }</actionscript>

Global Variables


• There are three commonly used globally accessed predefined variables. They are the following:– *_root - The highest object in the ownership heirarchy

that the current object is in.– *_global - The global object is an object that can be

referenced by any class anywhere in the code.– *_parent - The object that owns the current object.

• All MovieClips include a property called onLoad that is bound to a function. This property is called whenever the MovieClip is loaded.

Variable Declarations


• Variables can be used without a declaration. When variables are used without a declaration, they can be of any type. This allows for flexibility in code, however it may also result in complex bugs. It is always a good idea to declare your variables before using them.

Variable Properties


• Variables can contain properties, they can be created and changed at any time.

• <actionscript> aPerson = "John"; aPerson.age = 38;

this["backButton"].text = "Go Back";</actionscript>

Accessibility – What is it?


● To make pages on the Internet accessible to all users, especially those with disabilities.

Sample of Accessibility


• Some Sample of Accessibility

working in a loud environment

not be able to see

May not be able to use keyboard or mouse

Why Accessibility is important


• Legislation, standards and regulation:

• The size of disabled population:– 41 million accessible user are using the web.

(world bank 2002)

How Accessibility works


Screen magnifiers

<html>

<head>

</head>

<body>Hello

</body>

</html>

Assistive Browser

Voice Recognition

Screen Readers

Basic Solution for accessibility with Flash


Using accessibility panel for following objects:• Text• Input text fields• Buttons (including button movie clips)• Entire movies

Sample Accessibility Pages


● Scalability Examplehttp://www.webaim.org/techniques/flash/media/scaleable.html

● Keyboard Examplehttp://www.webaim.org/techniques/flash/media/intractvmap.html

● Microsoft Web sitehttp://www.microsoft.com/about/brandcampaigns/innovation/yourpotential/main.html

Flash Criticisms


There are two main types of criticisms surrounding Flash.

- Browser Issues.- Usability Issues.- Other issues.

Browser Issues


Flash causes users browser to act in unexpected ways.

- Back button.

- Reload button.

- Stop button.

- Print command.

- Search command.

Usability Issues


Usability issues consist of web fundimentals that are not or not easily supported by Flash.

- No link colors to see where you have been.

- No browser control over text.

- Cannot book mark specific content.

- Search engines cannot easily index flash pages.

- Users cannot line specific parts of flash sites.

Other Issues


Some other issues that plague flash.

- HTML is easy and most users can create pages this way. Flash is difficult to learn and use.

- Although flash may be common. Many browsers use have older versions and cannot display the

- newer Flash.

Questions


QUESTIONS?

Documents

FLASH