World-class graphic design master Paul Rand once said: "Design is by no means a simple arrangement, combination and simple re-editing. It should be full of value and meaning, to explain the truth, to eliminate the complex and simplify it, to clarify the deduction, and to Embellish and beautify, praise, make it dramatic, and make people believe what you say..." It can be seen that design is by no means an easy task, and excellent design is even more difficult.
UI Design Principles - Must-haves for Excellent Designers
I accidentally discovered an article on the blog of interface designer Joshua Porter - "Principles of User Interface Design". The article listed the principles of UI design. After reading it, I felt quite inspired. I hope it can be used by designers - especially those who are just getting started. Junior designers provide better learning opportunities. The full text is compiled as follows:
1. Clarity is a priority
Clarity is the first and most important task in interface design. If you want the interface you design to be effective and liked by people, you must first allow users to recognize it? Let users know why they use it? For example, when users use it, they can anticipate what will happen and successfully interact with it. Some interfaces are not designed too clearly. Although they can meet the temporary needs of users, they are not a long-term solution. A clear interface can attract users to use it again and again.
2. The interface exists to facilitate interaction
Interfaces exist to facilitate interaction between users and our world. Excellent interfaces not only allow us to do things efficiently, but also inspire, evoke, and strengthen our connections with the world.
3. Protect and respect user attention
When we read, there are always many things distracting our attention, making it difficult for us to concentrate on reading quietly. Therefore, when designing the interface, it is very important to attract the user's attention, so do not design the area around your application to be messy and distract people's attention. Remember the importance of a clean screen to attract attention. If you must display ads, wait until the user has finished reading. Respecting users' attention will not only make them happier, but your ads will be more effective. Therefore, in order to design a good interface, protecting and respecting the user's attention is a prerequisite.
4. Put the interface in the hands of the user
Humans tend to feel comfortable being in control of themselves and their surroundings. Software that doesn’t take users’ feelings into consideration often takes that comfort away, forcing users into unplanned interactions that can make users uncomfortable. Make sure the interface is under the control of the user, let the user decide the system status, and with a little guidance, I think you will achieve the goal you want.
5. The feeling of direct operation is the best
When we can directly operate objects, the user's feeling is the best, but this is not easy to achieve, because when designing the interface, the icons we add are often not necessary. For example, we use too many buttons, graphics, Options, attachments, and other cumbersome stuff so that we end up manipulating UI elements instead of important things. And the original goal? It is to simplify and be able to be directly manipulated... Therefore, when designing the interface, we must understand as much as possible about some natural human gestures. Ideally, the interface design should be simple, giving users a sense of direct manipulation.
6. Every screen needs a theme
Every screen we design should have a single theme. This not only allows users to use its true value, but also makes it easier to get started, more convenient to use, and easier to modify when necessary. If a screen supports two or more themes, it will immediately make the entire interface look cluttered. Just as an article should have a single theme and a strong argument, so should our interface design, which is the raison d'être of the interface.
7. Don't let the secondary action take the place
While each screen contains one primary action, there can be multiple secondary actions, but try not to overwhelm them! Articles exist for people to read them, not for people to share them on Twitter. Therefore, when designing the interface, try to weaken the visual impact of secondary actions, or display them after the main action is completed.
8. Natural Transitions
The interaction of the interface is all linked together, so when designing, it is necessary to consider the next step of the interaction thoughtfully. Think about what the next interaction is going to look like, and make it happen by design. This is like our daily conversations, providing grounds for in-depth conversations. Don’t overwhelm users when they have completed the steps they need to do, and give them the natural way to continue to achieve their goals.
9. Appearance following function (similar to form following function)
People are most comfortable with behaviors that conform to expectations. We feel on good terms with other people, animals, things, or software when they consistently behave according to our expectations. This is what design for dealing with people should do. In practice, this means that users can tell what action is going to happen next just by looking at it, and if it looks like a button, it should function as a button. Designers should not be clever about basic interaction problems, but be creative about higher-level problems.
10. Focus
If screen elements have different functions, they should also have different appearances. Conversely, if they function the same or are similar, they should look the same. To maintain consistency, junior designers often apply the same visual treatment to elements that should be differentiated, when different visual effects would be appropriate.
11. Strong visual hierarchy
If you want the visual elements of the screen to have a clear browsing order, it should be achieved through a strong sense of visual hierarchy. In other words, if the user browses the same things in the same order every time and the visual hierarchy is not obvious, the user will not know where to focus their eyes, which will only make the user feel confused. In the case of constant design changes, it is difficult to maintain a clear hierarchy because all element hierarchies are relative: if all elements are highlighted, there will be no focus at all. If an element is added that needs to stand out, the designer may need to reconsider the visual weight of each element in order to achieve clear visual hierarchy again. While most people won't notice visual hierarchy, it's the easiest way to enhance your design.
12. Properly organize visual elements to reduce users’ cognitive load
As noted designer John Maeda said in his book "Simplicity", properly organizing visual elements can simplify the complex and help others understand your expression more quickly and easily, such as the inclusion relationship in content. The relationship between elements can be expressed naturally with the organization of orientation and direction. Properly organizing content can reduce the cognitive load for users, and they don't have to think about the relationship between elements, because you have already shown it. Don't force the user to make a distinction, but the designer expresses it with organization. Instead of forcing users to figure things out themselves, designers should directly
13. Color is not the decisive factor
The color of an object changes as the light changes. When the sun is shining brightly and when the sun is setting, the scenery we see will be very different. In other words, color can easily be changed by the environment, so don’t treat color as a decisive factor when designing. Color can be eye-catching and serve as a guide, but it should not be the only element of distinction. When reading for a long time or facing a computer screen for a long time, a relatively dark or soft background color should be used except for the content to be emphasized. Of course, depending on the reader, a bright background color may also be used.
14. Sequential display
Each screen displays only what is necessary. If users need to make a decision, present enough information for them to choose and they will find the details they need on the next screen. Avoid over-explaining or presenting all at once, and if possible, place selections on the next screen to present information step-by-step. This will make your interface interactions clearer.
15. Embedded “Help” option
In an ideal user interface, the "help" option is unnecessary, because the user interface can effectively guide users to learn. Something like "Next Step" is actually "Help" embedded in the context, and only appears in the appropriate location when the user needs it, and is hidden at other times.
The designer's task is not to build a help system where users need it, but to shift the responsibility of discovering user needs to users and let users find answers to their questions in the help system. Rather, you should ensure that users know how to use the interface you provide, so that users can be guided and learn in the interface.
16. Critical moment: zero state
The user's first experience with an interface is very important, and this is often overlooked by designers. In order to better help users quickly adapt to our design, the design should be in a zero state, that is, a state where nothing is happening. But this state is not a blank canvas. It should be able to provide direction and guidance to the user to help them quickly adapt to the design. There will be some friction in the interaction process in the initial state, once the user understands the various rules, there will be a high chance of success.
17. Improve the interface according to existing problems
People always look for solutions to existing problems rather than potential or future problems. So, instead of designing interfaces for hypothetical problems, we should look at existing behaviors and designs to solve existing problems. This is indeed not an exciting thing, but it is the most valuable thing, because once your user interface becomes more complete, more users will be willing to use your interface.
18. Good design is invisible
Good design has an eccentric property that is often overlooked by its users. One reason is that this design is so successful that its users focus on completing their goals and ignore the interface they are facing. After users successfully achieve their goals, they will exit the interface with satisfaction. But as designers, it can be a little unfair that we don't get a lot of flattery when our designs are good. Of course, good designers don't mind this, because they know that satisfied users are often silent.
19. Study in multiple fields and learn from other disciplines
Vision, graphic design, typography, copywriting, information structure and visualization, all these knowledge areas should be included in interface design, and designers should have some knowledge or expertise in these knowledge. Don't look down on this knowledge: there is much to learn from it that will improve your ability to work. Designers need to take the long view and be able to learn from seemingly unrelated disciplines, such as publishing, programming, bookbinding, skateboarding, firefighting, and even karate.
20. The interface must have a purpose
In most design fields, the key to successful interface design is having users use it. For example, if a beautiful chair is beautiful but uncomfortable to sit on, users will not choose to use it, and it is a failed design. Therefore, interface design is not only about designing a usage environment, but also about creating a work of art worth using. It's not enough for an interface design to satisfy the vanity of its designer: it has to be useful!