Accessibility
 
Home / Developer Center / Macromedia Flash Developer Center /

Macromedia Flash Article

Macromedia Flash Super Samurai Chapter 2: 3D and Flash
Written by leading members of the Macromedia Flash community, Macromedia Flash: Super Samurai focuses on advanced techniques for developing Macromedia Flash content. Chapters cover such topics as JavaScript and Flash, optimizing 3D, integrating databases through ActionScripting, XML, and much more. This chapter's authors, Michael Brandon Williams and Torben Nielsen, show you the basics of creating 3D effects using ActionScript and include all the equations needed to create them. We've sampled their chapter here for you to peruse, but we encourage you to download the entire chapter for full details.
 

How well does Macromedia Flash do 3D?
"More and more Flash developers are catching on to the power of 3D. Adding 3D effects to Flash movies can help spice up a navigation system, make impressive eye candy, or simply entertain viewers. In fact, the use of 3D in Flash has increased over the last few years: The trend began at front-running Web sites such as www.yugop.com and www.mano1.com, and has just kept growing.

"But Flash is a 2D software program-it doesn't support 3D models. How, then, can you create 3D animation in Flash? Easy: You fake it.

"There are two ways to create the illusion of 3D shape and motion: ActionScript 3D, in which you code the entire project, and Rendered 3D, in which you use third-party rendering software, Flash, and some ActionScript. This chapter will discuss these two very different methods."

Understanding the mathematics of perspective
"Perspective helps you differentiate between 3D and 2D. Perspective is that omnipresent bend of the world that positions things in relation to their distance from you. If you stand in the middle of a road, looking down it as far as possible, you'll see that the road's edges begin to come together. Depending on how far you can see, the edges will appear to move infinitely closer to each other until they converge. Perspective also affects how movement is perceived. For example, even if objects in the foreground and back-ground are moving at the same speed, those in the foreground will appear to move more quickly."

Changing ordered triplets into ordered pairs
"The perspective problem boils down to something simple. You have an ordered triplet of a point, (x, y, z), and you want to find where that point would be placed on your screen if it didn't have a z-position. Because your computer screen doesn't have a z-axis, you must find a way to change the ordered triplet into an ordered pair while taking into consideration the point's z-position. The easy way is to merely drop the z value, but if you do that, the road's edges will never converge. Instead, they will remain parallel as the road goes off into the distance."

The authors solve this problem using some simple geometry. They derive a "crucial equation for perspective" and show a script that puts this equation into practice.

"The following script is placed in the clip events of a movie clip. (The movie clip can be anything that you want to duplicate many times and place in space randomly.) The script will give the movie clip a random ordered triplet between -100 and 100, and then calculate the point's position as it appears on screen."

 
OnClipEvent (load) {
  // random ordered triplet 
  x = Math.random () * 200 - 100; 
  y = Math.random () * 200 - 100; 
  z = Math.random () * 200 - 100; 
  // used for perspective - distance from the viewer to the screen 
  D = 400; 
  // calculate the perspective ratio 
  perspective_ratio = D / (D + z); 
  // calculate position of point on computer screen 
  perspective_x = x * perspective_ratio; 
  perspective_y = y * perspective_ratio; 
}
 

Don't render what you don't see
"Our previous files adhered to a popular 3D optimization philosophy: If you can't see it, don't render it. When a point went behind the viewer, for instance, we didn't render it. This time, we'll remove a point if it goes off the viewing area. An object is off the viewing area if its x- or y-position is greater than the Stage's width or height, and if its x- or y-position is less than 0. A few conditionals can test this problem and set the point's _visible property to either false or true, accordingly."

 
OnClipEvent (load) { 
  // width and height of the stage 
  stage_width = 550; 
  stage_height = 400; 
} 
onClipEvent (enterFrame) { 
  // check if clip has gone off the stage 
  if ((this._x > stage_width) || (this._x < 0)) { 
	// clip is off the left or right side of the stage 
	this._visible = false; 
  } else if ((this._y > stage_height) || (this._y < 0)) { 
	// clip is off the top or bottom of the stage 
	this._visible = false; 
  } else { 
	// clip is on the stage 
	this._visible = true; 
  } 
}
 

"Remember that you must do all the translations, rotations, and perspective calculations before you can check if the point is visible. Removing hidden objects may not save you some calculations, but it will minimize the number of objects that are simultaneously displayed on Flash's Stage."


You can download the entire version of Chapter 2 below:

Chapter 2: Flash and 3D
Download the sample file supersamurai_ch2.pdf (1.76 MB)
 

About the authors
Michael Brandon Williams is a senior at Spring Woods High School in Houston, Texas, with many years of mathematics and computer science study in his curriculum vitae. His mathematics focus has been single and multivariable calculus, real analysis, linear algebra, ordinary differential equations, elementary combinatorics, and number theory. His computer science experience is based on programming design, object-oriented programming, and problem solving. His goal is to pursue a Ph.D. in Mathematics. In his spare time, he helps run the math forum at Were-Here (www.were-here.com) under the name of ahab, and works for Eyeland Studios (www.eyeland.com) as a games programmer.

Danish freelance designer Torben Nielsen runs his own design company, SD Flash Studios, which specializes in Flash solutions for the Internet and other medias. He is based in Rome. Throughout his childhood, Lego, Walt Disney cartoons, and his Comodore 64 computer sparked his interest in drawing and creativity. His popular comic strip for his high school newspaper reflected school life in a sarcastic way. Torben has never had formal design education, apart from a two-year art class in college. When he discovered Flash 3 in 1998, that old Lego feeling came back to him, and it was love at first sight. Since then he has specialized in Flash; today it's the base of all of his projects.