GUI Design: Allows users to read symbols and meanings quickly and accurately

The realism of GUI design

Original: Realism in UI design

Look at the visual design of the user interface in recent years you will find that "realism style" is gradually becoming mainstream. The computers we use are getting stronger and faster, and designers have more room to play. To add to the details, we've been able to decorate the interface with 3D effects, shadows, transparency, and even some physical features. Some of these effects can significantly improve usability, such as shading to better help users distinguish between active and inactive windows, and the rich but effective animation effects of the iphone system can also significantly reduce user learning costs.

In other respects, however, these new technologies do not necessarily contribute much to usability. The graphical user interface is basically a bunch of symbols, most buttons, icons, and other controls just refer to some concept or idea, such as a gear icon does not mean a gear, he just told you click on the software can be set after clicking. The more details and the higher the realism, the more the user's focus will be left out of these concepts.

It is recommended that you read Scott McCloud's "Understanding Comics", which has nothing to do with the GUI, but every designer will benefit from reading it:D

The leftmost figure is clearly a particular man, and the smiley face on the right can almost refer to anyone. It can be seen from this example that if metaphors are used to express a concept, the visual details must be reduced. In fact, the interface controls we use in the actual situation are generally not meant to refer to a particular object.

Of course, the details can not be too little, to ensure that the necessary recognition is certainly a prerequisite, at least let the user see what this thing:

This is a human face on the left, and it's hard to know if it's an egg or a ball on the right.

Let's take a look at the actual example on the computer, an icon representing the home page:

From left to right, we see a change in the concept of home from a particular house to a broad sense, the more details, the more difficult to understand the concept of its reference

Again, the details are not too small, and the home icon becomes like a ⇧ button after removing the windows and chimneys.