User interface Design Style description (turn)

User interface Design Style description (dotnet China Network Technology Forum)

1 Introduction

1.1 Design Instructions
This document is a description of the system interface design style, and the final interface of user interaction is designed and explained in the detailed design specification.

1.2 Concepts and Definitions
User interface: Also known as Man-machine interface, to achieve communication between the user and the computer to control the computer or the user and the computer data transmission system components.
GUI: A graphical user interface, a visual user interface that uses a graphical interface instead of a body interface.

1.3 User Assumptions
The user who uses this system is defined as: The general usage of the application or the computer has certain understanding, the user wants the interface to conform to windows9x especially OFFICE97 style, has the high request to the usability, the simplicity, has the very strong request to the interface fast interaction (that is, does not want through the command way fast interaction).

2 User Interface Design specifications

2.1 User Interface Design principles
The system adhere to the graphical user interface (GUI) design principles, intuitive interface, transparent to users: User contact with the software after the corresponding function at a glance, do not need how much training can facilitate the use of this application system.
Interface designers should understand that the user in the software is the core of all processing, should not have an application to determine the processing process, so the user interface should be users to control how the application works, how to respond, rather than by the developers at their own volition to the operation of the process to impose the user.
Interface design must be confirmed to complete.

2.2 Interface Consistency
In the interface design should maintain the consistency of the interface. Consistency includes both the use of standard controls and the use of the same information presentation methods, such as ensuring consistency in font, label style, color, terminology, display error information, and so on.
1) Display Information Consistency standard
(1) Label tip: Font is not heavier, song, black, gray or transparent, no borders, right alignment, no colon, general situation is fifth (10th);
(2) Date: Normal font, song body, white background black word, lowered;
(3) Alignment method:
Left-aligned: general text, single digit, date, etc.
Align right: number, time, date, and time.
(4) Resolution of 800*600, enhanced color 16 colors
(5) Font defaults to song, fifth, black
(6) Gray color by default
This information is arranged in a style for reference, in the same application, the presentation of these information is inconsistent, will allow users to distraction, affect the use of the software, so developers should pay attention to the same software in the form of consistency.
2) The principle of rationalization of layout
Attention should be paid to the layout of all controls within a window and the artistry of the information organization, making the user interface aesthetically pleasing.
Press the TAB key in one window to move the focus in the order that the tab order is first from top to bottom and then from left to right. The controls that should be entered first in a screen should be in the tab order, and should be positioned more prominently on the window. The layout aims to be concise, orderly and easy to operate.
3 mouse and keyboard corresponding principle
Should be followed by the principle of the use of the mouse: the application of the function can only use the keyboard should also be completed, that is, the design of the application should also add some necessary buttons and menu items.
However, many mouse operations, such as double-clicking, dragging objects, and so on, and can not simply use the keyboard to simulate can be achieved. For example, in a list box, double-click a mouse to indicate that the item is selected. To do this with the keyboard, you must define a button in the window that represents the selection as an alternative (or otherwise) to implement the double-click function. Also, if you have two data windows in one window, you can drag an item from one data window with the mouse and put it in the other. If you are using only the keyboard, you should set up a copy or Move menu item in the menu.
4) Shortcut keys
Using shortcut keys in a menu item allows users who use the keyboard to operate more quickly, and the use of shortcut keys in western Windows and their applications is mostly consistent. The shortcut keys applied in this system must be semantically consistent on each configuration item.
Transaction-oriented:
ctrl-d Delete
Ctrl-f Looking for
Ctrl-i Insert
Ctrl-n New Record
Ctrl-s Save
Query/LIST:
Ctrl-o
Ctrl-r
Other:
Ctrl-c Copy
Ctrl-h Help
Ctrl-p Printing
Ctrl-v paste
Ctrl-w off
Ctrl-x Shearing
MS Windows retention key:
Ctrl-tab Next window
Ctrl-esc Task List
Ctrl-f4 Close Window
ALT-F4 End Application
Alt-tab Next Application
Enter Default button/Confirm action
ESC Cancel button/Cancel operation
SHIFT-F1 Context-sensitive Help
Other shortcut keys
Other shortcuts use the opening letters of Hanyu Pinyin, which are not commonly used without shortcut keys.

2.3 Wizard (WIZARD) Principles of Use
The processing process for some parts of the application is fixed, the user must enter the operation information in the order specified, and the wizard should be used to make the necessary reference to the user's operation, but the wizard must be used in a fixed process and the processing process should be no less than 3 processing steps.

2.4 System Response Time
The system response time includes two aspects: the time length and the variability of time. User response time should be moderate, system response time is too long, users will feel uneasy and frustrated, and response time is too short sometimes cause users to speed up the operation of the rhythm, resulting in errors. The variability of system response time refers to the deviation from the average response time. Even if the response time is relatively long, low response time variability can also help users establish a stable rhythm. Therefore, in the system response time adhere to the following principles:
Interface design of response time length
0-10 second mouse display to become an hourglass
10-18 seconds by micro-help to show process progress
More than 18 seconds to display the processing window, or show the progress bar
The completion of a lengthy processing should be given a warning message


Variability interface design for response time
The user does not feel not to consider
Users feel a little bit of help providing variability instructions
Easy to be big and time absolute difference Big Show variability hint

2.5 User Assistance facilities
Common help facilities are available in two ways: integrated and additional. The integrated Help facility was initially designed in software, which is contextual, and allows users to directly select topics related to the actions they want to perform. By integrating help facilities, you can shorten the time that users get help, and increase the friendliness of the interface. Additional help facilities are added after the system is built. It is usually a weaker online help than the query capability.
The system provides these two kinds of help facilities, designed and implemented in accordance with the following principles:
1 provides part of the help function when interacting with the system, that is, providing help for the main operation
2 users can access Help via the Help menu, F1 key, and help button (if any)
3 provides three options for help when needed: Another form, micro-help, and reference to a document
4 How the user returns to the normal interactive mode has two choices: Return key and Function key
5 Construction of Help information: layered Help
6 Micro Help provided: provided by the status bar, or prompt text on the control

2.6 Error messages and warnings
Error messages and warnings refer to bad news from the system when a problem occurs, and the system should follow the following guidelines for error messages and warnings:
1 The information is described in terms that the user can understand;
2 information should provide constructive advice on how to recover from errors;
3 The information should indicate that the error may result in those consequences, so that users can check whether or not to help the user to correct;
4 information should be accompanied by visual cues, such as special images, colors or information flashing.
5 information can not be judged by color, that is, in any case can not blame the user

2.7 Command interaction
Because this system user is the Windows user, this system does not provide the command interaction.

2.8 General Interaction principle
This system general interaction follows the following principles:
1 Consistency: Menu selection, data display, and other features should be in a consistent format.
2 Provide meaningful feedback
3 to perform a more destructive action before requiring confirmation
4 allow most operations to be canceled on data entry
5 Reduce the amount of information that must be memorized between actions
6 improve efficiency in dialogue, movement and thinking
7 allow users to be non malicious errors, the system should protect themselves from the destruction of deadly crops
8 according to the function of the classification of action, and according to this arrangement screen layout, the designer should be there to improve the cohesion of the Command and Action organization
9 to provide contextual help mechanisms

2.9 Principle of information display
This system information display follows the following principles:
1 Display only the information related to the current user context environment;
2 Do not use data to surround users, the use of user-friendly information to quickly learn how to express information;
3 The use of consistent markers, standard abbreviations and predictable colors, the display of information should be very clear, users do not have to refer to other sources of information;
4 Produce meaningful error messages, see 2.6;
5 use indentation and text to assist in understanding;
6 separating different types of information using window-separated controls;
7 efficiently use the display space of the display.

2.10 Data Entry Principles
This system data entry follows the following principles:
1 Minimize the number of user input action;
2 Maintain the consistency of information display and data input;
3 interaction should be flexible, the keyboard and mouse input flexibility to provide support;
4 in the context of the current action to make inappropriate commands do not work;
5 allow the user to control the interaction flow, the user can skip unnecessary action, change the order of the desired action (if allowed) and without exiting the system in the case of recovery from the error state;
6 provide help for all input actions, see 2.5;
7) Eliminate redundant input. If possible, provide a default value and never allow information to be automatically retrieved or calculated in the user provider.

3 user interface design changes and additional instructions

3.1 Description of Change
Changes to this user interface design should require the consent of all developers, all developers should be corrected according to the principle of modification and design user interface.

3.2 Additional Instructions
This user interface design should be appended to all developers, and all developers should modify and design the user interface in accordance with the additional principles.

4 other