One: Follow the consistent guidelines, establish standards and follow whether the control usage, prompt information, or color, window layout style, follow the unified standard, and do real consistency. This is the benefit of this:
1: User uses to build a precise heart model, after using the interface, switch to another interface can easily speculate various functions, statement understanding does not need to understand
2: Reduce training, support costs, and support personnel will guide the cost.
3: Give the user unified, don't feel confusing, happy, and increase
practice:
The project group has an experience, establishing a UI specification:
· The art provides color-conditioning color scheme to provide an overall color matching
· Interface control programmer, user experience personnel propose reasonable unified control libraries. Reference standard interface usage specification:
The control function follows the industry standard, the Windows platform see "Microsoft User Experience" (there is MSDN, Chinese has translated issuance, the project group must have a)
The control style can be unified in the allowable range to modify its style, hue
Refer to other software advanced operations, extract the functions useful to this project to use, absolutely unproven, with no purpose.
Design Special Operation Controls as needed, the guidelines are: simplified operation, reach a certain functional purpose
· Interface implementation personnel with the purpose of US trade, (if this step is not implemented, it will lead to unsatisfactory work for each other, and will also generate inconsistent confusion). Repeat the above work.
· Establish a rational document "UI standard" describing the above specifications,
· Forced interface designers understand, and as development guidelines,
· SQA staff conduct monitoring developers to follow, and promptly warn developers.
2: (color) Color uses appropriate, compared principles: 1: Unified color adjustment, for software type and user working environment to choose the right tones:
Such as: Safety software, according to industry standards, you can choose yellow, green, green, blue performance, romantic, pastel, color, dark color, make people don't feel tired, etc.
2: If there is no company's series interface, you can consider this aspect, you can consider this aspect, do unity, read system standard color tables with the operating system.
3: Color blind, weak users, even if special colors expressed their focus or special things, should also use special indicators,? Quot ;!, heavy number, and icon, etc.
4: Color scheme also needs to be tested, often due to the displays, graphics card issues, color performance is different for each machine, should be strictly tested, different machines are colored
5: Follow the comparison principle: use dark text on light background, dark background, blue text is easy to identify in white background, and it is not easy to distinguish on red background, because red and blue are not enough The contrary, and the blue and white contrast is very large. Unless special occasions, eliminate the use of contrast to make people have a colorful color. 6: Colors of the entire interface to use different colors
ITOP color table
Specific Standards Reference Artistic Statistics Academic Standards. The construction of the color table is a standard reference for the art in the pattern design, packaging design. For the program interface designer design control, the form coloring plays a chapter.
Three: (resource) A variety of people interacting interfaces, less beautiful mouse cursors, icons, and indicative pictures, basemaps, etc.
1: It also needs to follow the unified rules, including the establishment of the above color table, the establishment step of the icon should also form a standard as much as possible, refer to ITOP OutlookBar Icon Design Standard 2: There is a standard icon style design, a unified composition layout, Have unified tones, contrast, color steps, and picture style
3: The basemap should be integrated into the bottom chart, use light, low comparison, and use less color.
4: Icon, the image should be clearly expressed, follow the common standards, or the user machine is easy to associate into the object, absolutely not allowing the default wonderful pattern.
5: The mouse cursor style is unified, try to use system standards, eliminate repetition, such as one of some software in some software is different.
Such as: "How to create XP icons" http://www.microsoft.com/china/msdn/library/dnwxp/html/winxpicons.asp
Attachment: ITOP Outlook HOWTO.DOC Description ITOP project, OutlookXP style icon manufacturing method
Fourth: (font) The font uses a unified font, and the selection of the font standard is determined according to the operating system type.
Chinese uses standard fonts, "Song", in English, using standard Microsoft Sans Serif without considering special fonts (Lishu, grassbooks, etc., special circumstances can be used to use pictures), ensuring that each user is using it is normal.
The font size is based on the system standard font, such as 8 pounds of the MSS font, the small five words (9 lbs) of the Song (10.5 lbs).
All controls use the size unified font attribute, except for special tips, strengthen the extrail of display
ITOP uses BCB, all controls use Parent Font by default, which is not allowed to be unified.
· Processing of system size font attributes.
The Windows system has a desktop settings, setting large-character properties, many interface designers often have this annoying, follow Microsoft standards, all use relative sizes as the size settings of the control, when switching the size font, relatively no What special problems.
However, since it is often convenient to use the dot matrix as the window design unit, the problem of chaos occurred after changing the big font.
In this case, it should be handled accordingly:
1: The write program is automatically adjusted, and the dot matrix is multiplied by a corresponding ratio.
2: All of the dot matrix is used as a unit, which ignores the adjustment of the system font, which can reduce the trouble of adjusting the big font. This method is used in BCB / DELPHI, but the inevitable result is that the system is not unified.
5: (Text) Text Expressions Information, help document text expressions follow the following guidelines:
1: Mogan, polite, more, please do not use or use less professional terminology, to eliminate the wrong word
2: Fair to trade the usage of the number of semicolons, the prompt information should be segmented,
3: Warning, information, error use of corresponding representation
4: Use a unified language description, such as a shutdown function button, can be described as exiting, returning, closing, should be unified.
5: According to the user's different terms, such as dedicated software, there can be many professional belongings, users are children: This can be intimate and kind, older users should be mature. The standard will be submitted.
Six: (Style) control style, do not use the error control, the control function is to have a design of the same style, if there is no ability to design a set of controls, use standard controls, it is absolutely can't honest, messy, no mistakes, do not use Controls, for example:
Use the Button style to do TTABLE function, take the main menu section to display copyright information,
· Uniform type of control operation mode, such as one control, double-click, can perform some actions, and the same control, double click, but there is no reflection
· One control only does a single function, no reuse
Many people have convenient to write procedures, I like to use a control to do different functions in different situations. These to understand the difficulty of increasing the user, only user familiarity can be understood. E.g
Change the red option, the parameters on the left represent different settings, which may be used in order to save controls or programming, but only skilled users will be used back, this situation is solved:
1: Group, use dual controls.
2: Use the table to give the user a significant visual change
7: (align) control layout, window is not crowded, press function combination control 1: screen can't be crowded
The crowded screen makes it difficult to understand, so it is difficult to use. Test Results (Mayhew, 1992) The overall coverage of the screen should not exceed 40%, and the packet clock coverage should not exceed 62%.
People can't be too crowded, and it can't be too loose.
The entire project uses a unified control spacing, which is consistent by adjusting the form size.
2: Regional arrangement
One line control, the vertical direction, the control spacing is basically consistent
The distance between the lines is the same, and the distance of the form Border should be larger than the line spacing (the spacing is left blank).
When the screen has multiple editing areas, these areas should be organized with visual effects and efficiency.
3: Data alignment should be appropriate
Description text, Chinese version should use Chinese full-corner colon, longitudinally aligned, and right on the colon, as shown. The width of the longitudinal control is as close as possible. And left align.
For example, characters such as the amount should be aligned according to the decimal point, or right.
4: Effective combination
The logically associated control should be combined to indicate its correlation, but in turn, any unwanted item should be in style, between the project collection, groups, or use the box divided into the respective regions.
For example: the following interface, select the search mode to determine the number range to indicate the scope of the calling number or the scope of the called number, and the accounting method is independent.
Then you should modify: Search and accounting mode. To prevent the user to misunderstand.
5: When the window is zoomed, the control position, the layout:
In order to make the interface do not have a run version or a ugly situation, the solution:
1: The fixed window size is not allowed to change the size, 2: Change the size of the window, do the control position when OnSize, the corresponding changes in the size.
In the VCL of BCB / DELPHI, most of the controls have layout properties:
Some controls have an Alignment property, which can be used to make layout adjustments: TCUSTompanel, TMEMO, etc., the proximity to the right and full (client) attribute, used to automatically adjust according to the layout.
Most of the controls are attribute ANCHORS, with left and right Akleft, Aktop, etc. if True, indicating whether the distance relative to each edge is changed. This can be further designed. 8: (Tab Order) Tab sequence habitual usage, reading order, from left to right, from top to bottom
The TAB button activation order in the form is activated, Taborder ,. BCB / DELPHI Using Form Design Right-click Menu Select Taborder Settings, VCs RES Edit Area Using Ctrl D
Nine: (Shortcutkey & Accelerator & Popmenu) Shortcut, Accelerator and Popup Menu · Shortcut:
1: The global shortcut menu describes the Ctrl XXX into the help list.
2: Shortcuts write help, special instructions, and emphasize the use during training
· Accelerator:
1: Use a non-destructive default button, enter the correct use of a form, with a default accelerator, if the carriageway is activated to the DEFAULT, if the carriageway is activated, and the ESC represents the closing window.
When calling the DEFAULT button action and closing actions, there should be no destructive operations, avoiding user error operations to generate a hazard, such as a button that deletes data such as deletions as the default button. When the user wants to submit a lot of data, it should block the ESC, or do an exit prompt to warn whether the user saves the submission.
2: Received action controls must have acceleration keys, unified acceleration key description (& A)
To use the keyboard, the operational control should have acceleration keys, accelerate the key to define guidelines, the first letter for English words, if the same form is repeated, use the second letter, so on, the acceleration method is Alt this acceleration Key, use unified methods to identify in the interface, such as XXX (a) or WPS A.XXX English can identify Underline Cancel directly under the letter,
The shortcuts are displayed in the Label described in the Edit to display the EDIT, which cannot display shortcut keys like Button.
· Popup menu
The auxiliary menu must have a corresponding button or menu option on the visual interface.
Since the auxiliary menu is displayed by the user or other actions can be displayed to the user. The corresponding option should be available, so the corresponding option should be obtained, such as a button, such as the corresponding control or the corresponding control or the button that pops up on the interface or the like.
Ten: (Action) User Interaction 1: Disable not Not visible
To make a function sometimes allow the user to be used, the control cannot be hidden, and the disable property should be used to use the disable property to prevent the user to discover the control of the control.
2: The window pop-up position should be obvious
Click on a control, pop up the window or menu, you should make a clear prompt, the minimum requirement is to cover the position just click, so that the user easily jumps to the new interface.
3: Execute action to prompt
While writing a visual feeling, when writing a program, you should pay attention to the user's interaction, UI as a tool for human-computer dialogue, users do any action, should give the user a visual or auditory, tactile tips. And this prompt should be obvious, but it should not be prompted too long, and there can be the following methods:
When the user clicks the button and other actions:
1: Pop up the interactive dialog to let the user click confirmation.
2: Change the Control Parameter Tip in the UI: (Processing the prompts that do not confirm the user, there is a delay, or the user is automatically cleared.)
Such as: change the title bar string, display "Information: Submit Success", or set a status bar, TLABLE, etc. to be prompted. 3: Hearing Tips:
When it is determined that there is a sound card, the user can send a special sound prompt when he hears the sound. Generally, it is an aid for important tips. The sound should not be too long, the emergency error prompt should be short, the frequency is high, the success prompt should be soothing and easy. and many more……
11: (HELP) online help: When is it to help, when do you want to help?
1: System default, industry standard control operations do not need to be described one by one, just need to describe 2: Special operations, special function interfaces, directly connected to the corresponding HELP files directly on the interface
3: Special settings detail, should be explained in the interface, or use Tiptool, and by the second step
Help documentation:
Structured, divided according to function module
What method must be explained in software
Help files are helping users better use software, wording should be proper, simple, and easy to understand, every sentence should be purposeful, help users solve problems
Help files are not advertisements, business software is not allowed to advertise. Description Company Information The purpose is to facilitate users to find after-sales support, URL connection, mailbox address, and telephone numbers in the case of no way.
12: Time to clarify the rules to explain the unified things, and is typically described, put it in the HELP and User Manual, and add a glossary
Appendix: When will the universities participate in:
The beauty work is the main personnel of the world, not only has artistic design, packaging design talents, but also wear the entire project, and puts forward system reference for interface program designers.
1: Software design, artists participate in demand, analyze the disadvantages of similar software interfaces, propose the main tone, typical interface style, and ideas throughout the art pack.
2: In the interface prototype design, the developer is revised, discusses the final performance style, and establishs the UI standard.
3: During the development process, provide standard style resource files (icon, Cur, BMP, etc.), and summarize the design process of unified style resources, forming a standard document *.
4: In terms of productization, assist in making help documents, website style, and participating in production, making attached propaganda pictures, animations, product packaging, posters, etc.
