Discussion on flat design in user interface

Flat design in the current user interface design community is very controversial, Microsoft's Metro wind first introduced it to the public, and then a lot of people follow suit, such as Layervault, the Next web and more. Many designers are not optimistic about this kind of design from the beginning, mainly because in a slightly more complex interface, flat design can bring a lot of trouble.

The flat design is both beautiful and fresh, quick to design, and easier to respond to. If only the design trends in painting may be widely accepted, but web designers always have a high degree of attention to ease of use, so always feel that flat design is naturally flawed.

The following picture, from left to right, is the design aesthetics of Apple, Google and Microsoft, with three of them taking very different routes.

The golden mean is the best way to solve complex disputes. Compromise is difficult for people with a clear view, but ultimately it is the public who will benefit. In this case, the benefit of the public is the product of the user.

One way to do that is to take advantage of the flat design and apply it to a highly complex user interface. As for how to do this, you can refer to Google's current interface design language. Gmail (Web+ios), Google Maps iOS and Google + (iOS) are very good examples of flattened designs.

In most cases, these interfaces follow the principle of flat design: flat color blocks, no shading, and the use of color to encourage users to interact (such as the red Button "write mail" in Gmail). But when you look closely, you'll notice that the red button actually has a very small radian. This radian is like, "Hey, come on!" Instead of "Wow, I look like a candy bar!" Oh, you can still order mine. "This kind of subtle functional visibility is one of the most important components of quasi flattening design, and it is a great feature of the flat design that is superior to real."

Quasi-flattened design naturally does not overlook the concept of depth. Conversely, a moderately added element of depth can promote a user's understanding of the interface. But like radians, the integration of depth elements needs to be weighed carefully to allow information to jump out of the plane without damaging the flat design atmosphere.

Quasi-flat design examples are not only Google, the new version of MySpace also used this look flat, but when you move the mouse over there will be "hurry Me" radian. Letterpress, the Master of the game, although some people say that the flat design, but also uses a shadow design to improve the interactive experience. Facebook, which has never been designed in radians from the start, also uses shadows to separate overlays and other pages.

The future of iOS should be further away with the complexity of the proposed physical design, and Microsoft's Metro has a mishap in usability, and the future of the design may be an easy-to-use and efficient design language with a quasi flat design.

User comments:

Black and white: for a large number of tile content, shadow gradient is a very effective way to organize the order, through the color organization order only in the center of Vision effective, the field of vision around almost no color perception of cells, which also determines the difficulty of generating overall stability of the sense of order. Think about the world around us if only the color texture shape, and no shadow gradient will be how difficult to identify, the iOS object seems to be the physical, such as texture features and visual psychology unrelated to the imitation, not equal to flat ~ and shadow gradient form There are many potential to dig it ~

Note: Products in China