User interface design style description

xiaoxiao2021-03-06  20

1 Introduction

1.1 design description

This document describes the system interface design style, and the final interface of the user interaction is designed and explained in the Detailed Design Manual.

1.2 concept and definition

User interface: Also known as the chant interface, implement communication between users and computers to control the computer or the data transfer between the user and the computer.

GUI: The graphical user interface, a visualization user interface, which uses the graphical interface instead of the body interface.

1.3 users assume

The user who uses the system will be defined as: there is a matter of understanding of the general usage of the application or computer. The user wants the interface to match the Windows 9x, especially the Office97 style. It has a relatively high demand for ease of use, and there is a high demand for the interface. Strong requirements (ie, do not want to quickly interact with commands).

2 User interface design specification

2.1 User Interface Design Principles

This system adheres to the graphical user interface (GUI) design principle, the interface is intuitive, transparent to the user: the user's corresponding functions on the interface after contacting the software, it is convenient to use this application system.

Interface designers should understand that users are the core of all processing, should not have an application to determine the process, so the user interface should control the application how to work, how to respond, not by the developer, should operate according to its own wishes Process is imposed to the user.

The interface design must be confirmed to complete.

2.2 Interface Consistency

The interface should be kept in the interface design. Consistency includes both standard controls, but also refers to the same information method, such as ensuring consistent in terms of font, label style, color, terminology, display error information, etc.

1) Show information consistency standards

(1) Tips: The font is not aggravated, the Song, black, the bottom or transparent, no border, right alignment, no colon, general situation is No. 5 (No. 10);

(2) Date: normal font, Song body, white background, 3-D Lowered

(3) Alignment method:

l Left alignment: general text, single number, date, etc.

l Right alignment: numbers, time, date plus time.

(4) Resolution is 800 * 600, enhanced color 16 colors

(5) The font default is Song, No. 5, black

(6) Bottom default is gray

The arrangement of this information is for reference. In the same application, this information is inconsistent, which will make the user's dispersion, affecting the use of this software, so developers should pay attention to the consistency of performance in the same software .

2) Principle of layout rationalization

It should be noted that the artistic property of all controls and information organizations inside the window makes the user interface aesthetic.

Press the Tab button in one window, move the order of the focus, no messy, the order of Tab is from top to bottom, then from left to right. The first control of the first and important information should be entered in the tab sequence, the position should also be placed on the window. The layout strikes simple, orderly, and easy to operate.

3) Mouse and keyboard correspondence

What should be followed is that the principle of mouse: The functionality in the application should only be completed, that is, the designed application should also be added to the designed buttons and menu items.

However, many mouse operations, such as double-click, drag objects, etc., can not simply use the keyboard to simulate. For example, in a list box, you can double-click one of the items to indicate the content. In order to use the keyboard to implement this function, you must define a selected button in the window to act as an alternate (or other means) that implements double-click function. As another two data windows in one window, you can use the mouse to drag an item from one data window and then put it in another. If you only use the keyboard, you should set a copy or movement menu item in the menu.

4) Shortcut

Using shortcuts in the menu item allows users using the keyboard to operate faster, mostly consistent in the use of shortcut keys in Western Windows and their applications. The shortcuts used in this system must be consistent in semantics on each configuration item.

Business-oriented:

l Ctrl-D Delete

l Ctrl-f looks for

l Ctrl-i insertion

l Ctrl-N new record

l Ctrl-s preserved

Query / list:

l Ctrl-O

l Ctrl-r

other:

l Ctrl-C copy

l Ctrl-h Help

l Ctrl-p printing

l Ctrl-V paste

l Ctrl-W close

l Ctrl-x cut

MS Windows reserved key:

l Ctrl-tab Next window

l CTRL-ESC task list

l CTRL-F4 Close window

l ALT-F4 end application

l Alt-Tab Next application

l Enter Default Button / Confirmation

l ESC cancel button / cancel operation

l Shift-f1 context-related help

Other shortcuts

Other shortcuts use the beginning of Chinese pinyin, and there is no shortcut key that is not commonly used.

2.3 Wizard Usage Principles

For the processing flow of certain parts in the application, the user must enter the operation information in the specified order, in order to use the user's operation to obtain the necessary reference, the user should use the wizard, and it is relaxed when the user uses the function, but the wizard must be used in fixed In the process process, and the processing flow should not be less than 3 processing steps.

2.4 System Response Time

System response time includes two aspects: time length and time variability. The user response time should be appropriate, the system response time is too long, the user will feel uneasy and frustrated, and the response time is sometimes short to make the user speed up the rhythm, resulting in errors. The variability of the system response time refers to the deviation of the average response time. Even if the response time is relatively long, the low response time variability also helps the user build a stable rhythm. Therefore, in terms of system response time, the following principle:

Response time length interface design

0-10 seconds of mouse display as a sand leak

10 to 18 seconds from micro help to display processing progress

13 seconds to display the processing window, or display the progress bar

A long-term processing should be given a warning message

Volatility interface design of response time

Users can't feel not considered

The user feels slightly by micro-help

Easy to be large and the time is absolutely different.

2.5 User Help Facilities

Common help facilities have two types: integrated and attached. The integrated help facility is designed in the software. It is related to the context, and the user can directly select the subject related to the operational operation. By integrating help facilities can shorten the time of users get help, increase the friendliness of the interface. Additional help facilities are added after the system is built. It is usually a relatively weak inquiry ability.

This system provides these two ways to comply with the following principles when designing and implementation:

1) When system interaction, provide some help functions, namely: provide the help of the main operation

2) Users can access help by helping menus, F1 keys, and help buttons (if any)

3) Represents the choice of three ways as needed when helping: Another form, micro-help, and point out for a document

4) How do users return to normal interactions with two options: Return to the keys and function keys

5) Construction of Help Information: Help Help

6) Micro help provide: provided by the status bar, or the prompt text on the control

2.6 Error information and warning

Error information and warning refers to the bad news given by the system when there is a problem, and this system should follow the following principles for error information and warning:

1) Information is described in terms that the user can understand;

2) Information should provide constructive advice from errors;

3) Information should indicate that the error can result in those undue consequences so that users check these situations or help users correct; 4) The information should be accompanied by visually prompts, such as special images, color or information flashing.

5) Information cannot with the judgment color, that is, if you can't accuse the user

2.7 Command Interaction

Since the user is a Windows user, the system does not provide command interaction.

2.8 General interaction principle

This system generally interacts the following principles:

1) Consistency: Menu selection, data display, and other functions should use the consistent format.

2) Provide meaningful feedback

3) Request before performing a large destructive action

4) Allow most of the operations on data entry

5) Reduce the number of information necessary to remember between action

6) Improve efficiency in dialogue, movement, and thinking

7) Allow users to be non-malicious, system should protect themselves from fatal crops

8) Classify the action according to the function and press this screen layout, and the designer should increase the order of the command and action organization.

9) Provide a context-related help mechanism

2.9 Information Display Principles

This system information display follows the principles:

1) Only information related to the current user context environment is displayed;

2) Do not use the data to surround the user, using easy users to quickly absorb the information;

3) Use consistent markers, standard abbreviations, and predictable colors, display information should be very clear, users do not have to refer to other information sources;

4) Generate meaningful error information, see 2.6;

5) Use indent and text to assist in understanding;

6) Use the window separated control to divide different types of information;

7) Efficiently use the display space of the display.

2.10 data input principle

This system data input follows the following principles:

1) minimize the number of user input actions;

2) Maintenance information display and data input consistency;

3) Interaction should be flexible, support the flexibility of the keyboard and mouse input;

4) Do not work in an inappropriate command in the context of current action;

5) Let the user control the interactive flow, the user can skip unnecessary actions, change the order of the required action (if allowed) and recover from the error state without exiting the system;

6) Help for all input movements, see 2.5;

7) Eliminate redundant input. Possibly provide a default value, never let the user provider can automatically obtain or calculate information.

3 User interface design changes and appended instructions

3.1 Change Description

Change this user interface design should be given to all developers' consent, and all developers should modify and design user interfaces according to the correct principles.

3.2 appended note

Adding this user interface should be released to all developers, all developers should modify and design user interfaces as followed.

4 other

no.

转载请注明原文地址:https://www.9cbs.com/read-46824.html

New Post(0)