"Front-end GUI"--analysis & experience of some excellent web design works

Source: Internet
Author: User

Preface: Excellent site design works have some similarities, even aesthetics, will certainly follow a certain pattern.

One

    • This group belongs to the same class.
    • Theme : Dim sum.
    • background : Cartoon animal image.
    • hue : soft, sweet.
    • Point line layout :
    1. In these two pages, dim sum as a point of existence, horizontal evenly placed in the middle of the page, the use of physical photos, more three-dimensional, the background from the soft comic form of graphic display, a good highlight of the theme of dim sum. Give people the desire to eat.
    2. At the same time, the two rows of dim sum are the same size, neat and orderly, in the form of dots in series, and the top of the page by the animal image of the dots in series into line the effect of the echo. Create a smooth, regular effect.
    3. The small squares in the navigation bar, as a polygon, are inserted in the middle of two separated areas, breaking the demarcation between the graphs, and making them blend with each other, suggesting the role of the navigation bar.
    • use of the face :

In both pages, the rectangular border of the navigation bar and Main page is geometric, regular, smooth, rational, and the background of the animal illustrator people shape, lively, free; the real picture of the dim sum is natural, vivid, thick, with a strong contrast to the thin vector.

    • Application of color :

The navigation bar is fixed using the meter white, the main page uses the Hue soft orange, the purple, the text of the page uses the white as the harmony, has reconciled the originally very bright color, makes the page more romantic, quiet, soft.

Both

    • This group belongs to the same class.
    • subject : News.
    • Stay white : Use a small amount of geometry as embellishment, a large amount of space left white, text in the form of lines, paragraphs and constitute the surface, the middle by a thin line separated, so that the page more rational, simple, concise, information transmission more clear and accurate.
    • Point line layout :
    1. The first page, masthead some scattered geometry in the form of points, there is no order, scattered arrangement, appear free, relaxed, lively. At the same time, they use near-large and small visual guidance to focus their eyes on the middle position, highlighting the theme of news.
    2. On the second page, two different news sections, with the same circular pattern on the right, are present in the form of dots, implying the same kind of content. On the left, different geometric patterns are arranged to form different faces, which shows the richness and color of the content.
    3. Two pages in the middle of a line, used to separate the upper and lower two different parts, at the right end of the line, the design of a geometric pattern with arrows, in the form of dots, breaking the monotony of the straight line and dull.
    4. In these two pages, the use of geometric geometry, make the page rules, smooth, rational.
    • Color Application :
    1. The background uses a gray, rational color, highlighting the news subject's seriousness and calmness.
    2. Geometric embellishment using yellow, blue, in the middle with a small amount of white as a blend, tone bright, creating a lively, relaxed atmosphere.

Three

    • This group belongs to the same class.
    • Point line layout :
    1. The circular pattern exists in the form of dots, horizontally symmetrical and set, appearing rigorous and rational.
    2. Text headings exist as lines, forming polygons together with paragraphs. On top of the page.
    3. The circular border uses the blue flash effect to create an electronic, informative interface.
    • Highlight Theme :
    1. The first page boldly uses red and blue as the contrast color, the pattern also uses to the ice and the fire contrast, creates the enthusiasm, the bold effect.

Experience

    • Web page art design has a "2 second theory ", to determine whether it is the best standard of design success is it can be in the shortest possible time to seize the user's eyeball, passed to the user want to pass the message.
    • Complete Web design needs: A, Audio-visual element B, layout design (effective communication information)
    • Features of excellent web pages:
    1. Subject information communicated clearly
    2. Unity of website content and visual form
    3. A distinctive overall design style
    • "A good design, always inseparable from paper and pens"--tailor-made
    • Creative (creative idea) is a prerequisite for excellent web pages, and excellent web pages need to achieve the dialectical unification of form and content , reason and emotion , aesthetics and practicality (creativity and information).

NOTE: Reprint please indicate the source

"Front-end GUI"--analysis & experience of some excellent web design works

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.