Making GIF animations easy with FW mx

Source: Internet
Author: User
Tags key window
All along, FW is one of my favorite software, recently downloaded a firework MX beta, full of excitement to start the FW MX animation experience, with FW mx gif animation feel more comfortable, faster production, creative thinking can be unrestricted, compared with other similar software, FW MX in the Web GIF animation, whether from the size of the animation produced and the quality, are optimized, and many of the operations and dashboards are combined with the MX series, allowing web designer to quickly build a Web site with the best ideas, fastest speed, and optimized web output.

Here's an animation of what I do, and let's look at how FW MX makes our web design easier:

(1) Create a new file, the size of 450x116, and then we use the circle, lines, pens and other vector to do a diagram tool to make a wheel, as shown in the picture:

The wheel of the painting does not need me to say it, but the FW mx inside the vector drawing way is also enhanced a lot, because it is easier to experience it yourself, and the wheel inside that red dot don't lazy do not draw oh, and so on useful.

(2) Select the drawing good graphics, press F8 key, the graphic conversion to animation, at this time we can see it in the library panel, hehe, a bit like to do the feeling of flash, as shown in the picture:

(3) Select this animation element, in the property panel in the frame column fill in the value 10, the appearance of the property panel is really too good and convenient, but also can be designed to improve the speed of a layer, as shown:

The number of the frame is determined by the length of its animation, press ENTER, and a warning window appears, as shown:

Said is automatically added to the frame, press OK, you can also click on Don t show again, in case it next time to disturb the view. Then we'll see a little red dot in the center of the wheel, this small red dot can be very important, representing the final movement of the animation of a graphic, we can hold down the small red dot to the right, found in the middle of a lot of "key frames", the point of any one of the frame points, will be the graphics of this frame. As shown in figure:

Press the play button to find that the wheel is moving, because the default animation interval is 7, we need to slow it down, open the frame panel, press SHIFT to select all the frame, and then double-click, Pop-up window, 7 to 18 on it. As shown in figure:

Above the animation, we can see the wheel from the left to the right, note that "move" is not "rolling" ah, how to achieve the effect of rolling it? Now let's use the property panel to make our animations more variable. Select this animation, in the Properties panel, the following configuration, as shown in figure:

Scaling is the change in the size of the animation adjustment, rotation is the rotation angle of the degree adjustment, can be a cis clock can also be reversed clock rotation, with the rotation in Flash is the same truth, opacity...to ... is transparent parameter settings, so that your animation fade effect more realistic. Oh, this is basically almost, press the play button to see the red dot rolling on the wheel did not? The wheel to the back is getting smaller, finally fade out, the effect is very vivid bar.

So I want to let the wheels roll along the wavy lines, like uphill downhill, what am I supposed to do? I pour, enough ruthless ah, so difficult to mention the problem, firework not like Flash has a guide line, you can let the animation along the guide line, that really can not achieve it? method or some, but more trouble, that is the first animation with Export Wizard output into a 10-frame animation, and then in the FW MX inside Open, and finally in the frame panel of each of the screen to reschedule, of course, the arrangement is along the wavy line, The image below is an onion peel to see the effect of the wavy line rolling or out, although the trouble points. As shown in figure:

Of course, kingfun at the beginning or in the FW MX in the interview for a long time, hoping to break the anmation elements for each frame of the graphics, but made two eye dim or not, if any friend can achieve, do remember to write the manuscript out Ah!



Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.