Some small share about the trend of flat visual design

This article from the NetEase cloud community

Gabriella Liu

As a visual designer, can design a pleasing, walking in the design trend front and have their own brand design of the product is the pursuit of everyone's mind. When it comes to the trend of today's mobile product UI design style, many designers believe that the answer is flat design. Admittedly, in the 2013 flat design style has been all the way to the present, flat is still the mainstream of mobile product design, but many products use flat design at the same time will make the visual differences between products less and less, designers how to make their own product design unique, To make their products stand out in the same kind of competition has become particularly critical, which requires designers to maintain the design of innovation, and the basis of innovation is to first correctly understand the current industry in the mainstream design trends.

This article unifies own work experience simple sharing under the current mobile product flat vision some trends, mainly by "the texture, the color, the text, the icon, the content display, the motion effect, the gesture, the brand application" several analysis, if has said the wrong place welcome everybody to correct, Also hope that the flat design of students interested in private with me a lot of exchanges, we learn from each other.

Texture

1, extremely flat:

tend to use a lighter, more concise way to design the interface, remove all the texture, the pursuit of the ultimate flat design is the current design trend, the interface only focus on the core content, put aside any extraneous design elements, eliminate visual interference, but also make the interface style more modern, elegant, Tools and content display products are particularly suited to this style.

2, weak texture:

The overly flat design is not conducive to the visual hierarchy of products with more complex content, so many products now have visual designs that incorporate subtle textures that enrich detail and make content levels clearer and more intuitive.

Color

Color matching to the main, the interface in the proportion of colors before more streamlined, more inclined to use less color to design, make full use of color contrast to highlight important content information, improve visual impact and emphasize product key functions, but also for the product experience to create an atmosphere, enhance the brand recognition of products.

Text

As one of the important carriers of content, text information has been an important link in the design and typesetting of flat. Now more product text design tends to use a single font, through the font style (bold, medium, thin, italic) to divide the content level, to help optimize the browsing experience, to create a more concise, elegant interface, enhance the product brand attributes.

Prefer to use sans serif font design, the font line is clear, stroke uniformity, avoid excessive decorative details. IOS9 is specially designed for Chinese fonts, using the new "Apple" font, the font shape is thicker, the corner is more rounded.

Icon

The icon is an important symbol of the product's function and one of the core genes that shape the product's brand design style. Icon design must focus on good identification and creative balance, too abstract icons affect user awareness, not conducive to operation, too ordinary icons compared to the middle distance, visual no bright spot. Flat icons are mainly based on the "line, face" two basic elements of the continuous performance of a variety of combinations, different combinations can produce different texture styles, in the visual presentation of a certain difference.

1, Pure line form:

Line icons are widely used in today's designs, and the refinement of lines is more streamlined than ever, while more attention to detail is presented

2, "line + face" combination form:

With the combination of line and face, so that the icon in a flat style based on the same time into the physical elements, close to the actual, rich details.

3, Silhouette form:

Modern design trend of the silhouette of the icon more emphasis on color contrast, but also by the shape of the different faces of the color matching to achieve the desired effect, so that the icon and real objects linked to reduce user awareness costs.

In addition, the design of the icon to consider the effect of the trigger, you can strengthen the emotional elements, to provide users with a relaxed visual sense of pleasure.

Content display

The core of flat vision design is the pursuit of pure content information essence, the past interface will use lines to separate the various areas of content, but such processing will appear to be more crowded interface, while the overall information arrangement is more scattered, using the form of cards to present content, and through the appropriate white space, You can reduce the visual interference caused by elements such as lines, creating a cleaner, clearer interface that allows users to focus on content and improve ease of use.

Incorporate a number of graphic typography elements, such as magazine layouts, to make the interface more high-end, literary

Dynamic effect

In the process of product use, the action effect through visual feedback can draw the user's attention to specific areas, reduce the user's thinking about the product, and promote the task participation. In addition, the product dynamic effect in the emotional to please users, so that users in the process of surprise, conducive to shaping the brand design gene

The popular dynamic design is to use the interactive thought as the core criterion to design, with "light" as the main principle, the visual appearance should grasp the appropriate degree, not too deliberately arbitrarily add, because many and complex dynamic effect both affect the performance, also make the operation process become more complex, greatly reduce the efficiency. In general, the dynamic design is more suitable for use in product core function operation, switching, use feedback, but also can be used in the product characteristics of the introduction.

1, the dynamic design of operation feedback, make the product experience more relaxed and enjoyable, promote the user's participation, and the interaction level is more "light"

2, the case of the start page through the use of dynamic effect, so that users in the waiting process is no longer dull, but also embodies the brand design gene.

Gesture

With the popularity of iOS, Android smartphones, users have a certain understanding of gesture manipulation, product combination gesture can greatly improve the efficiency of the user to show a more concise, intuitive experience.

Brand Application

Brand design is a relatively large concept, color, layout, texture and other design elements can be a brand design. Here the brand application refers to the product interface in the application of some brand extension design, such as according to the brand custom graphics, dynamic and so on, these design elements can let users have a deeper understanding of product brand, in order to achieve brand promotion purposes.

Summarize:

Understanding the design trends in the back of the visual design work has an important help, it can make the designer to form "aesthetic standards", so that the specific design work more effective rate, but the design trend is a subjective analysis of the results, the specific product vision to integrate product demand positioning, interaction, market operations and other factors, Therefore, the visual designer in the design to learn the flexible use, can not blindly copy, choose the most in line with their own product design method to better packaging products, highlighting the brand design genes, and constantly optimize to deepen the brand design impact on users.

Suggestions:

1, as a visual designer, in addition to work should pay more attention to the discovery of life, to be good at discovering beauty.

2, when you see a great design effect, in addition to the collection, should think more about why.

3, outside the work of visual designers should try to do design, focus on self-improvement, do not rely on product projects to promote themselves.

4, always understand the design of the market and information, focus on the latest product trends, design is not behind closed doors.

5, excellent visual designers should have a better divergent thinking, to understand the current popular design techniques to optimize refining, forming their own unique design culture to lead the trend.

NetEase Cloud Gift Pack: Www.163yun.com/gift

This article from the NetEase cloud community, by the author Gabriella Liu authorized release

Related articles:
"Recommended" Meet user interviews
"Recommended" Streaming assertions ASSERTJ Introduction