Brief analysis of the idea, layout, skill and document processing of Flash animation website design

Intermediary transaction SEO diagnosis Taobao guest Cloud host technology Hall

With the popularization of the Internet, electronic commerce is becoming more and more widely used in the daily life of modern people. A new, dynamic, beautiful Web page content can effectively enhance corporate image and highlight product features. Although the use of a variety of languages to build a Web site, can make the site functional integrity, but the site interface effect can not be achieved perfectly. Flash is a web design tool that can achieve complete function, beautiful interface and full dynamic effect.

Compared with the traditional way of Web page production, the benefits of Flash to the site is very obvious. Combined with the actual performance of Flash animation in the network application, its characteristics can be summed up as follows: 5.

1. Suitable for network applications: Animation files are the basic characteristics of flash animation, according to its content, the use of vector technology to make the resulting web page file is very small. Flash animation page to "stream" the way the download side play, breaking the limits of bandwidth. Even when the network is poor, there is no need to wait for a long time.

2. Various forms: Flash Animation Web page performance in various forms, can contain text, pictures, sound and animation and other content, if not to consider the size of the file factor, you can also insert video clips in the Web page. Rich presentation forms enable flash pages to better represent the theme of the site.

3. Strong content: Flash Animation Web page can be based on the characteristics of the site, the site targeted publicity and performance, such as promotional ads can be directly set on the performance of promotional means, and product demonstration ads focus on the product's function and characteristics of performance. This makes Flash animation Web page performance can be more intuitive, so that viewers better understand the intent of the site.

4. Interactive function: Flash can use ActionScript statements to achieve interactive functions. For more detailed information, visitors can click the navigation bar option to get the content they are interested in or click the Flash Animation button to connect to the page.

5. Flexible layout: Due to flash its flexibility, you can set up a multi-level display area, to achieve in the same area to display the contents of different columns of the function; you can arrange the original content of the Web page at will; different layouts can appear on the same site, and transitions between layouts are natural.

The design of the animation Web page and the traditional web design, before the design must be the entire site for the overall planning, design a good web page structure.

When using Flash to make a website, you can follow the following basic process:

1. Confirm the theme of the website: according to the purpose of the website establishment, confirm the theme of the website, and the content that needs to be displayed under the subject. Design the overall structure, planning the column and the layout of the plate.

2. Prior conception: After confirming the subject, it is necessary to carry out the preliminary conception in the structure of the subject, to determine the style of the website and how to express it.

3. Collect material: According to the content of the prophase idea plan, collect the material of the text, picture and sound that the website design needs to use purposefully. For materials that cannot be obtained directly, the relevant materials can be made and modified by other production software to obtain.

4. The production site needs the element: May according to the plan related content and collects the material, in the Flash production website needs each kind of element. Example website logo, navigation menu, content display and copyright information.

5. Edit the Site page: combined with the early concept of the site for the overall editing, according to the overall structure of the site design site home page and the internal pages, and the entire site integration.

6. Web site file Modification release: To edit the content of the test and adjustment, and finally according to the site's application purposes and needs, will be published in the appropriate format.

The content of animation is based on the objective things, but it has a unique personality, is not a simple simulation. Therefore, it needs the rich color, the unique style, the exquisite production and so on, can create the formidable attractive work.

Flash website design in order to get better animation effect, you can use some skills.

1 Web-style navigation menu design: Navigation as an important visual element of the Web page, is necessary. Place it in a clear, easy to read area, and when the viewer enters the site, it is able to see it for the first time, and guides the viewer to get the content of interest more quickly.

There are a number of styles for navigation menus, including horizontal navigation, vertical navigation, picture navigation, and Drop-down menu navigation. A variety of styles of navigation design, can be with different styles of page design coordination and unification.

A Web site, there is not necessarily only one navigation menu, the same page may appear more than two navigation menus. Navigation menus are usually designed using buttons to complete, but when the site is too much information, resulting in a wide range of navigation, button components can not be completed. Can classify the column, use the form of Level two column. The first Class navigation column design uses the movie element to replace the button element, defines the movie component the mouse event namely realizes the button effect, but the button component as the Level two column.

You can add code to the mouse event of a movie symbol instance in the first-level navigation section as follows:

FunctionbutClick1 (event:mouseevent): void

{

Sd1.gotoandplay (2);

}

Sd1.addeventlistener (MOUSEEVENT.CLICK,BUTCLICK1);

Indicates that the 2nd frame in menu 1 starts playing when the mouse clicks the instance "menu 1"

The above code implements the first level menu to the level two menu jump.

2 Personalized Logo Design: Logo design is the specific things, scenes, events and abstract ideas, spirit, direction through special graphics fixed, so that people through the logo, natural Lenovo to corporate image. Logo (logo) and the operation of the enterprise closely related, logo logo is the day-to-day business activities, advertising, cultural construction, external exchange of essential elements, it with the growth of enterprises, its value is also growing. Logo has the form of text and graphical form, dynamic or static. Dynamic logo, more attractive than static. Make a beautiful logo, that is to the soul of a website, played a finishing touch of the role.

To design a simple, exquisite, unique, representative and have a strong application of the logo, must have a certain degree of art skills, image processing capabilities and animation production capabilities. First of all, according to the type of Web site, content and style, design in line with international standards, representing the corporate image of exquisite patterns, such as Japan All Nippon Air Airlines using the image of the flying crane to compare flight and auspicious, the Japanese Sagawa rush car using the character image of the run to compare SpeedPost; Then use the image processing software PS to complete the art of graphics and text design, the use of animation software Flash to complete the logo animation design, add animation effect for the logo. Such as: The use of mask animation to achieve graphics from the show animation, shape animation to achieve the dynamic changes in text. Finally, the logo animation effect design into components, for reuse, and logo components placed in the home eye-catching position.

3 website Color style design: The four basic elements of Web style: color, line, shape and layout. Different color matching effect, give people the first feeling is not the same. A Web site can not use a single color, this will make people monotonous, boring feeling, but it is not possible to apply all colors to the site, giving people frivolous, not stable feeling.

A website must have one or two theme colors that will not allow the viewer to lose direction or be monotonous or tedious. Under normal circumstances, a page as far as possible not more than 4 colors, too much color easy to make people have no sense of belonging. When the main color is OK, consider other color matching, must consider the other color and the main color matching, to achieve what effect. For example, the red symbol is active, enthusiastic, courageous, love, health; the green line represents fairness, nature, peace, happiness, reason; The blue line represents self-confidence, eternity, truth, truthfulness, silence, calmness, and purple is the authority, respect, nobility, elegance, faith, loneliness. Therefore, the wedding site more use of red, tourism and landscape types of Web sites using a more green department, Blue is known as the enterprise color, by many enterprises and government agencies preferred. There are several colors that are rarely used in web design, such as brown and purple.

4 Eye-catching web site design: Home page is the portal for visitors, with a good content must also have the attention of the public to attract the creative layout design, to better publicize and promote the site. The design must be considered from four aspects: one is to enhance the readability of the text; the other is to strengthen the visual effect; The third is the unified simple style; Four is the new and personalized layout.

Frequently used layout forms are: "T" structural layout, "mouth" type layout, "three" type of layout, symmetrical contrast layout. We can choose the appropriate layout according to the whole style and content of the website. For example, "T" structural layout, the advantage is that the page is distinct, the structure is clear, the disadvantage is too rigid, it is easy to let people "look tasteless"; Mouth "type layout, the advantage is that the information is large, make full use of the layout, the disadvantage is that the page is crowded, inflexible. There is also a pop layout, pop from advertising terminology, refers to the layout of the page like a poster, to a beautiful picture as the page Design Center, commonly used in fashion sites, the advantage is attractive, the disadvantage is that the Web page download speed is slow.

Home no matter what layout you choose, the site structure must meet the needs of users, must effectively disseminate the main information, and quickly guide users to their target location. Usually design, should be simple, clear, eye-catching, content highlighting, in order to ensure that the initial page to reduce the download time, as far as possible with less animation, using vector graphics. The homepage must contain the homepage to the inside page the picture jumps, namely must have the eye-catching navigation menu. The design requires only four layers: the background layer, the content layer, the navigation bar and the action layer, see figure Ii.

5 Jump design between Web pages

When the site structure has multiple navigation menus, if you make all of the animation effects in the same document, the file size is too large. To keep all the animation effects, but also to reduce the size of the file, you can animate the effects of the different files, and then use the Load file action, loading the corresponding animation, to achieve the same animation effect. such as importing SWF file code:

Loadmovienum ("show.swf", 1);

Note You must keep all relevant SWF files in the same folder.

6. Processing of file size

In browsing the website, whether can quickly browse to the content, is the most attention to every visitor. Therefore, it is important to consider whether the Web page in the load can be opened quickly, to the animation file processing is relatively small, there are several ways:

(1) First, the required pictures with PS processing into a JPG or PNG format picture files. can also enter the "library panel" in Flash, in the library to compress the picture file right mouse click, in the pop-up menu select "Properties", remove the "use imported JPEG data" option, in the pop-up "quality" to fill in less than 100 of the lower data (general election 50 on it), and finally "OK."

(2) for the music file to be inserted, you should select the MP3 format file, or use the audio Converter to convert the file into the MP3 format. At the same time in the Flash "library panel", select the MP3 file to compress right mouse click, in the pop-up menu select "Properties", remove the "Use imported MP3 quality" option, in the open window to select a lower "bit rate", and then click "OK".

(3) Try not to use special fonts, in order to avoid the animation files in the text to other computers can not be displayed, we recommend the use of device fonts, fonts smaller when the device font will be more clear, and does not occupy file size.

(4) In order to avoid useless variables, sounds, images, movie clips and other objects published to the animation file, to be removed before the release to release memory, reduce the time to load the page. You can select the Library Panel menu, click the Select unused Items command, and then right-click Delete.

Conclusion: In the network transmission speed is rising today, the use of flash vector graphics and streaming media playback technology to design a vibrant web page more and more popular.

Reprint article Please specify: the article from "Flash" http://www.flashplayer.org.cn/1158