Thursday, December 8, 2011

Grade Outline - Final Project

Due: Wed. 12/14 at 4:20.
Note: There is no "late" for this project.

Please Package and Place in my Dropbox a Folder with your name and the following 3 projects:
Each Step is worth 11 points:
Example 1: Buttons
1. Animate the gear.swf file within the button.
2. Have that button link off to another "State"
3. Add a Transition to the next States and back to the original State.

Example 2: Flower Gallery
1. Finish the Flower Gallery - 7 button/images update the 7 images in the main ImageHolder
2. Add Transitions to the buttons
3. Add Transitions between the States

Example 3: San Franciso Gallery
1. Create and Finish the PhotoGallery
2. Add your own images
3. Add Transitions to the buttons/images
4. Add Transitions between the States

Wednesday, December 7, 2011

Schedule for the Rest of the Semester

M: 12/5: Present Demos / Intro Flash Catalyst / Next Project Assnmt.
W: 12/7: Present Demos / Flash Catalyst Demo / Work Day

M: 12/12:
Flash Catalyst Demo / Work Day
W: 12/14: Flash Catalyst Presentation / Last Day

Friday, December 2, 2011

Flash Catalyst File Examples

Summit Website > Video

- Other Examples > Website

Design Army Website

Buttons Website

Publishing Tree Website

Flash Catalyst

Adobe Video Samples: Flash Catalyst

Import .jpg Files. Label Folder Images, Add to stage. Make new folder, Thumbnails, add Thumbs to stage. Size as needed.

Select all images in LAYERS PANEL, make component in HUD, name it.

In HUD click State1, Duplicate and Remove Visibility in each State in the Layers when Selected

----------------------------


Gallery Steps

Video Files

Tuesday, November 29, 2011

Monday, November 28, 2011

var mainLoader:Loader = new Loader();
//create new URLRequest and fill it
var defaultSWF:URLRequest = new URLRequest("bear.swf");

//load the loader
mainLoader.load(defaultSWF);
//position the loader on the page
mainLoader.y = 0;
mainLoader.x = 0;
//add the loader to the page
addChild(mainLoader);

//*******************************************************

function step(event:MouseEvent):void {

removeChild(mainLoader);
SoundMixer.stopAll();

}

//event listeners which run function btnClick for CLICK event of each button

stepbystep_btn.addEventListener(MouseEvent.CLICK, step);

Presentation Schedule

Wednesday. 11/30:
1. Todd Bowie
2. Neal Siddell
3. Aaron Schute
4. Joshua
5. Max
6. Chelsey
7. Joshua D.

Monday 12/5:
8. Rachel
9. Casey
10. Tricia
11. Tami
12. Dale
13. Brett
14. Dan

Friday, November 4, 2011

Code Option for the Welcome .fla

This will remove the Intro.fla AND the Title.fla after you click the Play/Stop, Direction buttons. The previous version removed the Intro, but kept the Title on the Stage.

---------------------

var titleLoader:Loader = new Loader();
//create new URLRequest and fill it
var titleSWF:URLRequest = new URLRequest("Title.swf");

//load the loader
titleLoader.load(titleSWF);
//position the loader on the page
titleLoader.y = 0;
titleLoader.x = 0;
//add the loader to the page
addChild(titleLoader);

//*******************************************************

var mainLoader:Loader = new Loader();
//create new URLRequest and fill it
var defaultSWF:URLRequest = new URLRequest("Intro.swf");

//load the loader
mainLoader.load(defaultSWF);
//position the loader on the page
mainLoader.y = 0;
mainLoader.x = 0;
//add the loader to the page
addChild(mainLoader);

//*******************************************************

function step(event:MouseEvent):void {

removeChild(mainLoader);
var direct_url:URLRequest = new URLRequest("Directions.swf");
mainLoader.load(direct_url);
addChild(mainLoader);
removeChild(titleLoader);

}

function ani(event:MouseEvent):void {

removeChild(mainLoader);
var ani_url:URLRequest = new URLRequest("start_stop.swf");
mainLoader.load(ani_url);
mainLoader.y = 150;
mainLoader.x = 150;
addChild(mainLoader);
removeChild(titleLoader);
}

//event listeners which run function btnClick for CLICK event of each button

step_btn.addEventListener(MouseEvent.CLICK, step);
aniPlay_btn.addEventListener(MouseEvent.CLICK, ani);

-----------------

Monday, October 24, 2011

Don't like my preloader?

Copy and find and make your own damn preloader....

http://preloaderz.com/design/free-preloader-animations/

the intertubes is crawling with free samples. knock yourself out.

WARNING: make sure its AS3 though. don't be adding some old AS2 version on your file...

don't know what that warning means? You need to know... look it up.

Tuesday, October 18, 2011

Recipe for a Pre-loader

For reference check "preloader_complete_carla" In the Classes folder

In the Library you will need to make or add:

- 1 Animated MovieClip Symbol.
(Some little animation relevant to your subject matter to entertain the viewer while the clip loads)

- 1 "bar". Draw a graphic bar. Make it pretty. Make it a MovieClip.


---------
With these items in the Library follow these steps to build your Preloader:

1. Make a new Symbol MovieClip: Click the New Symbol icon at the bottom of the Library panel

2. Bottom left of the box Click the Down Arrow next to the word "Advanced" to see the whole dialog box.

3. At the top of the box give your MovieClip the following name: Preloader_yourname
(use your name for yourname. my example is Preloader_carla)

4. In the box "Actionscript Linkage" check the box "Export for actionscript"
- under that Class should read "Preloader_name"
- and base class should read "flash.display.MovieClip"
you will need this so actionscript can identify your movieclips.

5. click "ok" and "ok" for the "warning"

6. Within your new Preloader_name MovieClip make 2 layers.
label them:
- animation
- bar/text

7. Add your animation movieclip to Preloader_name 'sMovieClip Stage on the animation layer

8. Add your bar movieclip to Preloader_name 's MovieClip Stage on the bar/text layer

9. In the Tool bar. Click the "T" text tool. Draw a Text Box onto the Stage on the bar/text layer

10. Select the Text box on the Stage. In the Properties panel name your Instance name of the text box 'loading_txt_yourname'

11. In the Properties panel under the Character dropdown click the button "Embed" to embed the text and prevent font errors. Click "OK"

12. Select the bar movieclip on the Stage. In the Properties panel name your Instance name of the bar movieclip 'barMC_yourname'

Your Preloader MovieClip is now together.

13. On the main timeline. In the actions layer first frame add the following code and change _carla to _yourname

-------------------------

var myRequest:URLRequest = new URLRequest("welcome.swf");
var myLoader:Loader = new Loader();

myLoader.load(myRequest);

myLoader.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
myLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,showContent);

var myPreloader:Preloader_carla = new Preloader_carla();

function showPreloader(event:Event):void {
addChild(myPreloader);
myPreloader.x = stage.stageWidth/2;
myPreloader.y = stage.stageHeight/2;
}

function showProgress(event:ProgressEvent):void {
var percentLoaded:Number = event.bytesLoaded/event.bytesTotal;
myPreloader.loading_txt_carla.text = "Loading - " + Math.round(percentLoaded * 100) + "%";
myPreloader.barMC_carla.width = 198 * percentLoaded;
}

function showContent(event:Event):void {
removeChild(myPreloader);
addChild(myLoader);
}

---------------------

14. You know, btw, you should be "reading" this code. So that you have some clue as to what is going on here in ActionScript. Get into the habit of reading it over.

15. I mean really, read it.

16. When the file "welcome.swf" is in the same folder as "preloader.fla" the preloader will load the welcome.swf file.

17. Test preloader. After you test it, in the top menu select "View", Download Settings, 14.4,

Then "View", Simulate Download... wait for it... There it is!!!... no? Check the steps above...

Thursday, October 13, 2011

Making the Stop/Start Movie

1. Make a new .fla file. Called 'startstop.fla' (or whatever)

2. Convert your main simulation timeline animation into a MovieClip so that you can import it to your new file.

-- Follow These Steps Link Here --

3. Open your new .fla

4. Make 3 layers: 1. actions, 2. buttons, 3. animation

5. Make a play and a stop button symbol. Animate the OVER state.

6. Add your play and stop buttons to the stage on the buttons layer.

7. Select your buttons on the stage (one at a time). in PROPERTIES, name the Instance Name: stop_btn, or play_btn

8. Place your animation MovieClip onto the stage and into the animation layer. Select the MovieClip on the stage. Name the Instance Name in the PROPERTIES panel name_mc (or whatever)

9. In the actions layer add the following actionscript:

----------------------

var movieclip:MovieClip;

function stopMovieClip(mc:MovieClip):void{
mc.stop();
for (var i:int = 0; i < mc.numChildren; i++)
var mcChild = mc.getChildAt(i);
if (mcChild is MovieClip) stopMovieClip(mcChild);

}

function playMovieClip(mcPlaying:MovieClip):void{
mcPlaying.play();
for (var j:int = 0; j < mcPlaying.numChildren; j++)
var mcPlay = mcPlaying.getChildAt(j);
if (mcPlay is MovieClip) playMovieClip(mcPlay);
}


stop_btn.addEventListener(MouseEvent.CLICK, stopAll);

function stopAll(event:MouseEvent):void
{
stopMovieClip(ball_mc);

}


play_btn.addEventListener(MouseEvent.CLICK, PlayMC);

function PlayMC(event:MouseEvent):void
{
playMovieClip(ball_mc);
}


----------------------

10. In the actionscript change my code/movie names [ written above in bold] with your movie's PROPERTY Instance Names

11. take notes in class.

Wednesday, October 12, 2011

XML Tutorial

FLASH! FLAAAAASH!

Class Tutorial: Flash with AS3 for Class Oct. 26th

Nicer Tutorial but with OLD code: Flash and XML

Final Date for Project: Nov. 2nd.

Wednesday, October 5, 2011

Animations Due for the Simulation

In the C.Galler/Classes/MMP/Simulation Project/Hat_simulation/

See these .fla examples as references.

1. "Pre-Loader" (preloader_complete.fla)

2. "Title" (title.fla)

3. The "Simulation" (ani_all.fla) / movie clip: ani_all

4. The animation for the "over" state on the buttons

---------------------

- You will also need a file for the Directions & Steps (with animations for the step buttons) (directions.fla)

- A Welcome Screen (welcome.fla)

---------------------

How this will all come together: Movie

  1. Pre-loader.fla opens

  2. hat.fla opens

    1. title.fla then

    2. welcome.fla then

    3. directions.fla THEN

    4. ani_all on the mouseclick event

Monday, October 3, 2011

Tuesday, September 27, 2011

Friday, September 16, 2011

Adding Sound

Complete Notes & Compression Settings [PDF]

1. Import the sound into the library.

2. Make a new Layer

3. With the new sound layer selected, drag the sound from the Library panel onto the Stage. The sound is added to the current layer.
Each sound be placed on a separate layer. Each layer acts as a separate sound channel.

4. In the Timeline, select the first frame that contains the sound file.

5. Select Window > Properties, and click the arrow in the lower-right corner to expand the Property inspector.

6. In the Property inspector, select the sound file from the Sound pop-up menu.

7. Select an effect option from the Effects pop-up menu:

None
Applies no effects to the sound file. Select this option to remove previously applied effects.

Left Channel/Right Channel
Plays sound in the left or right channel only.

Fade Left To Right/Fade Right To Left
Shifts the sound from one channel to the other.

Fade In
Gradually increases the volume of a sound over its duration.

Fade Out
Gradually decreases the volume of a sound over its duration.

Custom
Lets you create custom in and out points of sound using the Edit Envelope.

Select a synchronization option from the Sync pop-up menu:
Note: If you are placing the sound on a frame other than frame 1 in the main Timeline, select the Stop option.

Event
Synchronizes the sound to the occurrence of an event. An event sound, such as a sound that plays when a user clicks a button, plays when its starting keyframe first appears and plays in its entirety, independently of the Timeline, even if the SWF file stops playing. Event sounds are mixed when you play your published SWF file. If an event sound is playing and the sound is instantiated again (for example, by the user clicking the button again), the first instance of the sound continues to play and another instance begins to play simultaneously.

Start
The same as Event, except that if the sound is already playing, no new instance of the sound plays.

Stop
Silences the specified sound.

Stream
Synchronizes the sound for playing on a website. Flash Pro forces animation to keep pace with stream sounds. If Flash Pro can’t draw animation frames quickly enough, it skips frames. Unlike event sounds, stream sounds stop if the SWF file stops playing. Also, a stream sound can never play longer than the length of the frames it occupies. Stream sounds are mixed when you publish your SWF file.

An example of a stream sound is the voice of a character in an animation that plays in multiple frames.
Note: If you use an mp3 sound as a stream sound, you must recompress the sound for export. You can export the sound as an mp3 file, with the same compression settings that it had on import.

Enter a value for Repeat to specify the number of times the sound should loop, or select Loop to repeat the sound continuously.

For continuous play, enter a number large enough to play the sound for an extended duration. For example, to loop a 15-second sound for 15 minutes, enter 60. Looping stream sounds is not recommended. If a stream sound is set to loop, frames are added to the file and the file size is increased by the number of times the sound is looped.
To test the sound, drag the playhead over the frames containing the sound or use commands in the Controller or the Control menu.

Tuesday, September 13, 2011

Apply Motion on a path

Motion Tween
Apply a custom stroke as a motion path

You can apply a stroke from a separate layer or a separate timeline as the motion path for a tween.

Select a stroke on a layer separate from the tween layer and copy it to the clipboard.

The stroke must not be closed. Only uninterrupted strokes can be used.
Select a tween span in Timeline.
With the tween span still selected, paste the stroke.

Flash applies the stroke as the new motion path for the selected tween span. The target instance of the tween now moves along the new stroke.
To reverse the start and end points of the tween, right-click (Windows) or Ctrl-click (Macintosh) the tween span and select Motion Path > Reverse Path in the tween span context menu.

Class Tween on a Path Video WATCH

Monday, September 12, 2011

Thursday, September 8, 2011

Job Board

The link here is for the Coroflot job board.

Take a look at what skills you need to make buckets and buckets of money. You know make it rain or something like that...

Monday, August 29, 2011

Favorite Flash Sites

1. Adidas. Confusing layout. Nice motion.

2. Get the Glass Campaign. Very involved board game. Too cute.

3. Flash Games as "presentations". Game Example - People's Pie, More Games

Sunday, August 28, 2011

Flash Tutorials and Help

1. O'Reilly: Books Online
2. Login page to Madison Public Library e-books: Here
3. Colin Moock: Website, Blog, and nice lecture about Flash. and The Lost Weekend From this source page.

Please add more in the comments section.

Welcome to Multi-Media Presentation

Please log-in and join/follow to post examples and in-class course work