Typesetting is an essential ability for every designer, and it is also the most difficult part of UI interface design. It exists in various forms in the interface, such as: pure text typesetting, graphic typesetting and so on. It is the place where designers contact more when designing, but it is also the place where middle and junior designers ignore the most details. Good typesetting can quickly and effectively convey important information in the interface to users. So I hope that through this article, I can have a new understanding of typesetting.
About typesetting design, I summed up six design skills (many skills). Of course, these methods are not absolute, but if these skills can be applied to typesetting design, the sense of interface design will be greatly improved.
They are:
Choose the right font
Alignment principle
Intimacy principle
Have the power to breathe.
Rational use of blank space
The power of contrast
Different fonts have different personality attributes, and font selection plays a very important role in interface typesetting design. Therefore, when designing, we should first consider the attributes of the product, aiming at different fonts, target users, different products and different people. For example, bold words are bold and eye-catching, which is suitable for the strong sense of the picture and highlights the use of information. The fine and concise words are suitable for women's industries, fashion, science and technology, catering and other types of content; Song style and bold characters stand out, which is suitable for the use of strong picture sense and prominent information. As shown below, different product attributes use different fonts.
Finally, remind everyone that it is best not to have more than two fonts in the same APP.
When designing an interface, it is necessary to keep all the elements on the interface in visual contact, rather than randomly placing the elements on the interface. Alignment will make the interface layout orderly and read very smoothly. Common alignment methods are: left alignment, center alignment and right alignment.
When we do interface design, we need to choose the appropriate alignment method according to the actual business scene to form a unified visual process.
Intimacy is to organize related items together when designing, which can be regarded as a whole and a group. So as to attract readers' attention and understand our meaning smoothly. This design can make the page organized, the reading logic clear, and the blank page organized.
When designing, as long as we fully understand the relationship between the elements in the interface, we will use it reasonably and master it.
Font line spacing, line spacing and line length are the most commonly adjusted attributes when we design typesetting. Too short a spacing will make it difficult for users to read, and too long a spacing will make users read sparsely. Only by creating a breathing format can users keep a happy mood when reading.
Line spacing: There is no standard value for line spacing itself. In design, we usually set the font according to the attributes and application scenarios (generally speaking, in design, we usually set the line spacing to 1.5 times the font) to increase the breathing sense of the text.
Kerning: kerning refers to the horizontal spacing of words. Although few designers spend much time on word spacing, they play a very important role in text reading. If the spacing between words is too crowded, it will reduce the readability of words.
President: President refers to the length of each line of text, and different platforms need to maintain different text lengths. If a single line of text contains too many words, it will cause users to feel tired when reading. A reasonable president will make users read smoothly, otherwise it will make reading a burden.
Blank space is a cliche of designers, which exists among various elements of page layout. Blanking can highlight the main elements in the page, create the visual focus of the page, attract users' attention and enhance the experience of the page.
Blanking can make the relationship between elements clearer, more easily perceived, increase the breathing sense of the page and appear more harmonious.
The purpose of contrast is to create visual sensory changes, avoid monotonous page layout and enhance visual effects. Reasonable application of the principle of contrast can greatly enhance the sense of hierarchy and design of text typesetting in the page, organize information, clarify the hierarchy, guide readers on the page and create visual focus.
Size contrast: the difference of visual element volume can produce visual conflict effect, which makes the visual level of the page clearer. The bigger the volume, the bigger the level and the more prominent it is.
Color contrast: Color plays an important role in typesetting design, which can make the finishing point. Reasonable use of color contrast can effectively highlight key points, distinguish information, and also play a role in embellishing the picture.
In addition, the common contrasts are: material contrast, modeling contrast, space contrast and so on.
Typesetting is an important skill that every designer needs to learn and master in the digital age. No matter what your design project is, these basic rules can always bring better results to your design. However, these typesetting skills are only very basic, and in actual design, many more complicated typesetting layouts will be involved-but these foundations are always the most important.