Improvement = Create design parallax scrolling effect and graphical rendering in Web pages

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

One parallax scrolling effect Parallax scrolling

Have you ever played a game on a red or white machine or a little bully in your childhood?

These games basically are through the foreground and the background when the scene moves to produce the different disparity, thus achieves the simple stereoscopic effect

So the parallax scrolling is not a new thing, we played when we were kids ...

At present, this kind of parallax scrolling effect is used by more and more foreign websites, and becomes the hot trend of web design.

Give it a redefinition

But the use of this kind of effect also needs to look at the specific environment and the overall performance of the final page, to prevent the page too much procrastination.

Secondly, the design must be very closely related

The main features of Parallax scrolling effect:

1, intuitive design, rapid response speed, more suitable for use in a single page

2. Differential rolling layered parallax

Many of the elements on the page are rolling independently of each other, and if we're going to be layered on the other, there are two or three layers: the background layer, the content layer, the texture layer

(Is there any way to make it more?)

Implementation rules for differential scrolling:

Scrolling in the background layer (slowest)

The scrolling of the texture layer (the element between the content layer and the background layer) (the second slow)

Content layer Scrolling (can be consistent with page scrolling speed)

We make three layers of rolling speed inconsistent, we made a beautiful difference scrolling effect

As a designer, you can ...

1, the use of large background

These background images are generally high-resolution, large images that cover the entire site.

High-definition photos are a good way to quickly capture the audience, can produce a very powerful visual effect, the user's sight will unconsciously fall on the broad background

Note：

1.1, background Image color, content in the selection to be very fastidious, the premise is not to destroy the user experience, otherwise beautiful photos are in vain.

The best choice of picture type tends to some softer, slightly transparent category, do not affect the content of the Web site reading, recognition, pay attention to coordination.

1.2, a large number of pictures as the characteristics of the page should consider the image of the preload problem, in order to provide users with a better and smoother visual experience.

2, you can also use a simple color scheme

There is no more intuitive and concise background than a solid color. A solid color can be expressed in many ways.

One of the best colors in a parallax range is 2 to 3, we can adjust the transparency of the color to achieve a variety of visual effects

3, positioning the background layer, the relationship between the mapping layer and the content layer

Define the need for a map layer based on the functionality of the page itself

The mapping layer exists to communicate the visual effects more effectively, but if it becomes a distraction, it violates the original purpose of our use.

The presentation of the content layer is the most important, regardless of the background layer and the number of layers of fancy, in the designer design process, the content layer of the user's display is the highest priority

4. Storytelling

Strong performance, simple style and aesthetic sense of design together constitute an excellent interactive narrative experience. We often hear the words: content is kingly, technology is just a tool to achieve content. When you can successfully combine powerful information with beautiful executive power, you can create people like and enjoy the experience.

———— Wieden+kennedy

NonBlank Data Visualization--Information graphic design

Story 1 traditional mercury thermometer and large letter mercury Thermometer

Story 2 red light?

These are the simple application of graphic design in daily life, graphic design is an expression way of information visualization.

The graph of data comes from the visualization of the data, which is an expression of information that can be viewed with the eyes in a different way from reading.

This visual expression should not merely provide an explanation, but rather provide the reader with an understanding of the universality of the method of conclusion.

Today, visual expression is far more bright than simple pie or bar charts, making information more interesting, including design trends, creative innovation, and so on.

Design process of graphical and visual deviation in product application