Flashandmath.com Site Search

Flash CS4 Tutorials

Flash and Math brings you a series of Flash CS4 tutorials and effects, for beginners as well as for advanced developers.

• NEW! AS3 Flash: Stanford Bunny and New Collection of 3D Particle Surfaces  We’ve been having a lot of fun here at flashandmath with surfaces made of particles. So we present the Stanford Bunny and other new beautiful surfaces with modification of earlier effects, a significant optimization of the code, and a simple z-sorting method. The optimized code allows for revolving in 3D over 200,000 particles.
   
• NEW! Color Fountain - Interactive Particle Effect in AS3 Flash  Interesting interactive particle effect. Pixel particles move based on their position but also based on their color and the colors of neighboring pixels via attract/repel action. The motion creates a pretty 'color fountain'.
   
• NEW! 100,000 Glowing 3D Particles Run Smoothly in Flash Player 10.1  More examples of our popular 'particles made of light'. New surfaces, more particles, new effects, and a custom performance monitor. We discovered great performance improvement in FP 10.1 v. FP 10. Awesome!
   
• NEW! 'Parametric Flowers' - Four Great Animations in AS3 Flash  Watch flower-like, mathematically generated patterns continuously bloom and fade. Four different themes: Lush, Wilting, Amber and Frosty, each with different coloring and fading transforms. Really pretty!
   
• AS3 Flash CS4: Create and Save Beautiful Images of Math Curves  In this effect, we use families of planar curves to create and save interesting images. We show how to draw a DisplayObject to a BitmapData via BitmapData.draw and how to save an image from SWF via FileReference.save method. The latter method is new to Flash Player 10.
   
• 3D Particles Made of Light - AS3 Dynamic Flash Effect  Thousands of particles which appear to be made of light form beautiful revolving surfaces in 3D space. We use an additive luminescent effect which creates brighter spots where particles are more concentrated. We present four examples with variations in color and filter effects.
   
• Astronaut - 3D Particle Effect in AS3 Flash CS4  We present a new 3D particle effect: Astronaut. We animate 15,000 particles and the principles that govern motion of particles are different from those in Kepler's Supernova and our other popular examples.
   
• 3D Revolving Rings: An Interesting Photo Gallery in AS3 Flash CS4  We present a 3D photo gallery in which rings of two-sided thumbnails revolve in 3D. The gallery is easily customizable via an XML file. We included several custom AS3 classes that make bulding XML-driven 3D galleries easy.
   
• 3D Display Cube with a Versatile Custom AS3 Class in Flash CS4  Each instance of the DisplayCube class accepts any DisplayObjects as sides, it revolves in 3D, its sides respond to clicks. Moreover, the cube drops shadow in 3D! We show an application with three Bitmap cube menus that drop dynamic shadows on the floor beneath as they rotate. We use simple FP10 3D methods.
   
• Kepler's Supernova - 3D Particle Effect in AS3 Flash CS4  A new 3D particle effect: the spectacular Kepler's Supernova. We animate 17,000 pixel particles put into motion based on the difference between their red and blue color components. Thus, every time you change the underlying bitmap image, you will obtain a different effect.
   
• 'Catch Chameleon Fish' Game in AS3 Flash CS4  Check out this cool little game. You can use it as a tutorial about blend modes and sound in AS3, or you can simply enjoy catching chameleon fish.
   
• Perlin Particle Storm - A Turbulent Display of Thousands of Particles in AS3 Flash  Enjoy a spectacular particle storm! In this experiment we use a bitmap filled with Perlin noise to create an acceleration field. The field controls the motion of thousands of particles creating a turbulent, dramatic effect. We use filters and color transforms to obtain the effect of fading trails behind the churning particles, which change color over time.
   
• The focalLength of a Custom PerspectiveProjection in Flash CS4 3D  ...is not what you might think. You create a PerspectiveProjection object, pp = new PerspectiveProjection(), and set pp's properties. When you assign pp to transform.perspectiveProjection of a DisplayObject, focalLength changes. How? Why? We explain in this tutorial. The value of focalLength is crucial for effective 3D depth-sorting.
   
• Z-Sorting of a 3D Card and the Projection Center in Flash CS4  If a 3D card is not necessarily located near the projection center, determining which side is visible is a bit complicated. We show how to depth-sort in that case by using a normal vector to a card and a vector toward the observer. We present a versatile CardRotator class.
   
• 3D Accordion-Like Effect of Image Folding and Unfolding in AS3 Flash CS4  We present a custom AS3 class, ImageAccordion, that folds and unfolds an image in accordion-pleated fashion. We use the native Flash Player 10 3D methods and achieve a remarkably realistic effect. On click, an image folds or unfolds in a tweened motion. The effect helps to save real estate in your Flash movie. And it is is just plain cool!
   
• A Retro TV Effect for Video and Other Dynamic Objects in AS3 and Flash CS4  We present a custom AS3 class, RetroTV, that easily converts any DisplayObject, (possibly combined of Sprites, Video, Shapes, TextFields), to a retro television display. The display is complete with lines, noise, and distortion. The television image is updated continuously in real time to reflect changes of the object on the TV display.
   
• Three Mirror Kaleidoscope in Flash AS3  The most common computer generated kaleidoscopes correspond to a simple two mirror kaleidoscope. Three mirror kaleidoscopes give rise to much richer symmetry effects, just like the toys you might remember from childhood. We provide a custom AS3 class that creates a three mirror kaleidoscope based on any bitmap image or a MovieClip you provide.
   
• 'Seussian Twists', a Mesmerizing Particle Effect in Flash AS3  Glowing lights fly up into the air and leave behind trails that look like colorful twisted stalactites. The effect looks like something in the style of Dr. Seuss, or perhaps like something out of the movie Avatar. Full source code is available to download.
   
• Flash CS4 AS3: Flower Twist – Interactive 3D Bitmap Particles  A spectacular 3D particle effect with full source code ready to download. An image of a flower explodes into a 3D helix. Watch the colorful particles twist and fly through space, or turn off the automatic mode and use the sliders to control the motion and geometry of the particle cloud. The code involves z-buffering of particles, interactive quaternion-based rotation, and bitmap filters.
   
• Z-Sorting and Perspective Projection in AS3 and Flash Player 10  In Flash Player 10 one can literally 'build' 3D objects by placing their elements in the 3D space. Such objects can be rotated easily. The z-sorting, however, has to be done 'by hand'. In this tutorial, we show that with the effects of perspective projection, sorting by the z-coordinate does not work very well. Instead, we sort with respect to the distance from the observer.
   
• How to Set Perspective Projection of AS3 Interactive Objects without Losing Interactivity  A simple but useful tip concerning native 3D methods of Flash Player 10.
   
• A Dramatic 3D Photo Gallery in AS3 Flash CS4  XML-customizable, versatile gallery on a rotating 3D cylinder viewed from the outside. The tutorial includes many useful custom AS3 classes: multiple image loader, a preloader and more.
   
• Realistic 3D Snowfall Effect in ActionScript 3 and Flash  We present a custom AS3 SnowDisplay class which can be used to create a variety of realistic 3D snow animations that include turbulence and wind effects. You can superimpose the animated snow over your image. You can create two instances of the class with small flakes and larger flakes, and place your graphics in between the instances creating an incredibly real-looking effect. We use Perlin noise, the parallax effect, particle techniques, and physical modelling.
   
• 3D Cylindrical Photo Gallery in AS3 Flash - Revolves Around You  The most spectacular of our 3D galleries yet! A cylindrical 3D gallery that can be fully customized via editing of a simple XML file. Sit in the center of the cylinder and watch the images revolve around you. The application uses native 3D methods of Flash Player 10.
   
• Waterfall Flash Effect - A Custom AS3 Waterfall Class  We present a particle effect of a spectacular, dynamic waterfall. By manipulating parameters, you can easily customize the look and the feel of your waterfall. You can choose a transparent background and place a waterfall over any image you want.
   
• Create Great Paper Cutting Patterns on the Fly - a Flash CS4 Effect  We present an effect meant to recreate the childhood experience of cutting and unfolding paper. Cut out polygons from a folded paper triangle like you would with a scissors and see the beautiful snowflake-like patterns emerge as the paper unfolds. The effect is based on custom AS3 classes that use methods new to Flash Player 10.
   
• A Snowflake Generator in Flash CS4  We provide a custom AS3 class, SnowFlake, and an applet that creates snowflakes from a drawing generated by the user. The user creates a drawing through simple dragging of dots. Via a series of symmetries and random parameters, the image gives rise to an unlimited number of complex snowflake patterns. We use new to FP10 methods of the Graphics class: drawPath and copyFrom.
   
• Nova - Cosmic Interactive Particle Effect in Flash  This exploding star particle effect will blow you away! Watch the mesmerizing colors of particles and their shadowy trails as they billow away from the core. As always, complete AS3 source code comes with the tutorial.
   
• Bursting and Twirling Ribbons - AS3 Flash Particle Effect  We continue our popular series of particle animations with a whimsical new example. This time, the particles consist of line segments which rotate as they move. Small rectangles are drawn between the previous segment location to the new segment, producing the effect of twirling ribbons being swept out in the trajectories. ColorTransform is continuously applied to produce smooth gradient coloring.
   
• A Dynamic, Interactive Fountain - Flash CS4 AS3 Effect  Don't miss this spectacular 'fountain made of particles effect'. The effect uses our custom AS3 classes that, with some variations of parameters, produced our recent, very popular examples of Splashing Rain and Lorenz Attractor in Bubble Form. This new effect in the series shows the versatility of the custom AS3 classes.
   
• Simple and Sleek Solution to Blurring of 3D Objects in Flash Player 10  Everyone who works with 3D methods in FP10 is familiar with the blurring issue: the moment an object becomes a 3D object, it blurrs. We present a simple and elegant solution to this issue by Matteo Sisti Sette. His solution consists of a clever 'scaling correction'.
   
• Lorenz Attractor in Bubble Form - AS3 Flash CS4 Visual Effect  Don't miss this very interesting visual effect. The Lorenz Attractor, a choatic dynamical system, is drawn in the form of bubbles which become loose and float away. The bubbles shrink, dissolve, and seem to follow ever-changing pattern.
   
• Rain Animation with Splashing Raindrops - AS3 Flash CS4 Effect  We present a versatile custom AS3 class, RainDisplay. With easy parameter manipulation, you can create a variety of spectacular visual effects: rain with splashing raindrops, dripping paint, and much more.
   
• XML-Driven 3D Billboard - Flash CS4 and AS3 Effect  We use the native 3D methods available in Flash Player 10 as well as several custom ActionScript 3 classes to construct an advertising billboard with a 3D twist. The billboard is fully customizable by editing a simple XML file.
   
• Kaleidoscopic Gallery in Flash CS4  We present a gallery of kaleidoscopic effects and stunning, dynamically generated images. Take a photo of street graffiti, or any other image, and transform it into fascinating symmetrical patterns. To accomplish these effects we use a custom AS3 class, KaleidoscopeMirror. It is a new and enhanced version of the Kaleidoscope class from our earlier tutorial.
   
• Kaleidoscope Effects in Flash CS4  We use the new ActionScript 3 method, graphics.copyFrom, supported by the Flash Player 10, to create spectacular kaleidoscope effects. We provide a custom AS3 class, Kaleidoscope, that can easily be customized in all respects. A simple change in the intial image passed to the constructor produces dramatic changes in subsequent kaleidoscopic images. Fun to play with!
   
• 3D Card Flips with Tweens in Flash CS4 and Flash CS3  The ultimate image flip tutorial! We present two custom AS3 classes, TweenFlipCS4 and TweenFlipCS3 prepared for FP10 and FP9, respectively. Flip vertically, horizontally, customize easily tweens and speed. In the CS4 version, we use native AS3 3D methods, and provide a way of solving the blurring of 3D objects problem.
   
• How to Set Perspective Projection of Display Objects - Experiments in Flash CS4  If you have more than one 3D object in your movie, manipulating the perspectiveProjection property of the root may not produce good results. In this tutorial, we show how to assign instances of the PerspectiveProjection class to individual display objects. We show several ways of accomplishing that. We discuss sometimes surprising behavior of such assignments.
   
• XML-Driven 3D Spinning Menu and Photo Gallery in Flash CS4  Due to the great popularity of our earlier spinning gallery, we present a much improved version of the gallery and the underlying SpinnerMenu class. The new gallery is XML-driven and thus easily customizable; each instance has its own PerspectiveProjection object which makes several instances of the menu in the same movie look good; loaded images can be captioned. Don't miss this one!
   
• 3D News Ticker in Flash CS4 and AS3  In this effect, we show how to use our custom AS3 class 'NewsTicker' to create a cutomizable 3D news ticker in Flash CS4. We use the new 3D methods available in AS3 for Flash Player 10. News messages are loaded from an external XML file. We also examine the issue of display objects becoming blurry when placed in the 3D space, the issue particularly bothersome when dealing with text.
   
• 3D Spinning Menu and Photo Gallery in Flash CS4  In this effect, we present a 3D image gallery in Flash CS4 in which the menu of thumbnails is spinning in 3D. The tiles spin asynchonously creating a nice effect. At each spin, a different set of images is revealed on the reverse of each tile. The code can be adapted to create any kind of 3D spinning menu. The custom AS3 SpinnerMenu class at the heart of the effect, uses the new 3D rotation properties available in Flash Player 10.
   
• Loading and Unloading SWFs with 'stage' References  Loading external SWF files that contain references to 'stage' requires caution and often extra steps to avoid runtime errors. We discuss all the issues involved and give solutions. We also explore the question of unloading loaded content. We explore an exciting new method available in Flash Player 10, Loader.unloadAndStop and its superiority over Loader.unload.
   
• 3D Bitmap Book in Flash CS4 and AS3, Flipping Text in 3D  In this effect, we show how to use our custom AS3 class 'Book' and a sequence of Timers to create a 3D animated book that spins, rotates, and travels through 3D space. We also demonstrate how to flip TextFields and other DisplayObjects in 3D. We use images of our book but the source code can be easily customized.
   
• 3D Spherical Gallery in Flash CS4  The new ActionScript 3 3D methods available in Flash Player 10 and Flash CS4 make it very easy to create sophisticated 3D effects that before required advanced tools like Papervision3d. In this example, we show how to build a 3D spherical image gallery. The sphere of thumbnails can be rotated by the user or it auto rotates. When the user clicks on a thumbnail, an image loads. Building this fully functional spherical gallery requires only a couple of pages of timeline code.
   
• 3D Photo Gallery in Flash CS4  A stunning 3D gallery of outer space images! The new 3D ActionScript 3 methods available in Flash Player 10 and Flash CS4 make it possible to literally 'build' complex 3D objects by positioning their elements in Flash's 3D space. It's simple and easy. In this effect, we build a 3D cylindrical gallery.
   
• The new drawPath Method in Flash CS4  This Basic tutorial illustrates the drawPath method and the Vector class (new to Flash CS4) by creating a filled polygon and a "curved" polygon with draggable vertices. We focus particularly on the "winding" protocols for filling overlapping regions.
   
• 3D Texture Mapping with drawTriangles in Flash CS4  We create a collection of 3D textured spheres, namely planets, that auto rotate or can be rotated by the user in 3D. We use the AS3 method 'drawTriangles' for texture mapping. The method is new to Flash Player 10 and Flash CS4. A comparison with an earlier version of the app, where a custom AS3 class was used for bitmap distortion, shows that the drawTriangles method significantly improves performance.
   
• Simple 3D Dynamic Drawing in Flash CS4  In this tutorial, we present basics of runtime 3D drawing in Flash CS4 done in the simplest possible way. We use the new Matrix3D, Vector3D classes and rotational methods to build a simple renderer for 3D objects drawn at runtime. We show examples of a cube and an icosahedron that can be rotated by the user.
   

Earlier Flash Player 10 Experiments

You can find below a few experiments that use some of the new ActionScript 3 classes and methods that Flash CS4 and Flash Player 10 support. The 'as' files in those experiments were compiled using a nightly builds of Flex 3 SDK. SWF files compiled for FP10 Beta 2 run just fine in the release version of FP10 and the 'as' files can easily be adapted to Flash CS4.

• The drawTriangles Method in Flash Player 10 for 2D Image Transformations  One of the most powerful new AS3 methods that will become available in Flash Player 10 is the drawTriangles method. It allows for sophisticated 2D and 3D bitmap transformations. In this experiment, we illustrate and explain the drawTriangles method in the context of 2D image transformations.
   
• Interactive, Open-Sided Bitmap Cube in Flash Player 10  We construct an open-sided, interactive cube whose sides are bitmaps. The cube can be rotated in 3D and manipulated by the user. Whenever possible, we use the simple built-in 3D methods available in Player 10. We use the matrix3D class for depths-sorting only. FP10 Beta 1 and FP10 Beta 2 versions are provided.
   
• Getting Started with 3D Methods in Flash Player 10  3D effects that took a lot of coding before will become very easy in Player 10 because of its native 3D support. In this tutorial, we show a few basic 3D methods that are new in Player 10. We show how to easily rotate bitmaps in 3D and how to flip a playing card in 3D. Because of many new AS3 classes supported by the new version of the Flash Player, such effects are very easy to accomplish.