The word-like universe in web design--typography design of fonts

Source: Internet
Author: User
Tags lowercase repetition

As designers, we are dealing with fonts every day, we often hope to be able to use them very well, for the design refueling luster. We often wonder, what is the use of so many fonts in a computer? There are so many words, how to layout can express the innermost thoughts?

It is often said that art is interlinked. Combining text composition with music, combining visual music with text typesetting, will make our typography easier to combine and reflect our design emotions.

The ordinary text to the music of the art form, the text typesetting to give auditory beauty and vision of beauty, more easily convey information, express its deep meaning.

When the music sounded, the computer player in the change of the spectrum of joy, sound horn vibration generated by the sound waves, beating staff and musical instruments caused by the change map (A-01), are our embodiment of emotional visual form.

The text typesetting with a visual music fragment embodiment, from the visual formation of a high level of scattered, density, and the effect of prioritization, has the function of the melody.

And a good typography design is a rhythmic and rhythmic music that we can understand as a frozen piece of music.

(i) Text analysis: To understand the structure of the font and the characteristics of the font, we are the basis for typesetting excellent font.

In the typography design, the design group of dot-line surface combine, the height is scattered, the density is gathering and gathering, it is the important factor that form beauty. 26 English letters, according to the thickness of the font set the node combination, each individual letter constitutes a note.

such as figure (B-01), uppercase I=1 A long node, o=4 a long node, such as figure (B-02), lowercase a=3 A short node, b=1 a long node + 2 short nodes.

The horizontal rhythm of single-line text typesetting: According to the thickness of the font set the thickness of the node and the arrangement of density, you can produce a high degree of prioritization and the sense of rhythm, such as figure (B-03).

Longitudinal rhythms of multiple lines of text: rhythms and rhythms based on the length of a single line of text and the thickness of the font, as shown (B-04).

When we note the text, we can start to sort out the rules of typography to make our font design more rhythmic.

(ii) The rhythm of the text: excellent typography, with its unique beauty. By the rhythm of the text deduce the beautiful music of rice.

The rhythm of the text itself: according to the change of the objective font, using the normal character of the font to arrange continuously, form a kind of rhythm form.

A piece of copy, do not use any modification and change, font size color is unchanged, the resulting rhythm is the word and the interval between the words, font is the only way to reflect the emotional basis.

As shown in the following figure, the font size direction is the same, the node notes repeatedly appear, rhythm is the space between the letters between the words, and the distinction between the case, then produced a high and low rhythm, the thickness of the font to make the text spread out cheerful or steady breath, such as the figure (C-01) all uppercase is a gentle and stable rhythm, such as figure ( C-02) uses the case, then produces the high and low fluctuation rhythm, but because the node is finer than the left text node, therefore may appear lively some.

As shown in the figure (C-03) All letters are capitalized, the interval between words to form a rhythm, and the color of the words between the form of rhythm, text typesetting on the basis of horizontal rhythm and formed a longitudinal rhythm. The use of a stable and lively font, coupled with the bottom of the italics, making the entire text layout revealed the masculine tone of the stable and without losing the rhythm of relaxed and happy.

The rhythmic beauty of the typography design is repeated: it can be repetitive with different spacing and same shape, or it can be repetitive with different shapes and same spacing, or it may be another way of unit repetition. The first condition of this repetition is the similarity of the unit, or the regularity of spacing, followed by the logic of rhythm.

(iii) How to give rhythm to words: Based on the rhythm of the text itself, the human gives it new rhythm and rhythm

Using the basic font and font size, without other intentional changes in the circumstances, according to the characteristics of the text itself to adjust, so that text typesetting in both horizontal and vertical production of an objective and natural rhythm changes, so that the law of typography more coherent and smooth, giving designers want to embody the feelings, like the music genre.

Figure (D-01) The same font, different size, different thickness, different colors, the formation of different rhythms of effect. The thickness and spacing of the nodes can give people a different sense of rhythm, cheerful, stable, lively and lovely or tense, more because of the different rhythm and there is a more obvious contrast.

Case study:

Figure (D-02), the text is capitalized, with the word spacing for the rhythm, the size of the contrast to form the rhythm of the strength, the text layout rational and orderly, by the subtle rhythm guide, suddenly changed into a strong tone, the theme of shock, eye-catching prominent.

Figure (D-03), word spacing for the rhythm, the size of a strong contrast highlighted denim, but also because of the use of thin lines, so that the whole picture of the rhythm of fashion and mellow, in line with the theme of women.

Figure (D-04), the word spacing for the rhythm, the size of a strong contrast. First with the gentle ups and downs of music to enter, and then with a strong music to shock the whole court, the follow-up still to the soft music as a supplement, the rhythm of the symphony to highlight the focus of the rhythm of shock and clarity.

Figure (D-05), horizontal, word spacing for the rhythm, the thickness of the font to form the temperament strength, font color depth to enhance the temperament effect, vertical view of the font size of the color formation strong-weak-strong-medium-weak rhythm.

(iii) How to give text Rhythm-baseline, special effects: By changing the layout style, add some special effects such as tilt or handwriting, make the text more interesting.

Commonly used methods such as adding italic to make text have a dynamic and interesting, such as the overlapping lines to make the text produced double base line and then form a duet or the rhythm of the duo, such as figure (D-06).

Case study:

(D-07), the font layout on the left is mainly based on the changes in the baseline, from a single baseline to a double base line, single change ensemble. The size of the ups and downs of the changes, so that the text highlighted the focus of the main content of the expression, the rhythm and lively.

Figure (D-08), if this text typesetting is a piece of music, from left to right, first brisk italic rhythm beginning, suddenly change out of the bright thin line of big tunes, attract attention, and finally a series of low-key music supplement, let people see this text is a fashion jewelry. In particular, the beginning of the italic, so that the picture in the feminine poise revealed lively.

Figure (D-09), in italics as the main theme, by the text of the big lowercase for ups and downs, beautiful rhyme.

(iii) How to give text rhythms-short and long sentences, kerning: add vertical rhythms through the size contrast and kerning of text.

As shown in the picture (D-10), the font size between the words, text and word size of the breakpoint to form a horizontal rhyme, but from the word line, the length of the line, the height of different, different spacing has formed a longitudinal rhythm, so this type of typography is a double rhyme.

Case study:

Figure (D-11), from the longitudinal view, the short sentence of the layout, people feel that this is the melody of the song, coupled with a long and easy to light the melody and relaxed taste of the handwriting, so that the picture has a taste.

Figure (D-12), we usually typesetting, always like to use the alignment, and the text layout is a way to the left or right or center. But from the node on the left, the melody from the gentle progressive to the reset, and then gradually fade gently, showing a progressive change in the relationship, so that the picture melody relaxed breathable, full of charm.

Graph (D-13), this combination of typography, both horizontal and longitudinal rhythm. Horizontally, the contrast between the size of the sentence, heavy-light-weight-light and the rhythm between the words, vertical, the length of the sentence and the picture reflects the emotional echoes.

Do not interfere with the rhythm of the design: a set of font layout design, font using the two best, no more than 3 kinds, on the basis of the font to adjust and change, such as case, size, thickness, line spacing and some special changes such as italic and double base line, you can produce a series of typesetting changes, so that text typesetting with a sequence, comparison, Uneven, strong and strong, etc. have the rhythm and rhythm of design emotion.

(iv) Prosodic design paradigm: The creation process of typography is accompanied by a rational emotional experience throughout.

The analysis of typography has come to an ending, and how to apply this typography to our typography is illustrated with an example below.

Figure (E-01), a line of words without change, although there is order, but too long no emphasis is not primary and secondary, can only rely on the characteristics of the font itself to produce rhythm, rhythm insipid not brilliant.

Figure (E-02), the flat sentence disconnected, in the original rhythm based on the new rhythm.

Figure (E-03), but the new rhythm is not able to highlight the focus we want to highlight, we have to make adjustments. This is a process that injects our emotional attention.

Picture (E-04), put the emotion that our subjective consciousness wants to give, emphasize prominent. Change the font size, weight contrast, adjust the rhythm, form a new rhythm. Key words will be adjusted to highlight, to give emotion, so that the rhythm more prominent, more fluent melody.

Figure (E-05), detail adjusted to make the rhyme more fluid. Add color to let the rhythm of light and soft, plus italic effect makes the whole serious text added a little bit of movement.

Diagram (E-06), and so on, because the rhythm of different, endowed with different emotions, can produce different rhythms. Based on the above layout method, we can arrange the text with different characteristics.

The text itself is tempered crystallization, itself has very beautiful rhythm. After design and selection as the basis of typesetting, the letter is replaced by the node, through the length and thickness of the node spacing, so that the text through the thickness and height of the changes and the change of line spacing produces repetition, size, color, baseline shape, short sentence of the music, given the rhythm and rhythm of words, can produce colorful visual effects.

Original: http://www.aliued.com/2013/02/02/1532/

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.