Information on how to learn Flash is prevalent, but it can be frustrating to understand how to make an entire working web site using this unique technology. Here’s a course where I cut through the clutter and offer practical tools for creating a dynamic web site, even for first-time developers. In Creating a First Web Site with Flash CS4 Professional, veteran Flash instructor Paul Trani simplifies the process of integrating animation, video, audio, and user interactivity to create a site that is dynamic and appealing. The goal of this hands-on workshop is to teach web site-building skills for today’s demanding interactive industry. Exercise files accompany the course.

Topics include:

• Manipulating images for the best results
• Integrating assets from other Adobe products
• Creating buttons with ActionScript
• Embedding links to external web sites
• Exploring text layouts
• Customizing interactive contact forms

Check it out

If you’ve seen the course please comment and let me know what you think!

Download Source Files

Creation
There are a couple different ways to create multiple movie clips in AS 3.0 but this is the way I like best. Basically create an array and attach (addChild) the Rain library item to the stage. Place it at a random position within the stage width/height:

var rainArray:Array = new Array();


for (var i:uint=0; i<100; i++) {


var raindrop:MovieClip = new Rain();
raindrop.scaleX = Math.random();
raindrop.scaleY = raindrop.scaleX;
raindrop.alpha = Math.random();
raindrop.x = Math.round(Math.random() * this.stage.stageWidth);
raindrop.y = Math.round(Math.random() * this.stage.stageHeight);
addChild(raindrop);
rainArray.push(raindrop);

}

Motion
Then, to make each move, loop through the length of hte array on ENTER_FRAME and move it’s y position 20 pixels down and its x position 5 pixels to the left (so it goes at a slant). Then, when it reaches the bottom, place the same raindrop back at the top in a random location:

addEventListener(Event.ENTER_FRAME, onEnterFrame);


function onEnterFrame(event:Event):void {


for (var i:uint=0; i rainArray[i].y += 20;
rainArray[i].x -= 5;
if (rainArray[i].y >this.stage.stageHeight){
rainArray[i].y = 0;
rainArray[i].x = Math.round(Math.random() * this.stage.stageWidth);
}
}


}

Here is the recording of an eSeminar I did last week for Adobe where you will get overview of Flash Video and how to easily get your videos online. Working with programs your familiar with as well as Flash, you’ll learn tips and tricks to deliver a customized, impactful, and even interactive online Flash Video experience.

Tuesday, July 17th, 2007 11:00 A.M. PDTJoin me online where I will show you the fast, fluid workflow of Adobe Flash CS3 Professional software, featuring a streamlined user interface, advanced video tools, and impressive integration with related software. This session is similar to the Flash CS3 Crash Course I did about a month ago but is geared more towards designers familiar with the software. And remember, it’s free!  Just register online.

(Move your mouse over the image above if you’re feeling violent).

Download Source Files

In AS 3.0, to draw a line that continually changes, add the following code in an ENTER_FRAME:

//remove graphic to remove previously drawn line each time
container.graphics.clear();
//define line width in pixels
container.graphics.lineStyle(15);
//move the drawing pen. Mace X and Y are dynamic positions
container.graphics.moveTo(mace.x, mace.y);
//draw lines from the start (above) to the mouse position
container.graphics.lineTo(mouseX, mouseY);

In this session I’ve covered everything new in Flash CS3 and how it will make your life better in many ways. Production shortcuts and new features allowing for more creativity.

View the demo project

The onDemand (recording) session

(Place your mouse over the image above to get the feeling like someone is watching you).

Download Source Files

In this example, every 3 seconds about 15 eyes will randomly animate around your current cursor position. This is done using the tween class with a random variance. But what I want to talk about is how to get the eyeball to point to the cursor. Here’s the code that does that:  |

var dx:Number = mouseX - eye.x;
var dy:Number = mouseY - eye.y;
var radians:Number = Math.atan2(dy, dx);
eye.rotation = radians * 180 / Math.PI;
eye.rotation = radians * 180 / Math.PI;

You can get the location of the eye with the x and y properties. Subtracting these, you get the length of the two triangle legs (dx and dy). Now, you simply need to use Math.atan2(dy,dx) to find the angle.
atan2 computes and returns the angle of the point y/x in radians, when measured counterclockwise from a circle’s x axis (where 0,0 represents the center of the circle). The return value is between positive pi and negative pi (pi = 180 degrees). Then convert it to degrees and set the eye’s rotation property to the result.

Tuesday, October 16th, 2007 9:00 AM PDT
So you’ve created Flash graphics but are unsure how to set up an entire site in Flash? In this session I will show you how to build a site in Flash using different methods, and the benefit of each. You’ll even be able to walk away with sample files to help get your site online in no time!

A very exciting new announcement from Adobe in the last couple weeks brought industry standard HD quality video to the Flash Player. Paired with the power and ubiquity of the Flash Player the new support for MPEG4 H.264 content will help revolutionize video on the web yet again. The new update also includes support for hardware acceleration and multi-threading support for enhanced video playback performance with full screen high resolution, smooth performance. The next generation of Flash video is here! Read more.