Website design: Brief discussion on the application of minimalist style in design

Source: Internet
Author: User
Keywords Use today talk I knot

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

Hi everyone, I am Itsuki, today I combined with my micro-blog in the actual project to share with you the minimalist style of a little design experience. In modern city life we have to face noisy streets and subways every day, all kinds of advertisements, handling all kinds of mails and messages. So we pursue a kind of experience that is-minimalist, like everyone household brands such as: Muji no printing products, Apple, IKEA, are the promotion of this style, their products have been a great success.

  

Minimalist in photography is a kind of prominent subject to take the simple way of photography, in life is a relaxed attitude to life, in the design is a concise design method.

This is also true of the design experience of Weibo, where we remove complex visual distractions and try to bring the user a pleasant and relaxed visual experience.

1. Micro Bo City Project

I have to thank a photographer for some of the inspiration I have given to me when I talk about the project of Weibo and the city.

German photographer Josefschulz (1966 born in the Netherlands)

  

The same city project requires to judge the login location according to the user login IP. This requires a map to reflect the local customs and create the atmosphere of the head. How to do it? How to make users feel at home?

While I was thinking about using food, scenery, architecture as the theme of the time, stumbled upon this group of 1980.html "> Photographic works." It does not have the extra light effect, the picture is clean, looks very comfortable. But seemingly simple things in the angle and composition than ordinary photos pay more attention to, such as the following group of photography is the pursuit of the plane composition and perspective principle, the content seems very monotonous, but a strong sense of composition.

Then I decided to use the city architecture to perform, and I started searching the web for landmarks in several major cities, and then simplifying and refining them to outline the main features of the building. Hong Kong as an example:

First we found a representative Hong Kong night view

  

Then draw a simple building skeleton and start coloring, and speaking of which I insert an interesting thing. Hayao Miyazaki's studio "Little Boys" group is responsible for drawing sketches and structural drafts, and then by the "Little girls" group finished coloring.

  

[Final Effect chart]

  

The same is true of the design process in other cities, and I am no longer one by one to repeat:

  

Unfortunately, this project has been on the line for a variety of reasons and soon after, so you may not be able to see. Oh ~

Let me summarize the little experience I've learned in this process, in the processing of similar product pages can be considered with a flat silhouette graphics, design plus a bit of the rhythm of the screen, and then use a little color color screen foil, can play a good visual effect hope you can use.

The following project is used every day, although it is very difficult to detect, but to reduce the user a lot of cognitive burden. Icons allow us to quickly find what we need, and to give users clear guidance.

2. Weibo icon Design

This icon was painted at the end of last year, when the need for Micro-blog revision (V4), before the icon there are many problems, such as the style is not uniform, the size of a variety.

This is the finishing of the icon, the icon does not have crystal texture, not too much texture molding. With minimalist design style as the main line, this also with the overall experience of micro bo "Light" "thin" spirit of the same.

  

Let's take a look at the contrast between the new version of Weibo and the old version of the microblog, which clearly shows the clarity of the icons and the visual effects of using minimalist design styles. The old version of the icon has a lot of unnecessary high light and three-dimensional, but these effects do not have the ideal effect, but the recognition of the greatly weakened.

  

3. Graphic Design

To define the color of the chart, the chart is different from the above two designs because it is identified by color. So color selection is particularly important. The chart sometimes is more boring, so the color I choose cold colors, so compare engaging, relative to the warm department, can reduce the user tired of the feelings of disgust.

I will add some faint light and projection, but the overall direction is mainly in the minimalist style.

[Pie chart]

When adding options, the colors of the other options need to be extended according to the main hue, but there is a small note: Because of the approximate color of the relationship, in order to ensure that the color of the left and right areas, we need to specify the location of each color, so I gave developers a Yan specification.

  

  

[Curve Chart]

The same is true of curvilinear graphs, with some weakly weak projections and high light variations in detail.

  

In conclusion: Minimalism is not equal to simplicity, but minimalism refuses to be superfluous.

Thank you for reading:

Finally, several web sites are recommended:

http://www.josefschulz.de/(the website of the photographer mentioned in the first article)

https://www.mint.com/t/012-c/(Good chart)

http://www.icoeye.com/(icon is very cow X, also with design process)

(Weibo UDC original blog, welcome to reprint and note the source, welcome to subscribe)

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.