Flat design in the user interface

Source: Internet
Author: User

Flat design is controversial in the current user interface design field. Microsoft's Metro style first introduced it to the public, and many people followed suit, for example, LayerVault, The Next Web, and more. From the very beginning, many designers are not optimistic about this kind of design, mainly because flat design brings a lot of troubles in a slightly complicated interface.

The flat design is both beautiful and fresh, with fast design and easier response. The Design Trend in painting may be widely accepted, but web designers always pay high attention to ease of use. Therefore, they always feel that flat design is inherently flawed.

The following figure shows the Design Aesthetics of Apple, Google, and Microsoft from the left to the right. The three companies have taken a very different path.

A moderate approach is the best way to resolve complicated disputes. Compromise is difficult for people with clear points of view, but the ultimate benefit is the public. In this case, the beneficiaries are the users of the product.

One way is to extract the advantages of flat design and apply it to highly complex user interfaces. For details, refer to the current interface design language of Google. Gmail (web + iOS), Google Maps (iOS), and Google + (iOS) are both examples of quasi-flat design.

In most cases, these interfaces follow the flat design principle: Flat color blocks, no shadows, and use colors to encourage users to interact (such as the red buttons in Gmail "write emails "). But when you look at it carefully, you will find that the red button actually has a small radian. This radian is like "Hey, hurry up !" Instead of "wow, I look as attractive as candy! You can also click my ." This kind of subtle feature visibility is one of the important components of a quasi-flat design and is also a major feature of its superior to a real flat design.

The quasi-flat design naturally does not ignore the concept of depth. On the contrary, adding a moderate amount of deep elements can promote your understanding of the interface. However, just like radians, the integration of deep elements also requires careful consideration to let the information jump out of the plane, but it will not undermine the flat design atmosphere.

The quasi-flat design example is not just Google, but the new version of MySpace also uses this kind of flat, but when you move the mouse over it, there will be a radian "Hurry up. Letterpress, this master-made game, although some say it is flat design, it also uses a shadow design to improve the interactive experience. Facebook, which has never been designed in radians since the very beginning, also uses shadows to separate and overwrite graphs and other pages.

In the future, iOS should move away with complicated quasi-materialized designs. Microsoft's Metro is also hard to use, and the future of design may belong to quasi-flat design, a design language that is both easy-to-use and efficient.

Comments from netizens:

Black and white: for a large amount of tiled content, the shadow gradient is a very effective way of organizing order. The color organization order is only valid in the center of the field of vision, and there is almost no color sensing cell around the field of vision, this makes it difficult to generate a sense of overall stability. Think about how hard it would be to recognize the world around us if we only have a color texture shape without a shadow gradient. ios is opposed to imitation of physical objects, such as texture features, which are not related to visual psychology, not equal to flat ~ In addition, there is still a lot of potential to be explored in the form of shadow gradient ~

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.