first, what is Banner?
Banner English translation is actually refers to the banner or banner, with the rise of the network, and later specifically used Banner to refer to any of the online (PC end, mobile end) of various sizes and shapes of the advertising map, there is static and dynamic points, In short, all the shapes and sizes you see on the Web page are basically banner, and are basically clickable.
Second, what is the role of Banner?
Advertise, display, advertise, or can bring the corresponding conversion rate to the enterprise, product or person.
What part of the Banner is composed of?
It is composed of at least one of the four items, such as copy, commodity map or model, and background.
One of the most common banner is that four items are included, so let's take a look at the image below for example:
So how do we judge the quality of a banner, knowing the basics above?
Like a designer, can be divided into not entry-level – beginner – Intermediate – Senior – Senior – Coaching, then banner I divide it into unqualified, qualified and excellent, and then we look at it separately:
I. Several sins of unqualified banner:
Guilt one: Pull the map is not clean!!! (Other counts and does not say)
Some people are very lazy, no matter what the picture is directly a magic wand is finished, then pen and channel these tools to stay moldy?
Guilt two: abusing various stunts
Like to use a variety of large strokes of dirty shadow and all kinds of light effect combined as one of the effects of killing Matt blind our eyes, however, we need to learn the correct use of special effects, and know how to exercise restraint and reserve, in order to reflect their own value, or very easy to look low.
Three counts: the obstacle of information reading
(Improper font distortion interferes with reading, "season" two words too lingering and tangled, public such ambiguous really good? And do not say black strokes, as well as dirty color)
Typesetting clutter interference reading, horizontal is horizontal, vertical is vertical, so that the jump-like layout is really cool? Anyway, the brain and the eyes said: Do not agree ~
Use color too much to interfere with reading (ouch I'm out of the mirror again, yes) Red orange Green Indigo Purple is used, as if a No Yan value of people, facial features are not coordinated, but clothes are also very high-profile ~ so you imagine what this will lead to the results of the people do not know where to look.
Guilt IV: inaccurate information transmission
Like the banner above, the problem is that improper use of color leads to inaccurate information transmission, "clean" should be more prominent than other text information, and here the only "clean" two words with a shallow lake blue, in the light blue gray background, the two words but sank down, not at all prominent, On the contrary, the other blue text in the light background is very prominent (too much text, the appearance of triangular color block is a messy layout is also one aspect), the equivalent of a strength but with the wrong strength.
The banner problem with the above picture is that keyword selection error leads to information transmission inaccurate, this is a banner, copy is "New summer high waist show thin dress", is obviously to highlight "high waist show thin dress" a few words, and here is highlighted the "New Summer", Is there a half-dime relationship between this model and the dress? I read less, you can't lie to me like this, because my eyes are not blind ah ~)
Crime five: screen and copy and the location of the activity does not match
First recognize the activity positioning, and then combined with the corresponding copy to do the design, like the above banner is very failure, why? First of all, how could it be written "LV full 0 Yuan package mail" This copy? Second, even if really "LV full 0 Yuan package mail" This low-cost guide type of copy, the screen how could be this high cold model, Large area to stay white, the text of a small layout design? The picture is not lively promotion ah, yes ~
Guilt six: The picture and text information is inconsistent, do not know why
Maybe you think the visual effect is good in the first grade. Oh, but, you look carefully, you think it is a movie poster, but it is selling European-style furniture, this screen refers to the activities of the purpose or interest points you read a few seconds before you know? Does this picture have a half cents relationship with your furniture? Although this is a shop banner, But who can tell us quickly about these new and old users, "What are you?" What do you want to do? " All right?
Summarize:
In banner design, information transmission is more accurate than anything else, and accurate communication of the purpose of the event takes precedence over design attractiveness.
Maybe you do this is a very creative banner, your use of color clean, layout comfortable, information level is also very clear, but, you do is a sell high-end women's banner, and I need banner, just want to tell others, I this new a batch of cheap silk stockings ... Welcome to snap up!~ (this position and convey to the user the information is completely wrong The boss is expected to crash OH)
Second, qualified banner must kill skill:
Here's a quick overview, because I've covered a few previous articles about how to make a good banner.
1. Accurate information transmission
Including accurate positioning, graphic information transmission accuracy and consistency.
For example, the rain drops, water droplets, are associated with the rubber boots elements, the text part also clearly informed the need to sell what things.
2, reasonable use of special effects or not
Various decorative elements, the use of various effects appropriate.
For example, whether from the red and yellow color or the ribbon through the main line to see, are to convey a very festive and lively feeling, a look is the new year promotional activities, the goods are also very good to inform this is to sell digital related products.
3, the screen clean and tidy
The elements in the screen exist because they are needed, not dispensable or superfluous.
For example, the upper body and lower body of the figure on the contrast, near and far small contrast, background dark and light contrast, all make this banner look clean and concise but not monotonous, it does not need some superfluous embellishment.
4. Information is clear and orderly
Think about what information to highlight, what method to highlight, color or size? is the composition reasonable?
5, the screen color for the needs and collocation, reasonable
For example, choose the color collocation by the activity purpose, according to the product map or model draw color, and reasonable use of color contrast and control color area, such as excellent set, station cool and 68design and other design sites have so many selfless dedication of the Great God has written about the use of color related articles I will not repeat here, We can search by ourselves ~
Related recommendation: Have Ali this article is enough: "Color with a crash!" 3 practical ways to get your colors across.
6, the last point, pull the map to dig clean!!! ~ (to not be worthy of the title of the professional pick up the picture of the job ~ Woo ~)
Involves the banner of the scene synthesis class, the light and shadow perspective should be at least roughly correct, conforms to the principle (there are so many tutorials on the net, how to do oneself go to Baidu to see slightly)
Third, the outstanding banner characteristic:
Excellent is, in addition to do a qualified, he also did a graphic consistent, creative very praise or resonate, bring people additional pleasure, or a smile.
1, with fun
Not only the accurate transmission of information, but also give people a smile, give people more than expected pleasure feeling.
For example, the figure of these hand-painted + physical and virtual combination of methods, especially for cute or wacky class of banner.
2. Creative
Or an interesting, or stunning, visual effect:
You are what u wear, a group of shoes advertising:
Create some colorful scenes by hand-drawn or three-dimensional modeling:
3, have a person to resonate with the copy or screen
For example, the following group of ads to promote the "all-linked shopping mall" shopping can save money for the advertising copy, it can be very sympathetic to the feeling that people will spend money or savings is a cool and emotional thing, rather than because of poor to save money.
Copy: Beautiful is the cost, the money to spend beautiful is the ability
Copy: To the full union will not let you become fashionable, but save money can let you turn yourself into fashion (this copy is too good to write, I can not refute ...)
Copy: A few dollars is very important, because this is the hard earned by Lin North. (Lin bei: Taiwanese, meaning your father.) )
Let's talk about something else:
I accidentally saw a great God banner me 4 years ago as a good case to say (I was in the mood, very shy ~ ...), in fact, now it seems that this banner just do the information conveyed accurately, but the text layout is very messy, the overall picture is very rough, haha, ( In addition to the various positive and negative cases I used in my article, I did some of my own writing, some from the petals, please ask me in private if you have any offense.
Written at the end:
For the electrical business banner design, the most basic requirement is to achieve accurate information transmission, and then the design of good-looking or creative, we can each month to summarize their design work, and then see what the problem, see it qualified? Is it good? Perhaps the previous works because of insufficient time, Because at that time you are not considered completely or under the pressure of the outside world you do not very good design, now we go back to find the problem, and to try to optimize them, adhere to, believe that will soon see progress. On the other hand, the time has passed so long, do not look back to the previous collection of design cases, they qualified? Is it good to clean up?
Today's content is shared here, have you got these skills? Haha, we'll see you next time.
Welcome to Xiao Ting Elder sister's micro-letter public number "tttink-d", a dry goods and good writing beauty designer:
Micro-Credit profile: Focus on the development of electrical business design thinking, not regularly share some personal insights dry goods, of course, will also share some of the top ideas, photography, life insights of the good wen.