10 rules of the current popular interface design

A previous collection of articles, sent out to study together

There are three ways to get a popular interface style: multiple forms, single forms, and explorer styles, regardless of that style, the following rules should be taken seriously.

1. Ease of use:

Button name should be easy to understand, use words accurately, screen discard no ambiguous words, to the same interface with other buttons easy to distinguish, can look at the text to know the best. Ideally, the user would be able to understand the functionality of the interface without consulting the help and do the proper operation.

Ease of Use details:

1. Complete the same or similar function of the button with frame frame, commonly used buttons to support shortcuts.
2. The elements that complete the same function or task are placed in a centralized position, reducing the distance of the mouse movement.
3. By function, the interface is divided into local blocks, enclosed by frame frame, and functional description or caption.
4. interface to support the keyboard automatic browsing button function, that is, the TAB key automatically switch function.
5. Controls that should first be entered on the interface and important information should be in the tab order and should be positioned more prominently on the window.
6. The number of controls on the same interface is best not to exceed 10 of overwork, and more than 10 can be considered for display with the paging interface.
7. Paging interface to support the fast switch between pages, commonly used combinations of shortcut keys Ctrl+tab
8. The default button is to support the Enter and select action, which is to automatically perform the default button action when you press ENTER.
9. A writable control should give a description and automatically get focus when it detects an illegal input.
10. The Order of the tabs is always the same as the control order, which is currently prevalent from top to bottom, while the rows are left to right.
11. check boxes and Options boxes are sorted by the high end of the selection probability.
12. check boxes and Options boxes have default options and Support tab selection.
13. Multiple option boxes without a drop-down list box when the number of options is the same.
14. Use a drop-down box instead of the option box when the interface space is small.
15. Fewer options use the option box instead of the Drop-down list box.
16. Professional software to use the relevant terminology, the Universal interface is to promote the use of universal word eye.

2. Normative :

Usually interface design according to the specifications of the Windows interface, that is, "menu bar, toolbar, tool compartment, status bar, scroll bar, right button shortcut menu" Standard format, you can say: the interface to follow the standardization of the higher the degree of ease of use corresponding to the better. Small software generally does not provide a tool compartment.

Normative rules:

1. Common menus need to have command shortcuts.
2. Menus that complete the same or similar functions are separated by horizontal lines and placed in the same position.
3. The icon in front of the menu can visually represent the action to be done.
4. Menu depth generally requires up to three floors.
5. Toolbar requirements can be customized according to the user's requirements.
6. The same or similar features of the toolbar are put together.
7. Every button in the toolbar needs prompt information.
8. The longest length of a toolbar cannot exceed the screen width.
9. The toolbar icons visually represent the actions you want to complete.
10. The system's commonly used toolbars set the default placement location.
11. The toolbar is too long to consider using the tool compartment.
12. Toolbox to have the scalability, by the user's own customized according to demand.
13. The default total width of the toolbox does not exceed 1/5 of the screen width.
14. Status bar to be able to display the user's actual needs of information, commonly used:
    Current operations, System status, user location, user information, prompt information, error messages, and so on, if an operation takes longer, you should also show progress bars and process hints.
15. The length of the scroll bar can be changed in time according to the length or width of the display information to help the user understand the location and percentage of the displayed information.
16. The height of the status bar to place five good words, the width of the scroll bar is slightly narrower than the state bar.
17. Menus and toolbars have clear boundaries; menu requirements are highlighted so that there is still a sense of three-dimensional when the toolbar is removed.
18. Font number 5th is commonly used in menus and status bars. The sidebar is generally wider than the menu, but not too wide, otherwise it looks very uncoordinated.
19. The right key shortcut menu uses the same guidelines as the menu.

3. Help Facilities :

The system should provide a detailed and reliable help document that can be used to find solutions for users when they are confused.

Help facility Rules:

1. The performance descriptions and instructions in the Help document are consistent with system performance. (Our system Help documentation is a confusing description of the system's ancestor period.)
2. When you package a new system, modify it in the Help document where you made the changes.
3. Provides the ability to invoke system help in a timely manner when operating. Common F1.
4. When you invoke help on the interface, you should be able to locate the help location relative to the operation in a timely manner. That is to say help to have immediate pertinence.
5. It is best to provide the currently popular online Help format or HTML Help format.
6. Users can use keywords to search for help in the Help index, and of course they should provide help for the main inscription.
7. If you do not provide a written help document, it is best to have the ability to print help.
8. In the help should provide our technical support way, once the user is difficult to solve oneself can conveniently seek new help way.

4. Rationality :

The intersection of the screen diagonal is where the user looks directly at the top One-fourth, which is the place to attract the attention of the user and takes advantage of these two positions when placing the form.

Reasonable rules:

1. The center position of the parent form or main form should be near the diagonal focus.
2. The subform position should be in the upper-left or center corner of the main form.
3. More than one subform should be offset in turn to the right below to show the title of the form.
4. Important command buttons and the use of more frequent buttons to place the attention on the interface.
5. A button that causes an interface to exit or close incorrectly should not be placed in the easy position. The horizontal start or end with the vertical row is the last easy position.
6. Buttons unrelated to the operation in progress should be masked (Windows is grayed out to use this button).
7. It is necessary to provide confirmation information for operations that may cause data to be unrecoverable, giving the user the opportunity to give up their choice.
8. Illegal input or operation should have enough hints to indicate.
9. There should be a hint to the wrong place in the running process, so that the user can understand the source of the error and avoid waiting indefinitely.
10. A hint, warning, or error description should be clear, clear, and appropriate.