China Naming Network - Naming consultation - Illustration firecrackers black and white-Who knows how to create firecracker effects in FLASH?

Illustration firecrackers black and white-Who knows how to create firecracker effects in FLASH?

Simple drawing of firecrackers

First draw the lines of the firecrackers, then draw the bows on both sides, then draw a rhombus with the word spring written on it, and draw two below the word spring For firecrackers, follow the first two firecrackers and then draw a string of firecrackers, draw the exploding cannon bars next to the firecrackers, and finally color the painted firecrackers.

Tools/Materials

White paper, black and white pencils, colored pens.

01

Draw the line of the firecracker, then draw the bows on both sides, draw a diamond shape under the bow and write the word spring.

02

First draw two firecrackers under the word spring, and the firecrackers should be separated. Pay attention to the proportions. The firecrackers are smaller than the character "春".

03

Follow the first two firecrackers and draw a string. The arrangement of the firecrackers looks a bit chaotic.

04

Draw the explosion cannons next to the firecrackers, and also draw the sparks when they explode. When drawing firecrackers, you need to create a series of effects.

05

Finally, color the firecrackers, and the entire process of painting firecrackers is completed. Note that the color of the firecrackers should be dark red.

Special Tips

When drawing firecrackers, the arrangement of firecrackers should not be regular and look messy. The whole group of firecrackers should not be placed too straight and there should be vibration when they explode. effect. How to draw firecrackers with simple strokes

9 simple strokes of firecracker cartoons How to draw firecrackers during the New Year

How to draw firecrackers Simple strokes of beautiful cartoons

Teach your baby this way Babies love to draw firecrackers with simple strokes

How to draw firecrackers with simple strokes

Teach you how to draw firecrackers with simple strokes for children

Pictures of a bunch of firecrackers with simple strokes

Simple strokes of firecrackers and fireworks, simple and easy to learn simple strokes of firecrackers

A complete collection of step-by-step pictures of firecrackers and fireworks scenery

Simple strokes of firecrackers

Firecrackers Simple drawings

Simple drawings of firecrackers

New Year's Day simple drawings of firecrackers with colors

How to draw simple drawings of firecrackers Complete picture collection of simple drawings of firecrackers

Firecracker simple drawing tutorial, hand-drawn cartoon pattern illustration

Firecracker simple drawing How to draw Firecracker simple drawing picture collection Who knows how to create firecracker effects in FLASH?

Examples of making large-scale animated greeting cards in Flash

1. How to view the source code

This animation contains many objects, materials, etc., so we also provide the source code for everyone to download. This is the first time that the source code of a large-scale animation is provided! The download address of the source file is:

. After downloading, play and watch ycard several times to deepen your understanding of the animation effect. Okay, now run your Flash

6, open the file (don't tell me you haven't done it yet) and create a new file. We will describe the production process step by step based on this animation source file. Switch to the new file, select Movie under the Modify menu, and make settings in the pop-up dialog box as shown below (Figure 2).

Forame

Rate playback speed is 20 frames per second (a higher playback speed can make the animation smoother). Width and Height are 500 and 400 pixels respectively. After setting, press OK to close. Then draw two black rectangles to cover the top and bottom of the screen to produce a widescreen edge-covering effect (you can see it by looking at the still frame in Figure 1), and lock the layer where the edges are located, and the layers where other animated elements are located are in the masking state. Under the edge layer.

2. Animation opening

After the basic work is completed, we start editing the animation. Switch to, look at the Loading part first, the background is constantly changing, which is caused by the continuous alternation of two pictures.

Press "Ctrl L" to open the Library panel. There is a background loop Movie

Clip in the prologue folder. Right-click on it and select Edit to edit and enter the background loop workspace. Let’s look at its Timeline (Figure 3).

As you can see, this looming process includes two layers. The upper and lower layers are actually one picture, just an inversion, and then set the first frame of the upper layer to appear, and the transparency of the fifteenth frame to " 0" hidden, set Motion changes. Produces a fading effect, while the lower layer is just the opposite, producing a fading effect. This red background is an imported bitmap file, which is in the red background Graphic object in the Library panel prologue folder. If necessary, you can enter its workspace and select Import under the File menu to import a new image to replace it. Pay attention to keeping the size consistent.

Return to the main scene, there is a "Computer News" logo (logo) in the middle of the Loading section, which is located in the congratulatory logo of the "Prologue" folder in the Library panel

Graphic object Within, you can right-click on it and select Edit to enter the workspace. Library is a very important tool panel in Flash. All elements when we create animations, including sounds, pictures, text, etc., are stored in Library and can be opened with the "Ctrl L" shortcut. OK! Next there is a Loading... text, which is a MovieClip. The name in the Library is loading. After that, there is a Complete prompt. In the Loading completion layer of the main scene, the black and white color is changed to produce a flicker. Let's look at the main scene Timeline. There are simple Actions on frames 5, 6, 9, and 10 of the Loading layer. Set them to loop. When the video is loaded, it will jump to the completion prompt. The 18 frames completed by Loading also have one

Actions, the function is Stop, because the animation needs to be played with buttons. The Play button is in the Library button folder. Also note that the button layer is above the black masking layer, otherwise it will not be displayed. We set its Actions to gotoAndPlay19.

3. Flickering effect

This is the opening part of the animation. You can edit it according to your material, or if you are lazy, just replace the material in the source file. . Let's start the animation. The animation below has a constantly flashing reversal film effect. It looks cool, but it is actually very simple. Let’s look at the white flash layer (Figure 4).

Create a Graphic object, then draw a white rectangle inside, drag it into the scene and resize it until it covers the entire screen, and then set the flashing effect. As shown in the Timeline setting in the picture, the transparency quickly transitions from 0 to 100 opaque, and then transitions to transparent, then the transparency of 65 jumps to 0, and the transparency of 40 jumps to 0, so the effect comes out. Try it yourself, but don't flash too much and be careful with your eyes:

Note: As the first white flash is completed, the background has been changed. Think about it, when the white flashes to opaque, a new background is put into the scene. When the white flashes to transparent, the new background gradually becomes visible. After the new background appears, it starts to flicker and has the effect of inverting the film. They are actually two identical pictures, one of which has been color inverted in Photoshop (Figure 5).

During the changing process of the background, there are always flashes of text interspersed. Text is a Graphic object located in the text of the Library panel. The flashing effect is still achieved through rapid changes, and C, P, C, and W flash out in sequence. Here is a little trick, we can put all the text in a Graphic, one text per frame.

Drag into the scene so that the text will change as the Timeline plays. When we need a specific text to appear, we can use the Instance panel (shortcut

"Ctrl I", for example, the letter P is in the text The second frame of the symbol. Then we set the Instance panel to SingleFrame mode as 2 (Figure 6).

The video continues to play, and the "Computer News" text and URL appear, using a simple looming effect. . Then enter the next screen: the editor's New Year's greetings section. The background is also switched to a traditional Chinese-style graphic, which is located in the "traditional red" object of the Library panel. Then a red logo of the newspaper is dropped. Found in the "Congratulations Logo" in the Library prologue. The method is very simple. First put the text we have made, then use the rectangle tool to draw a square, fill it with red, and then use a pencil to draw some small yellow dots and rotate it. Use the tool to make the shape in the animation. If you are interested, draw your own logo and put it in. Then there will be the words "New Year's greetings" in the Library, which you can modify according to your own ideas. The method of drawing this text is also very simple. First draw a black circle, then enter the text "small" and choose a font with a calligraphy feel. It doesn't matter if you don't have the same font in your system. Just choose a similar one. Yes, set it to earthy color. The method of "editing" is the same. The three words "Great New Year" below use strokes. First enter the text and use "Ctrl B" to make a yellow stroke. , and you're done.

4. Drawing firecrackers

The two strings of firecrackers shown below are more labor-intensive. You must first use the drawing tool in the toolbar to draw the shape of a firecracker and fill it in. Color is reserved (Figure 7).

Follow the steps in Figure 7 to draw the firecrackers. Finally, remember to use the gradient tool to try the red gradient several times until you are satisfied. Next, create a long series of firecracker animations. The firecrackers crackled and slowly finished. There is no shortcut for this work. We can only carry forward the "nail spirit" and complete it manually bit by bit. The method is as follows. First create a Movie< under the Insert menu New

Symbol

Clip the video clip, then drag the firecracker object you just drew from the Library panel, use the "Rotate" tool to adjust the inclination, then drag in a firecracker, adjust the inclination, and arrange it like this to complete the entire string of firecrackers. Don't worry, be patient. This is just the beginning!

After finally making the firecrackers, we are ready to set off a new layer and draw two sparks after the explosion. A single spark is not enough to express the effect, and if they are all painted on the same layer, they are prone to adhesion, so create a new layer to paint, and adjust the position after finishing. The next step is the burning process, and you still need to use the "nail spirit" just now. Insert a key frame every two or three frames in the firecracker layer, then delete one or two firecrackers from the bottom, adjust the spark position, insert key frames in sequence, delete the firecrackers, and adjust the spark position until the string of firecrackers is released. It’s really troublesome, it’s better to go to the store downstairs and buy skewers to save the trouble (Picture 8).

5. Scanning effect of the picture

Now we return to the main scene, drag the firecracker animation from the Library panel into the scene, one string on the left and one string on the left, adjust the Good location. In the animation, two strings of firecrackers are thrown down one after another from above, so we need to make a simple Motion to achieve the effect. First place the firecrackers on the top of the scene, then insert a key frame in a dozen empty frames, then move the firecrackers to the position where they will appear, set up the Motion motion, and the effect of the firecrackers being thrown down from the top will appear. After the firecrackers are set off, the scene transitions to scene 2. We can click the Edit

Scene button in the upper right corner of the Timeline to switch between the two scenes (Figure 9).

Enter scene 2. This is the main content area of ​​our animation, where edited photos from various sections of "Computer News", old stories and congratulatory messages will appear here.

There’s a lot of content, so come on in. The simple background here is replaced by a technological background after flashing. This background image is in the Library photo folder "Technology Background" (you can directly replace it with a picture). Then the editors of the major sections began to appear. We designed a scanning effect. After the scanning was completed, the photos gradually appeared (Figure 10).

Let’s take a look at how to achieve this effect. First, a scan line of the outer outline of the photo appears in the scene. This is a Mask effect. First draw a rectangular box to the appropriate position, delete the filling in the middle and keep only the edges. This is the outline edge layer, then create a new layer below it, make a rectangular gradient fill, and draw the Shape edge, moving from left to right (Figure 11).

After the movement is completed, right-click on the edge layer and select Mask, test, and it has no effect. This is because the Line object in Flash cannot be masked and needs to be converted to Fill mode first. We select the edge, select the Convert

Lineto

Fill command in the Shape sub-item under the Modify menu to convert the edge to Fill mode, and test again to complete the effect. Then there are two scanning actions inside the contour. It is also a Mask effect, because we only need to make this scanning effect appear inside the border line, so make a rectangle, adjust the size and position to the same size as the border line. Use the same method to create a gradient fill motion. There are certain requirements for filling this time, because the tail of the scan is gradually disappearing, so a gradient filling from white to transparent is required. Open the Fill panel from the Windows menu Panels, select the fill slider on the left, then open the Mixer panel and set the Alpha transparency to "0" (Figure 12).

After setting up, perform a Shape move operation on this transparent gradient. This time, move it from the left to the right and then move it back again. This will complete a scanning cycle and pave the way for the photo to appear. OK, after completion, it’s time for the photo to appear. The photo has an independent layer and appears in a fade-out manner. The 9 photos and section introduction modes that appear from now on are all the same, so we put the photos in a separate Graphic, one photo per frame, so that when we switch photos, we can use the Instance panel through the techniques we learned earlier to specify. Because of the relationship between position and size, it is best to keep the size of the photos consistent to ensure they are not misaligned.

The next thing that appears is the name and message of each section. Just like the method of making photos, make it into a Graphic and use the Instance panel to control which one should appear. At the same time, you must have noticed that the background image is also constantly flashing, including the white flash mentioned above, and the color will continue to change. This is adjusted using the Advanced color in the Effect panel (Figure 13).

This function in Flash is very powerful. It can not only adjust the transparency, but also accurately adjust the ratio value of each single color. Through it, we can produce a lot of color effects on the background image.

After the photos are introduced one by one, the old story will follow. With a burst of laughter, the old editor appeared (he had a "hypocritical" smile and a "vicious" heart, which made the editors "on tenterhooks" all day long, so we used a black background to set off that atmosphere), photos and text Use a simple Motion transparent fade to appear. The image of the editor is portrayed through photos and text, and it ends with: "Will it happen? The editor naively thought!" If everyone’s greeting cards also need this kind of scene, hey, changing the photo will definitely be classic.

6. Ending of the video

Then the fireworks exploded and the words "Computer Newspaper" appeared. At this point, the animation was basically completed and the finishing work was carried out. The background of the traditional pattern gradually appeared, and a full edit was released. A group photo was taken, and a congratulatory message slowly appeared next to it.

Since we want the congratulations to scroll only where they appear, we have to make the last Mask. First make the Graphic object of the congratulations text, and then create a MovieClip to realize the scrolling of the text. Draw a rectangle in the first layer, which is the text. Pay attention to the size of the area that needs to appear. Then create a new layer so that it is under the rectangular layer, put the congratulatory message in and make a slow upward motion. The more transition frames, the slower the movement. Then right-click on the rectangular layer name area and select Mask. The scroll text is created and placed into the scene. The animation production is basically completed (Figure 14).

In addition, you need to make a repeat play button. Create a button, name it Replay, place it in the lower left corner, set Actions to jump and play the first frame of scene one. The code is as follows.

on(release){

gotoAndPlay("Scene1", 1):

}

At this point, the animation is basically completed, continue The next step is to add music to the animation. The background music in our animation is divided into four sections. The first section is in the opening section, the second section is in the photo display section, and the third section is the scary music of the old story. , and finally the background music for the congratulations after the end. At the same time, there are some event sounds (such as firecrackers and so on) in the scene.

7. Add sound effects

Okay, now let’s take a look at how to add the music in the animation. Go back to scene one and start from the beginning. Open the Library panel and you can find some of the sound effects we imported in the Sound folder. Most of the sound effects here come from Shanmeng Online (

). In the background music layer of scene one, frame 20 is the music we inserted, because it is preceded by the Loading part, which will stop after loading. When we click the Play button, the animation will officially play, and the background music will also sound. Then in the 149th frame of Layer

33, we played the sound of an object falling to the ground, which just matched the editor's word "small" falling. Immediately after the words "New Year's greetings" fell, the sound of an object falling was inserted in frame 176 of Layer32. In the Layer

30 and Layer

31 frames to match the firecrackers, we specially found the effect of the firecracker explosion and added it. Now that the dubbing of scene one is completed, we jump to scene two. With a few flashes, it switches to a technological background, and we select light-paced music to start playing. Listen carefully, its sound starts from small to loud. Here, we use the sound fade in Flash (Figure 15).

We select Fade

in in the Effect item of the Sound panel to achieve this. Since the playback time of this music is limited and our animation is relatively long, we set 6 loops in the Loops item. After the background music was completed, it started to match the photo scanning effect music. You can hear that when the photo edges flash, there is an electric sound. We added it to the 70th frame of Layer36, when the photo edges flash. In the subsequent animation, the photos will appear one after another, so our sound effect will be added to the flashing edges of each photo in turn.

After completion, the inside of the photo will also be scanned twice. We selected the scanning sound and prepared it to appear twice in Layer35 and appear in the same way in subsequent photos (Figure 16).

Later, when the editor appeared, the 1223rd frame of Layer 38 was accompanied by background music, and the laughter sounded in the 1236th frame of "Weird Laughter" in the layer. The fireworks part matched the sound of the explosion. Finally, the ending background music should sound when the animation ends. We put it in the last frame and set a Stop to stop the operation, otherwise it will automatically jump to the beginning after playing.

Tip: How to adjust the size of the replaced material

However, when replacing, pay attention to the size and position of the original material. If they are inconsistent, misalignment may occur.

Here's another little trick. Select the info panel under Windows menu Panels (Figure 17). You can see in this panel that if you select any object, the corresponding width, height and coordinate position will appear on the panel. We can use this tool to adjust the size and position of the object with pixel-level accuracy. If you want to replace the material In other words, this panel plays a great role. It can adjust the size, position, etc. of objects. At least it is much easier than dragging with the mouse with your eyes wide open.

Tips: How to replace pictures in Library

Press "Ctrl B" to open the Library panel, right-click on the technology background Graphic object in the photo folder and select Edit to enter its work district. First create a new layer, and use the Import command of the File menu to import a replacement new picture. After completion, we need to keep the size and position of the new picture consistent with the original material (it must be accurate, otherwise it will appear in the animation misalignment occurs).

Now I will teach you how to accurately adjust the size of the new image and the original image. Use the info panel, select the original image, and relevant data appears in the info panel. We get W width 183; H height 124; X coordinate -91.5, Y coordinate -62. After getting these data, write it down, then select a new picture and fill in the data of the original picture you just got. In this way, the size and position of the two images are absolutely consistent.

How to replace sounds in Library

Sound replacement is relatively simple. After importing the sound you prepared, it will appear in the Library panel, and then we can replace it at the location where it needs to be replaced. Create a new layer, insert keyframes, drag the sound in and delete the original sound layer.