Some tips on interface design

Recently do the project some busy, busy schedule teacher let me to the new students to talk about the interface Design knowledge O (╯-╰) O (because they will be small to get some ps poke me), this embarrassed to say what good? Occasionally saw Liu Yongyong predecessors translated this article, but found that the predecessor after the 40th has not translated. I plan on the basis of the predecessors of the translation of the remainder of the rest of the translation (my English is not particularly good, so the vague translation), one to deepen their understanding of the design, and secondly can also share this article with friends. To be a qualified programmer, we should have some of our own understanding of the design, so that we can bigger picture more broad.

1 try to use single column instead of multiple columns layout

A single-column layout gives you better control of the overall situation. At the same time users can also at a glance content. More than one column will have the risk of distracting your users so that your main thrust is not very well expressed. The best thing to do is to use a logical narrative to guide the user and give you an action button at the end of the text.

2 Releasing gifts is often more attractive

To give the user a beautiful small gift such a friendly move is no better. In particular, the delivery of gifts is also an effective strategy to obtain customer loyalty, which is based on the principle of reciprocity of people. The benefits of doing so are also obvious, and will make it easier for you to get ahead of the event (whether it's a promotion, product update, or another activity).

3 merging repetitive features to make the interface simple

Throughout the development of the product we will intentionally or unintentionally create many modules, layouts or elements, and their functions may be some overlap. This situation indicates that the interface has been excessively designed. Be wary of these redundant functional modules, which are useless and degrade computer performance. In addition, the more modules on the interface, the greater the user's learning cost. So please consider refactoring your interface to make it simple enough.

4 customer reviews better than boasting.

Customer praise is an extremely effective means of obtaining project opportunities or improving project conversions. When a prospective customer sees someone else's praise for your service, the opportunity for the project will increase greatly. So try to provide some high-quality evidence that these comments are authentic.

5 frequently show your theme to deepen the impression

Repeated keynote slogans This approach applies to situations where the interface is very long or paging. First of all, you do not want to full screen to brush the same information, this will make life boring. But when the page is long enough, the repetitions show much more natural and not crowded. There is nothing wrong with placing a button at the top of the page and then placing a prominent button at the bottom of the page. This way, when the user arrives at the bottom of the page and thinks about what to do next, the button you provide can get a potential contract or it can be filtered even if the user doesn't need your service.

6 separating the options from the buttons

Comparisons of colors, levels, and modules these visual designs can help the user to use the product well: he always knows the current page and which pages he can go to. To convey such a good interface, you need to distinguish between clickable elements (such as links, buttons), selectable elements (such as a single-selection marquee), and plain text. In the example, I set the element of the click action to blue, and the current element of the selection is black. This appropriate design allows the user to switch between the various modules of the product. But don't design these three elements in a chaotic way.

7 give a recommendation rather than let the user choose

When it comes to displaying many services, it's a good idea to give a heavy recommendation, although the recommended settings don't fit all users. This is a theoretical basis, and some studies have revealed a phenomenon: the more choices you face, the harder it is for users to make decisions. So you can highlight an option to help the user make a choice.

8 The undo operation is given instead of the deterministic operation.

Assuming you've just clicked on a connection or button, the undo operation can make the operation smooth and natural, which is also in line with human instincts. And each time the action to play a confirmation box seems to be questioning the user you understand how this operation will have consequences. I am still more accustomed to assume that the user every time the operation is correct, in fact, only in rare cases will occur in the wrong operation. Therefore, in order to prevent misoperation and the design of the confirmation window is actually not human, the user each operation needs to make meaningless determination. So consider revoking operations in your product to increase user friendliness.

9 point out that the product is suitable for people rather than age

Do you want to make the product popular or is there a precise fit for the crowd? You need to be more precise in product positioning. By constantly understanding the needs and standards of the target customers, you can make the product better to get more opportunities to communicate with customers, and let the customer feel that you are very professional, in this respect is the exclusive provision of quality services. The risk of positioning the product precisely is that it may narrow the scope of the target potential customer and make itself less versatile. But this more professional spirit in turn will win the trust, authority.

10 try to be decisive and not submissive.

You can express your meaning through an indeterminate and trembling voice, and you can express it in a confident way, of course. If your expressions in the interface end with question marks, such as "Maybe", "probably", "interested?" "or" want to try? "Then you can still get a firmer tone." However, there is no absolute, perhaps the appropriate relaxation of the wording so that users have the room for self-thinking is also possible.

11 A sharp contrast between the interfaces makes it easy to distinguish.

It is much better to highlight the main functional area from the interface. There are many ways to make your main slogan eye-catching. Highlighted by contrasting shades of light and shade . Xian the theme by adding effects such as shadow gradients to the elements to give the interface a layered feel. Finally, you can even select a complementary color (such as yellow and purple) on the Hue ring to design your interface to achieve the goal of highlighting the center of gravity. By combining all of this, the resulting interface will make your main intentions clearly distinguishable from other elements of the interface and be presented in a perfect presentation.

12 Specified origin

Identify your region, the services provided, where the product comes from, and also the communication with the customer to introduce a more specific scene with regional characteristics. Point out where the specific comes from, the country, the province and the city, is also a self-introduction or product display is often mentioned. When you do this in the interface design, it makes people feel very friendly. Also indicates that the area will be invisible to improve the reputation of the product, Paula:.

13 Streamlining form content

Life is lazy, in filling out the form is the same truth, no one is willing to fill out a lot of form fields. Each field in the form has the risk of losing the user. Not everyone is quick to type, and typing on a mobile device can be a lot of trouble. Ask yourself if each field is required in your form, and then try to reduce the fields in the form. If you really need a lot of information for users to fill out, try to spread them across different pages and continue to add them after the form has been submitted. Too many fields can easily make the entire form appear bloated, but it is easy to be concise and to put fewer digits.

14 exposure option and do not hide the action

Any drop-down box you use will cause the user to hide the information and require additional action to display it. If this information is necessary throughout the operation, then you'd better show it and do it more clearly. Drop-down boxes are best used in selected dates, provinces and other conventional places. It is best not to make a drop-down form for important options in your program.

15 It's better to make the interface more connected than a straightforward layout.

A bland wording will undoubtedly make users lose interest and continue to read. Yes, a single-column scrolling long page is good, but we should set up some sections appropriately, and be interlocking to increase the interest of the user to keep reading. However, it is important to note that the white space between sections and sections is not too large.

16 Don't put too many links to distract users

In order to meet the needs of a variety of users, it is common practice to put some link links here on the page to link there. If your main purpose is to let users click on the last page of the download button, you need to think twice. Because the user may have clicked on another link to leave the page. So you need to be aware of the number of links in the page, preferably to be used for navigation and the link used for the operation is separated from the style area. Trying to remove unwanted links from the page will let the user click on your function button.

17 present the State or progress of the operation

Today, most of the interface has shown a variety of styles of progress bars or icons indicating the status, such as the message has been read or unread status, e-bill payment or unpaid status. It is necessary for the user to present such a state on the interface. This allows the user to know if certain operations were successful and what to do next.

18 Do not let users feel that they are completing the task

Imagine that there are two buttons on the interface: one is "get discount" and the other is "register Now". I bet most people will click on the first one, because the second button doesn't make you feel profitable, and "sign up" reminds you of a form that you can't fill out. This means that the button that makes the user feel profitable is more likely to be clicked. This text message that makes the user feel good can also be placed next to the button, not necessarily as the caption of the button. Of course, the normal button is still useful, usually for repetitive operations frequently place.

19 make the operation intuitive instead of being unable to find context

Needless to say, working directly on elements is a more intuitive and straightforward way. For example, in a list, we want the user to manipulate each entry so that the button is placed on the current item instead of being placed outside the list. Another example is to click on the element directly into the editing state (such as the page's address information can be edited after the click). This method is more convenient than the traditional selection and then clicking on the corresponding button to operate. Of course, there is no need for the general operation itself to have any context, there is no need to do so, such as the progress on the page, the reverse button.

20 try to display all content without additional pages

It is better to give the form directly on a widescreen screen that is large enough, which is much better than clicking the button and then ejecting the form. The first step is to reduce the clicks, and the process becomes concise and time-saving. Second, the direct presentation of the form can let the user know how long the form, in fact, is also telling users to register to spend not much time. Of course, this rule is suitable for a very simple case of registering a form.

21 Let the interface smooth display instead of rigidly rendered

During the operation of the user, the elements on the interface will often appear, hide, open, close, zoom out and shift. To add some natural animation to these elements, the fade effect is not only beautiful, but also more in line with the actual, the original element size position change is a need for time animation process. But be careful not to set the animation time too long, that will make the user want to complete the operation as soon as possible impatient.

22 progressive booting instead of directly registering your users

Instead of letting users register right away, why not let the user do some experiential work first. This experience process can show the function of the program, features and so on. Once the user understands the value of the program through a few simple steps, it is more likely to fill out the registration form. This kind of gradual guidance can postpone the user registration time as far as possible, but also can let the user do not register the situation to personalize to set up and so on simple operation.

23 Too many borders will make the interface fragmented

Too many borders are distracting. Needless to say, borders do play a big role in partitioning areas, but at the same time their obvious lines attract the attention of the user. In order to achieve the purpose of dividing the sections without diverting the attention of the user, the elements of different areas on the interface can be grouped by whitespace, using different background colors, unifying the text alignment, and setting different styles for different regions. When using WYSIWYG interface design tools, we often easily drag out a lot of chunks on the interface, and these chunks will appear cluttered. So we're going to put some lines around. A better way to do this is to align the blocks vertically so that the unwanted lines do not disturb the vision.

24 demonstrate the benefits of the product without listing the product features

The market is like this, users are always concerned about their own interests and product characteristics for them is not so important. Only the benefits are more intuitive to reflect the value of the use of the product. Chris Guillebeau, in his book "$ 100", points out that people care more about love, money, identity and free time than in the future of stress, conflict, annoyance and the unknown. So I believe that it is necessary to return to the benefits when displaying the features of the product.

25 Consideration of zero data

The interface often needs to present different amounts of data, from 0,1,10,100 to 10000+. There is a common problem here: How to display the interface before the 0 data that is used at the beginning of the program is over to the data. This is where we are often overlooked. When the program initially has no data, the user sees a blank space, and the user may not know what to do. Using the initial interface without data allows the user to learn and become familiar with how to use the program to create data in the program. Perfection is always our goal, interface design is no exception.

26 The user is introduced by default

Make the interface Default user select the product you want to use, which means that if the user really needs to use it, you can click OK directly without the need for an extra click. Of course, there is another way is not to select the default service, users can manually click. The former is a better design for two reasons. One is that the user does not need an additional point of selection, very convenient, because the default settings for users need our products or services. The second is that this approach is in some way recommending products to the user, suggesting that others have chosen us. Of course, the design of the interface as the default choice of how many points of contention, a bit of forcing users to feel. If you want to be moral, you can either make the user's choice of text ambiguous, or use double negative such a less straightforward description, both ways can make users feel less strong feeling is forced to choose to use the product.

27 interface design is consistent, do not increase the user's learning costs

Since the launch of a series of works by Donald Norman, maintaining consistency as much as possible in the interface design has become a universally adhered guideline. Maintaining consistency in the design reduces the user's learning costs, and users do not need to learn new actions. When we click on a button, or drag and drop, we expect that the operation will be consistent across the entire program's interface, resulting in similar results. Instead we need to re-learn the outcome of a particular operation in a new context. It is possible to work in many ways to achieve a consistent interface, including color, direction, element representation, position, size, shape, etc. But before making the interface consistent, it is advisable to remember that it is appropriate to break the overall consistency. This occasional inconsistency is designed to be a big part of what you need to emphasize. So there is no absolute, we should abide by consistent design guidelines, but to break this routine properly.

28 using a more appropriate default value will reduce the operation

Proper default values and pre-populated form fields can reduce the user's workload a lot. This is a very common practice that can help users fill out forms or register information quickly, in order to save valuable time for users.

29 follow some conventions rather than redesign them

The compliance guidelines in interface design are similar to the previous interface conformance guidelines. If we comply with some of the interface design conventions, users will be very convenient. Conversely, inconsistent and non-compliant designs can increase learning costs. With these conventions in interface design, we don't want to know that the fork in the upper right corner of the interface (in most cases) is closed by the program, or we can predict what will happen when we click a button. Of course, conventions are obsolete, and as time goes by, the same operations may be given new meanings. Keep in mind, however, that when you break these routines in the interface, you must have a clear purpose and a good starting point.

30 make users feel that they can avoid losing rather than getting

We like success, no one wants to fail. According to the reliable conclusions of psychology, people are generally more inclined to avoid losing what they have and not gain new benefits. This conclusion also applies to the design and promotion of products. Try to demonstrate that your product will help the customer to maintain his or her health, social status and so on to tell the customer that the product will bring something that he has not. Like an insurance company, is it a large amount of compensation that can be obtained after we have an accident or is it an emphasis that can help us avoid losing possessions?

31 graphical presentation with levels better than straightforward text descriptions

Hierarchical design distinguishes the important parts of the interface from the non-minor ones. To make the interface hierarchical, can be in these aspects of the fuss: alignment, spacing, color, indentation, font size, element size and so on. When all of these adjustments are applied properly, the readability of the entire interface can be improved. Compared to a very straightforward interface on the user can glance from the bottom of the design, such a clear design can also let users slow down to read slowly. This also makes the interface more distinctive. Like a trip, you can quickly reach the scenic area by high-speed rail (from the top of the page to the bottom), but you can also slow down to enjoy the scenery along the way. So the hierarchical design allows the eye to have a place to stay, rather than a blank monotonous screen.

32 will have associated functions grouped instead of disorganized

Merging individual feature items together can improve the usability of the program. People with a bit of common sense know that knives and forks, or open files and close files are put together. It is also logical to put together elements of similar function, which are in accordance with our usual cognition.

33 using inline validation messages instead of submitting and then verifying

When working on a form, it is a good idea to immediately detect if the user is filling in the required content and then give a validation message. Such errors can be corrected as soon as they occur. Conversely, checking the form after submission gives an error message that will make the user feel weak and repeat the previous work.

34 Relaxation of user input requirements

To the user input data, as far as possible to relax restrictions, including the format, the case of what. This can be a bit more user-friendly and makes the interface even friendlier. An example of a time when the user entered the phone number, the user has a lot of input methods, with parentheses, with dashes, with spaces, with area code and no area code, and so on. If you're dealing with these formatting problems in your code, it's only a matter of writing a few more lines of code, but you can reduce the workload of countless users.

35 make users feel the need to respond quickly instead of having no time concept

An appropriate sense of urgency is an effective tactic that allows users to make immediate decisions instead of waiting for the last 10 days and half a month. The important thing is that this tactic is a proven one, as it implies a shortage of resources or limited time for activities, which can be bought today, but may not be so cheap tomorrow. On the other hand, this tactic also makes users feel that they will miss a good opportunity, once again, the use of people afraid of the loss of nature. Of course, this tactic will be sniffed at by some people, think it is not upright practice. However, it is only a tactic, and it is harmless to apply it if it is to remain legitimate. So please do not create a compelling illusion on the interface for marketing purposes.

36 Using Hunger Marketing

It is expensive to dilute the goods. Hunger Marketing gives the information is not much, only a few, tomorrow again, may be gone. You have to compare the wholesale and the limited edition of the things they are the price gap of how much to know. Looking back, those wholesalers or big retailers are also using hunger marketing to get better sales. But in the software industry, we often forget about hunger marketing. Because digital products can be easily copied copy, there is no shortage of cases. In fact, in the interface design, it can also be used to connect with the real resource shortage . Think about the tickets for an online seminar and think about the number of people you can service in one months, which can tell you that the user is limited.

37 Let the user choose instead of re-fill

The classic rule in this interface design is psychological, and it's easier to recognize something from a pile of things than to get someone to think about something. Identifying one thing only requires a little bit of recollection, and it can be done with some clues. In retrospect, we need to search our brains in full. Maybe that's why the choice question on the test paper is faster than the simple answer. So try to display some of the information that users have previously involved in the interface to make their choices, rather than having them do it for half a day and then filling them out.

38 make it easier to click

Like links, the form's input box and buttons, and so on, if the size is larger, it is easier to click. According to Fett's law, it takes time to click on a peripheral such as a mouse, especially if the element is small. In view of this, it is best to put your form input box, button and so on bigger point. Or you can keep the original design unchanged, just increase the element clickable area (i.e. hot zone). A typical example of this is a text link on a mobile device and a navigation menu, where the text is not necessarily large but the background is stretched, and clicks are valid across a wide range.

39 optimize page loading speed, do not let users wait too long

Speed is important. The speed of page loading and the responsiveness of the UI to operations are directly related to the user's patience to continue waiting. There is no doubt that every second of the wait will lose some users or project opportunities. A good solution, of course, is to optimize your pages and pictures . In addition, psychology can be used to make this wait time appear not so long. In particular, there are two tricks. One is to show the progress bar, and the other is to show other relevant or interesting things to attract the attention of the user (it's better to walk along the carousel than to stare at a position in the same place).

40 shortcut keys are essential in addition to buttons

When your program is widely circulated, you should consider the feelings of advanced users. People are always trying to find a quicker way to do something repetitive, and shortcut keys come into being. Compared to the point on the interface points to go, shortcut keys undoubtedly greatly improve work efficiency. A good example of this is the J (backward) K (forward) shortcut key combinations that are now prevalent in various mainstream programs, such as in Gmail,twitter and Tumblr. The button is good, but the shortcut key will be icing on the cake.

41 Use contrast instead of the price

There is a cognitive bias against comparison, as Kahneman observes, and comparisons are an irresistible prejudice. It shows that our decisions are affected by the first batch of our attention. When we start with a bigger number and roll down to a smaller price, suddenly the price doesn't feel that big anymore. A common example of how marketers take advantage of anchoring effects is to display the manufacturer's suggested retail price and then the lower prices.

42 Add-ons do not leave blank

Add-ons do not leave White to retain more customers. Stephen Anderson marks this similar pattern as "complete" in "mental Notes", and more formally, it can also be called the "target gradient effect". Either way, make people progress or feel they are progressing.

43 Progressive Guidance

Progressively guides the user to avoid too much irrelevant information. This is a pattern, usually in the form of context, where this benefit is obvious. In general, progressive gradual revelation is accompanied by some form of inline expansion or slide-out animations.

44 scoping According to actual scenario

such as dating sites, to match hobbies, ideas, will not say one to find the other half, so its scope is small and large; In the context of pricing, when we ask customers to pay a series of monthly fees rather than annual costs, the policies that lower upfront commitments may also show "no Contract" messages, To make customers feel they can leave at any time, further reducing entry threshold. Therefore, the scope should be determined according to the actual situation.

45 Use inline hints or slide-out methods instead of a bullet box

It can be a good thing to grab the user's attention, but the frame is often accompanied by some nasty questions. First, the box can prevent the user from performing other functions, and for some users, they may be difficult to exit, and the dialog box will fail. Finally, if someone is in the depths of their mission and is not ready to take other action, the modal may hinder the interruption. Why not consider a more subtle inline or slide-out approach, which may not be too abrupt to capture people's attention?

46 Multi-function control and multi-component combination

Simplicity is often important in design because it is somewhat related to ease of use. Too many messy parts will be ignored in our limited attention. We can do this by pressing two or more functions into it in one control. For example, we can combine the search input field with the filtering mechanism that affects the list on the right when you type. This eliminates the need for additional filters. We can also combine the rank display and the rated function to further avoid additional components. But there are shortcomings in the multi-function doctrine. Although it has been simplified, it is at the expense of being discoverable. And so we use it wisely.

47 use ' icon + tag ' format instead of open explanation

Icons can be open explanations, and they can eliminate some ambiguity with the word. Take the down arrow icon for example. Does it mean moving something, lowering its priority or downloading? Or does the "X" icon mean delete, disable, or close? There is not much time for people to learn the meaning of icons. To make the icons easier to understand, you can use text labels to augment them. If space is really a problem, some user interfaces are resolved by displaying all of their icon labels on a single hover (more than hovering over each individual icon to display the label).

48 use natural language instead of boring input

Natural language is a more informal and conversational style of interaction. This style is often associated with computers that understand (or seem to understand) human beings. Make human-machine interaction more friendly.

49 Create curiosity for the user

Stirring curiosity is a conversion strategy that drives the desire for something by providing some suggestive information. It can be a sample chapter, demo, experiment, or some free genuine content, the effect is like "to see the rest, do XYZ".

50 Give a guarantee

In the guarantee, tell your customers they will be satisfied, tell them the payment is safe, is the shipping cost is free, everything is fine. Don't worry, communicate positive thoughts to the user as a conversion strategy.

51 Manufacturing Price Illusion

You can get people to judge the value of your product completely independently, or you can help them do it. If you decide to take advantage of human irrationality, you can display the price in a way that makes your product considered more valuable. In the simplest way, you can start with a frame word next to the price, such as "only", "affordable" or "tip". Prices can also be broken down into per-unit prices (for example: 30 cents per page, not $30 for a book, or $1 per day, rather than a monthly $30 membership). In addition, you can use the "9" end rather than the infamous price of the French horn. Finally, the price can show fewer digits (and not a 30, not 30.00) extra illusion effect.

52 Thanks to user UI for further action

Thanks to the user can make you, your business, product or user interface feel more humanized, because it shows you care. Thanks of course it happens during the completion of a certain task and is more than just simple feedback. More importantly, the interface of gratitude can be used as a way to induce further dialogue or action.

53 Give an intuitive number

Suppose some applications show that the credits in the available pool have been exhausted. It may be more meaningful for the user to calculate the number of days remaining before the application stops running. Or is it a simpler and more popular example when we try to understand what new or old multiline data really is. In this case, the relative timestamp of "3 minutes ago" has more meaning and is less understood than the absolute value between "9:2 4:37". Take out the pain of having to do math.

54 reaffirm liberty, and not imply it

When their choice or free will is clearly reaffirmed, people may be persuaded to act more. Some research has been done on "but you are free," where the effects of behavior are sometimes even doubled. The idea is to make an action or decision, and then a simple statement that suggests "this is your choice", or "you can choose to reject" and so on. Such persuasion seems to be the strongest.

55 variable rewards instead of predictability

Variable rewards are a great way to attract users. This hardening schedule has the highest reaction rate in the shortest time when we throw the pill in an unpredictable manner (because sometimes it does not spit out anything). Then, consider how addictive email checks are because we never really know what these "rewards" really appear (assuming you're not just getting the same old email from Joe every day).

56 capture the user's attention by booting

Capture the user's attention by booting this can be achieved in many ways, starting with a more obvious size increase or higher contrast of the component. Other ways to guide attention include using irregular shapes, field autofocus, section highlighting, sticky element interaction (floating), and directional arrows.

57 Friendly permutations For comparison

The user interface sometimes requires us to compare product features, which directly affects ease of use. There are many ways to make this comparison easier to understand and thus help users make smoother decisions. First, limiting the number of things or attributes that are compared at any given time is an easy way to mitigate confusion. Second, the interval attribute should be useful for comparison, rather than mixing various properties into a single column. Third, users are required to make a single decision (rather than using threads or multiple decisions at the same time) to eliminate additional cognitive friction. Overall, the purpose of the table should be to show the difference between the most relevant attributes and to help make a single decision.

58 set up a collection instead of a standalone project

People have motives to collect things. Whether physical or virtual, see a closed set of things to build a goal of struggle. Usually getting a complete set can get additional benefits (cake is bigger and better than its single ingredient) to further motivate. Finally, if the number of known items is limited (coverage scarce), the motivation for collecting the complete set may be stronger.

59 Setting expectations

This is good when people set expectations on each other. When the next task is completed, the person or interface does not need to spend too much effort to notify someone. You are in the 1th step of X. Your choice will result in Y. You will receive something before Z. All these small promises not only inform, but also build trust. On the other hand, useless interfaces can be cooled when the user does not.

60 humor instead of seriousness

Humor can build a stronger interpersonal relationship between you and your users/clients.

60 Provide feedback and interact

When we perform an action or task, we want to know that it has been successfully completed. Feedback provides this closure for any operation. It can be as subtle as dropping dry ink on a piece of paper, or as a passivation of a conversation message, confirming that an email has been sent. On the other hand, silence creates uncertainty. Does it really work? Did I click to succeed? Do you really want to press the button? Should I try it again? Feedback to answer all these questions. This is a very valuable and necessary element for any successful interaction.

62 events (clicks) Meet user expectations

"Yes, that's exactly what I'm looking for" the feeling can be brought in by some form of intention that the user expects. Having a user interface that correctly guesses the user should bring more smiles and dollars (or at least less frown). As an example, Amazon has implemented this in the micro-interactivity level, their mega drop-down menu.  The menu basically detects the intention of the correct submenu, using some interesting geometric shapes and front-end engineering to display. However, the intent of detecting the user is to balance the action, which can be easier with simpler and more scripted interactions. For more advanced intent detection, the game field is still open, which may require stronger AI.

63 elements extra padding, not too crowded

Whitespace can make content and/or data more readable. When a component is slightly separated from each component, they begin to be allowed to perceive individually . This is good for lists, tables, paragraphs, or any set of elements on the screen. A common way to apply white space is to add extra padding around your project. On the other hand, if there is not enough padding, the element begins to blur to an indistinguishable whole. Padding is useful for readability.

64 try to tell a story instead of just listing the facts.

Storytelling is the oldest form of communication that can be used for applications and various UI interactions. The information listed can be used as a narrative instead of a bulleted form, and a basic story will have some simple elements, such as a setting, an intentional character, and some problematic situations that can be written around the corner. The story is actually met by making it feel as if the writing experience, triggering more emotional reactions. As a result, stories can also become more memorable. Long sales letters are directly applied to narrative, which may be the reason why they are still valid today.

65 emphasis on authenticity

Most people can sniff out a liar a mile away. Being realistic can help your product or screen become more believable. A commonly suspected source of the field is product reviews. Mix good and bad reviews, not just shiny ones. Then, having a precise non-rounding number can also be perceived as more believable.

66 try to gradually reduce rather than static

When a user learns to use your interface or application for a period of time, gradually reducing some of the modules makes core functionality easier to operate. For example, when responding to other content, some of the boarding-related calls to actions can be moved farther. Or, the icon label may become hidden, because the icon's meaning becomes understandable.

67 Don't be self-centered

It is not a new idea to put the interests of others in front of you and to build social influence. Almost a century ago, Dale Carnegie's "How to win friends and influence people" to interpret "I" to "you" as "listening". It has been observed in social experiments that putting others first is a powerful source of additional credibility. Sometimes, seeing and telling things from other people's perspective, even if it does not immediately benefit, can actually lead to constructive action that is beneficial to both sides.

68 Explanatory Notes

Some things may be obvious to us and may not be so obvious to others. form fields can be a typical example of their open nature. This is where the explanations, descriptions and hints are. Using context to explain uncertainty can be removed in many ways through communication: The reason for asking for information, an example of an acceptable input, a requirement, or where to find the requested information. However, when using such context descriptions, it is important to remember that they are not used as placeholder text in the form field itself.

69 try a concise copy instead of using unnecessary words.

Use simpler and fewer words to achieve your goals by writing shorter sentences. After you finish writing your first draft, see if you can compress it. Displaying the core information will convey your intentions so that users will not lose patience. Here are 5 simple hints for more rigorous writing, while avoiding passive sounds and meaningless words.

70 responsive layouts instead of static layouts

There is nothing worse than a double scroll bar in the world. Seriously, it levies taxes like a cognitive way, such as looking at a map through a keyhole. Some of these strange situations may be caused by unintentional static layout, such as seeing the UI on a smaller device. Of course, one way to do this is to use the response layout to automatically adjust the various screen shapes and sizes

71 visual clarity, not ambiguity

"All meanings are in the context of polarity," Dondis wrote in the "Introduction to Visual Literacy". We come to understand the darkness in the background of light, belonging to the isolated context, order in the disordered context, large in the small context. Take positions in such polarities and articulate them clearly through visual language to help people understand their intentions. The most destructive of meaning is fuzziness. When things are a little different, but not really, it causes confusion, which is why it is best to have objects grouped together (or to separate them farther), use more diverse font sizes (or make them exactly the same), and use more diverse shades (or make them exactly the same).

72 leave room for correction to the UI

People, interfaces or your business can make mistakes. Allowing the correction to occur in this case will relieve the pain that has to start again. Perhaps a user has logged in with his friend's account (for better or worse) and wants to re-verify. Maybe users change their minds not to order 8, but 7 oranges? Perhaps the user's shipping address was changed last month and needs to be changed. The UI should allow the user to make such subtle corrections-which is natural.

73 Social Commitment

Social commitment can be a motivation for self-motivation, so to speak. We tend to like a consistent self-image. In this regard, some form of public or social commitment has been made and we are beginning to take responsibility. This has even been shown to be effective in the context of weight loss. Therefore, when we tell people that we will do something (or take a publicly visible action), we will have a higher chance in the future to actually take concerted action.

74 provide opportunities for re-operation

Sometimes, things just don't work in the process, and users may want to try again. Maybe the file upload failed, or we want to reprint another version of the document without making any changes or corrections. The UI can make such redo and retry super easy or difficult. When the outcome of an action is unsatisfactory and there is no way to try again, stress (and lost conversions) will surely follow.

75 don't offer too many choices

More choices to make decision making more difficult. More interestingly, with more choices, our satisfaction decreases as expectations, regrets and remorse increase.

Spent two nights to organize this article, I hope you like, one another.

Original address: Good UI http://goodui.org, also in the update.

Some tips on interface design