Comprehensive analysis of Flash light effect

Effects

Among the many dazzling flash effects, the most fantastic and magical effect should be a light effect. Light effect is the final level in Flash-magic field, the common have glow, laser, cast rays, set beam, etc., these light effects bring great visual impact and dynamic enjoyment. Unfortunately, however, many people are still unable to master the design elements of the light effects, or assume that they can only be done using ActionScript or relying on other software. Today, I take you to explore the magical mysteries of light effects! The results are shown below:

source File Download

In Flash, light can also be divided into "point light source", "line light source" and "surface light source" three categories. respectively, as shown in Figure 2-4. The surface light source includes three-dimensional body light source. Many of the light that is common in life is derived from these three types or combinations. As shown in Figure 2, comet, Hui's head is a point light source, and the comet tail because of the long trajectory, it formed a line light source.

　　　　

Figure 2, Figure 3, Figure 4

In the flash drawing, point light is more inclined to launch, so the general use of "linear gradient fill", the comet in Fig. 2 is outlined in four colors: the closest to the inner light is the reference light, usually white (#FFFFFF), and the second is the Transition Light (#CAF1FB), It is the auxiliary color of the light source, which is used for the natural transition of the main color of the light source and the inner colour; the light source main hue (#3394D1) is adjacent to it; the last color is the Glow (#3394D1), which is the same as the main hue, but the alpha is smaller or even zero The Color mixer panel settings are shown in Figure 5.

Figure 5

Careful observation of Figure 5, it is not difficult to find, "point Light" in the setting of the left three colors are more dense, which is the best form of emitting light. and "Line Light" is a "point light source" of a stretch and deformation effect, the general use of a clear hierarchy of "linear gradient fill."

The color combination of "line light" is very subtle and interesting. In Figure 3 Lightning is used in three colors, from left to right are white, yellow and red respectively. Although there is no traditional blue, and in nature it is difficult to see such a landscape, but do not forget: Flash is a tool for creation, each designer can be the creator of miracles!

In addition, many "point lights" can evolve into "line light" through simple deformations. The tail shown in Figure 2 is not the scale of the comet's head.

Like the "Point light source", the "surface light source" is generally a "linear gradient fill", and the base light, transition light and the main light source are very close apart. The difference is that the base light is larger than the center width. Because the surface light source is used for the eruption, the scattering and so on the effect realization, the light source is more hot, the expressive force is also more intense.

Understanding the principle of the light source above, the light movement effect of the form of expression is much better understood. The first is speed. Many people have the misconception that only a lightning bolt can express speed. The movement has the slow and urgent, the priority also has increases the speed and so on factor's cent, only then can obtain the best effect by the comprehensive application. It is important to specify that the speed is also very sensitive to the color of the light source. For a "linear gradient fill" of light, its trajectory is like a broken wave. And deformation is another tool to shape the effects of light, it includes two aspects: Fill color position and chromosome shape. As can be seen from fig. 6, the leftmost is a basic spherical glow, the middle one is formed by changing the gradient fill position to form a high light ball. and the projection effect of the following light sphere is created by placing and scaling. The right side of the contraction ratio more powerful, as if a meteor across the night sky.

Figure 6

There is also a kind of alternative light deformation, we call it dislocation. It is often used in expressive current effects, as shown in Figure 7. Lightning is a model. This light is made up of a number of zigzag line segments, and their appearance is always haphazard and has no fixed position. Through the light dislocation, can create a very shocking and rapid atmosphere. Several other forms of light are very useful in the building of certain effects, just like the above. A mask, for example, is an essential feature in almost any design tool. The use of masks can have a local effect on the light, which is conducive to dealing with some effects alone, so that the shape of the ray more exquisite lifelike.

Figure 7

The theory may be pale, but it is the key to the door of success. Below we learn a "magic domain Exploration" example, through the design of several common light effects to consolidate the above theoretical knowledge, the effect as shown in Figure 1.

1. Turn on flash, set scene size to 600px x 400px, background color black, frame rate 40fps. This example requires a total of four movie clip symbols, as shown in Figure 8-11.

　　　

Figure 8, Figure 9, Figure 10, Figure 11

2. Press the shortcut key CTRL+F8 create a new component named Laserlight, and rename layer 1 to laser Source. As shown in Figure 12, set the color mixer panel, where 5 sliders are #ffffff, #FFFF00, #FFFF26, #CC6600, #E30000, the first four sliders have alpha values of 100%, and the rightmost slider has an alpha value of 0%. Use the Ellipse tool to draw a circle in the scene.

Figure 12

3. Create a component named LaserLight2. Press the shortcut key, CTRL + C, to copy the circle drawn in the previous step and paste it into the scene of the component LaserLight2. Press shortcut key Q to pull up the "warp" tool, set its height to 1/12, into a beam of light. Press Ctrl+d to duplicate two beams of light, rotate through the transform tool, and the final effect is shown in Figure 9.

4. Create a new layer in the component Laserlight and rename it to Laserline. Press the shortcut key ctrl+l to open the library panel and drag the component LaserLight2 from the library into the scene in that layer. The final effect is shown in Figure 8.

5. Design Coma Head. Create a new component named Cometlight. Rename "Layer 1" to cometsource. and draw a circle in the scene of the layer, click the Circle, and set the mixer panel as shown in Figure 13, where the color of the 3 sliders is #ffffff, #0C79FE, #3394D1, and the alpha value of the 3rd slider is 0%. Click on the "Paint Bucket" tool, clicking on the lower right corner of the circle, the high light will hit the lower right corner of the circle.

　　

Figure 13, Figure 14

This is the head of the comet, and then we'll add a tail. Because light needs to do surround effect, the tail here is defined as a one-fourth arc. The practice is as follows: Create a new layer comettail in the Cometlight component. First draw a red filled circle, and then press Ctrl+d to copy the circle and fill it with blue. Select the blue Circle, press the shortcut key ctrl+t the "deformation" panel, set the width of the circle is 85%. Now move the reduced blue circle to the red circle, as shown in Figure 14. After the blue circle is removed, only the empty red arc is left, and the unnecessary parts are removed, leaving only the One-fourth arc of the upper left corner, which is the part we need. Add the same gradient to this arc plus the comet's head. To make the light effect more natural and softer, we first soften the edges. Perform the soften fill edge command under the Shape menu under the Modify menu. Set interval to 1px, step to 2px, and direction to select expand. Press the shortcut key K to select the "Paint bucket" tool, fill tail, followed by the "Fill transform" tool with the shortcut key F, set as shown in Figure 15. This completes the production of the tail component, and the final effect is shown in Figure 10.

Figure 15

6. Finally draw the sky lamp. Create a new movie clip named Skylamp, and rename layer 1 to lamp. and draw a rectangle and a circle on it and fill it separately. The settings for the Color mixer panel are shown in Figure 16 and figure 17. The colors of the 4 sliders in Figure 16 are #ffffff, #0033CC, #000000, #000000, and the alpha values of the 2nd and 3 sliders are 80% respectively. The colors of the 4 sliders in Figure 17 are #cccccc, #0099FF, #0000FF, #000000. The final effect is shown in Figure 11.

　　

Figure 16, Figure 17

Movie Scene Design:

1. Creates a new movie clip named Laserflash. Rename Layer 1 to LightLine1, build a layer, and name it LightLine2. In the second frame of LightLine2, press F6 to insert the keyframe, drag the component laserlight into the clip, and transform it into a vertical beam. Then press F6 in the 3rd and 4 frames respectively. In frame 3rd, the beam is slightly larger, in the 4th frame, the beam rotates 90 degrees to a transverse shape, and the hue in the color is set as shown in Figure 18.

Figure 18

Then we insert the keyframe on the LightLine2 1th frame, drag the laserlight again into a transverse beam, width as large as possible, and then set its Tint property to white. The key frames continue to be inserted in the next three frames, and the laserlight are also deformed differently. Finally, insert keyframes in frames 10th and 20th, and set the alpha value to 40 in frame 20th. In order to reflect the light explosion effect.

Create a new sound layer named sound and import a sound file. The layer settings are shown in Figure 19.

Figure 19

2. Create a new movie clip named Cometcircle, drag the symbol cometlight into the first frame that is placed in the Layer comet, click the 50th frame of the layer, press the F6 key to insert the keyframe, and reduce the component comelight to the appropriate size. Finally, the layer is set up as motion tween animation, as shown in Figure 20. Also, add a sound to the surround light.

Figure 20

Finally, the surround light is made into a horizontal rotation effect. Create a new movie clip named Comettransfer, drag the freshly made cometcircle into the first frame, and then simply zoom and rotate.

3. Creates a new movie clip named Toplight. Place Laserlight and LaserLight2 in frame 20th in different layers, and then insert keyframes in frame 30th, narrowing the two equal proportions to the appropriate dimensions and setting the Aplha value to 0%. Finally, the "motion tween" animation can be established.

4. Drag the toplight to the Skylamp and place it on top of the canopy lamp.

5. Sets the main scene. Create a new 8 layer and build keyframes in the 1th, 10, 24, 28, 43, 48, 54, 74 frames of the 8 layers respectively. The component Laserflash is then placed on the 8 layers, forming a vertical line (horizontal axis, different ordinate). Continue creating new layer 9, drag the movie clip Skylamp into the first frame, and then press F5 to insert the frame at frame 80th on the nine layers. Finally, create a new three layer, drag the movie clip Comettransfer in the first frame of layer 10, and place its middle in the tip of the canopy light. The frame is then copied, pasted into the first frame of layer 11, and rotated 120 degrees, and, similarly, the frame is copied to layer 12. Next, insert frames in the 22nd frame of layer 10, 11, and 12. The home view level is set as shown in Figure 21.

Figure 21

So far, the entire animation has been declared complete. Design Summary:

Through the "Magic domain exploration" This example of learning, I believe that the production of light effects has a deeper understanding and understanding. But the nature of this effect is not thousands, I hope everyone in the life of continuous accumulation, continuous innovation. Flash in the effect of a deep analysis, and strive to find a new design concept, to inspire new creative inspiration, let Flash become the hands of the real sword Flash!