Visual structure of "points" in Website Design

Points, lines, and surfaces constitute the basic elements of the visual space and are the basic design languages used to express the visual image. Web design is actually how to manage the relationship between the three, because no matter whether it is any visual image or layout composition, it can be summarized into points, lines and faces.
A button and a text is a vertex.
Arrange several buttons or text to form a line.
Line movement or several lines of text or a blank area can be understood as a plane.
Points, lines, and surfaces are mutually dependent and interact with each other. They can be combined into a variety of visual images and ever-changing visual spaces.
In a webpage, a small and independent image can be called a point. Point is relatively speaking. For example, a Chinese character is composed of many strokes, but it can be called a point throughout the page. Point can also be a relatively small visual image in a webpage, such as a button or a logo.
It should be noted that not only the circle shape is called a point, square, triangle, and free shape can all be regarded as visual points. Points are visual elements of relative lines and faces.
Points are the most basic unit for forming a webpage. In webpage design, we often need to add subjective points, such as adding a new name after the news title, add a vertex or circle to the front of each line of text.
It plays a lively and vivid role on the page. It can be used properly or even eye-catching.
A web page is usually composed of a number of different points in different shapes. The shape, direction, size, position, aggregation, and divergence of points can bring different psychological feelings to people.
Next we will talk about the usage and performance of the points on the specific page.

On this page, there is only one point, surrounded by a large number of gaps, so it immediately becomes a visual center that attracts sight and interests. This visual center should be the theme you want to express, and the effect is the most direct and clear.
When you actually browse this page, there is a computer line beside the three-dimensional space point (peanut. The application of 3D technology highlights the visual center, allowing you to click to enter the next page.

This is one of the second-level pages of the same website. We can think of each group as a point. For example, news can be called a point, and there are four points in the lower-right corner. All vertices echo each other to form an unstable triangle chart. On this page, we repeat the point (peanut) on the homepage that is most eye-catching with 3D dynamic technology ).
The repeated appearance of the same visual image (point) can increase the viewer's impression.

In the lower part of the page, the points are arranged horizontally to form a stable and peaceful line.
The three similar points change with the color produced by clicking, and different product images appear in the center of the page, giving you a jump, turbulence, and cheerful feeling.
The four floating points on the page (top 10 icons) and text moving from left to right (also composed of points) enhance the active atmosphere of the page.
The dynamic comparison of two different emotions is embodied in the same space, which is also a great advantage of web pages over traditional print media.
As an echo, the designer deliberately uses many smaller points for shading in the middle and upper part of the page to enrich the page level.
The two horizontal color bars in the upper and lower sections of the page emphasize the stability of the horizontal line and unify the page.

On this second-level page, the vertical dots (from 1 to 10) On the right play a role in guiding line of sight and emphasizing order.
Points are arranged in an equal distance and vertical way to visually form a virtual vertical line. Add the margin of the paragraph text to form a vertical line visually to split the page.

On this page, different changes and combinations of vertex size, position, color, and aggregation produce a relaxed, lively, flowing, lyrical, and pleasant atmosphere.
Through beautiful arc guidance, people's sight will eventually be concentrated on the words "wasabi: sneaker" composed of vertices. Naturally, this is also one of the themes that the designer needs to highlight.

On the second-level page, the designer adopts the popular Flash technology, which allows the red dot to move happily on the page and gradient the color at the same time. The green dot is decorated with the dark dot, enrich colors and layers. The flow of the entire web page is cheerful and easy.
In the lower part of the page, the designer uses different vertices in different colors to highlight the design language of the page.
Note that three oblique points with gradient appear on both pages. It adds the momentum and the level of space before and after the page, which cannot be ignored!