Do a flat design-visual Chapter

Source: Internet
Author: User

1. Remove Effects

Let's look at a set of contrasting pictures.

Also is the lens design, in the flattening to dispel the gradual change, the shadow, the texture, and so on each kind of modification method, only uses the simple form to express, obvious neat.

To do subtraction, this first step should be the easiest.

  2. Simplified extraction

First, let's look at a typical example of simplification and extraction.

The ox painted by Picasso

A cow from the original realism to the end only with a few lines to express, the whole simplification process also went through several steps, of course, there is a high demand for the designers to observe and refine their abilities, to fully understand the nature of objects, to understand the ingenious trade-offs, with minimalist elements, in the absence of more special effects decoration in the case of the expression of clear content, It shows the beauty of the object in the contrast of the line and contour.

 3. Use color skillfully

In the flat design, the use of color is in place, is undoubtedly a very important aspect of this design style, see a lot of works, in the color more emphasis on brighter, more vivid.

In the past design, the design of a work in most cases more focused on the two or three colors, and the flat design of the color is often between 6 to 8 kinds.

The following collected a number of colors using a higher frequency, blue, green, naked color (pink), apricot, gray, purple

In addition to the color of the match there is a lot of time in the flat of the visual design, is very few lines appear, more is the use of color blocks to express various relationships. (How to use the color block performance, there should also be a special share)

Of course there are some retro winds, same color, and low saturation ... And so on.

The important thing is that all kinds of tunes together seem to be harmonious

 4. Typesetting is important

Because in the flat design uses is the extremely simple element, therefore, the typesetting is particularly important.

First is the font: in the flat design style, the design of the font is very important, a novel font used as a design element will play a very important role, but be careful not because the font is too novel, and affect the transmission of information. Fonts are more often used without serif (sans serif) font type

Next is the big picture

A good picture can attract attention and click of the desire, in addition to appropriate typesetting, and then with flat interface, instantaneous design sense doubled, on the grade has wood

Again, translucent.

The biggest advantage of using these design methods is to create contrast, you can let the designer through the color block, the picture of large fonts or a variety of color levels to create visual anxiety, the legendary atmosphere should have such an effect, haha

This effect can be very shocking if applied properly, but use this effect with caution because it is difficult to handle properly and there are some principles to be mastered:

Translucent effects make sense only when pictures and text are readable.

When deciding on a translucent position, you need to know what's blocking it and whether the occlusion is reasonable.

The use of transparency errors will affect the overall design effect and reading,

For readability, do not place semitransparent elements (such as black-and-white or complementary colors) on strongly contrasting pictures.

Do not use too many translucent effects at the same time

5. Other styles and details

Who said flat is monochrome flat coating, flattening can also have other styles and details, we take a look at

Decorative painting style

(Source of material dribbble)

2. Three-dimensional

Who said that flat design is the color block accumulation, to see the flat can also have the details

The change between the color blocks presents a sense of smoothness.

3. Light sense, long projection and shadow/highlight

4. Dynamic

Look at the example below, when the clock is turning, the icon below the screen (Hamburg/beverage, etc.) also has a corresponding dynamic performance, the drink can also look like a shake in the glass.

In fact, there are many ...


Do a flat design, not simply remove the various cosmetic design effects, need more designers to observe, refine. We can find common ground and use it from all kinds of artistic expression forms in ancient and modern times.

Flat design is also not a simple monochrome flat coating, it can have a lot of details, but also can make texture and dynamic, which requires designers to be patient to find.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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: and provide relevant evidence. A staff member will contact you within 5 working days.