| For most people, the user interface is the software itself. Therefore, mastering the skills and technologies of user interface design is the most intuitive factor for software to go to the market. The original Article is from http://www.ambysoft.com/userinterfacedesign.htm. For application software, a basic reality is that the user interface is user-oriented. Users need applications developed by developers to meet their needs and are easy to use. Too many developers think of themselves as artistic talents. They do not try to follow the user interface design standards, or spend their energy to make the product easy to use. On the contrary, they mistakenly think that writing more clever code or using a really interesting color scheme is important. Constantine (1995) states that a good user interface allows people to use applications without reading user manuals or being trained.
There are several reasons for the importance of Interface Design: first, the more intuitive the user interface is, the easier it will be, and the cheaper it will be. The better the interface, the easier it is to train users and reduce Ding's training costs. The better the interface, the fewer users seek help and reduce customer support costs. Secondly, the better the interface, the more users like to use it, enhancing developers' satisfaction. I. skills and technologies for User Interface Design The user interface design skills included in this section will help improve the object-oriented interface design.
L. consistent, consistent, or --. The most important thing you can do is to ensure the consistency of user interface operations. For the list box, if you double-click the items to cause some events, double-click the items in any other list box to have the same event. The positions of all window buttons should be the same, the labels and messages should be the same, and the color scheme should be the same. The consistency of user interfaces enables users to establish precise psychological models for interface operations, thus reducing training and support costs.
2. Establish and follow the standards. The only way to maintain consistency in application software is to establish and follow design standards. The best way is to adopt a set of industry standards to supplement their own special needs. Existing industry standards, such as IBM standards (1993) and Microsoft standards (1995), usually meet the needs of 95% to 99%. Using industry standards, you only need to take advantage of existing results and make your applications look or feel more like other applications you have purchased or created. The User Interface Design Standard (atablet, 1998) should be established at the basic definition construction stage ).
3. clarify the rules. Users need to know how to use the software you developed for them. The consistency of software operations indicates that you only need to explain the rules once. This is much easier than explaining how to use each feature of the application software step by step.
4. Both new and skilled hands are supported. Library directory symbols may be enough for general users of the library system, but for skilled users and book administrators, they may not be so effective. Librarians are specially trained to use complex Query Systems to find information. Therefore, they should consider establishing a query interface to meet their unique needs.
5. It is important to switch between interfaces. If switching from one screen to another is very difficult, the user will soon lose heart and give up. This software makes sense to the user only when the screen flow is consistent with the work flow that the user wants to complete. Because different users work in different ways, application software needs to be flexible enough to support them in different ways. In the modeling phase, the interface flowchart can be used to simulate the process between screens.
6. The layout on the interface is very important. In the West, people are from left to right, reading from top to bottom. Based on people's habits, the screen organization should also be from left to right, from top to bottom. The layout of the screen widgets should also be done in a way familiar to the user.
7. Information and tag wording should be appropriate. The text displayed on the screen is the main information source of the user. If the text is poorly formatted, the user's understanding will be poor. Use complete wording and sentences instead of abbreviations and code to make the text easy to understand. The message should be active, show that the user is under control, and prompt how to use the software correctly. For example, which of the following messages is more attractive: "You entered an error message" or "the account should be 8 digits "? In addition, the message wording should be consistent, and the positions displayed on the screen should be consistent. Although the wording of such messages "names must be entered" and "accounts should be entered" is correct, they are inconsistent. According to the wording of the first message, the better wording of the second message should be "account input", which makes the wording of the two messages consistent.
8. Understand widgets. Using appropriate widgets for proper tasks can first help improve application software consistency, which may make application software easy to construct. The only way to learn how to use widgets correctly is to read and understand the user interface standards and guidelines you adopt.
9. Do not blindly follow other software. Unless you know that an application complies with your user interface standards and guidelines, you cannot determine that it is doing right. Although it is a good idea to look at how people do it and get some ideas from it, you have to be careful before you know How to differentiate the quality of user interface design. Too many developers mistakenly mimic the user interfaces of other application software, but those interfaces are poorly designed.
10. Use appropriate colors. Exercise caution when using the color. If yes, use an indicator. The problem is that some users may be color-blind. If a color is used on the screen to highlight something, if the user wants to notice it, do some other work to highlight it, for example, a symbol is displayed next to it. The colors must be consistent to make the entire application feel the same. In addition, on different platforms, the color performance is unsatisfactory. One system looks good and the other system often looks bad. During the presentation, we often hear the presenter say, "It looks good on the machine in my house ."
11. Follow the comparison principles. We plan to use colors in applications to ensure screen readability. The best way is to follow the comparison principle: Use dark text on a light background and use light text on a dark background. It is easy to read the blue text on the white background, but it is hard to recognize it on the red background. The problem is that there is not enough contrast between blue and red, while there is a great contrast between blue and white.
12. Use appropriate fonts. Vintage English fonts may look good on the cover of Shakespeare's script, but are hard to recognize on the screen. Use readable fonts, such as serif or Times Roman. In addition, the fonts must be consistent. The frugal and effective use of two or three fonts of the screen looks much better than the use of five or six fonts of the screen. Remember to change the font size and style every time (bold, italic, underline ,......) , Style or color, all use different fonts.
13. Gray instead of removal. At some times, users can only access certain functions of the application software. Before deleting an object, you must first select it to deepen the user's psychological model. The software should use the delete button and (or) menu item to do something. Should the button be removed or dimmed? It should not be removed! When the user is not supposed to use it, the user will be able to establish a precise psychological model on how to use the application software. If you only remove a widget or menu item, instead of getting rid of it, it is difficult for users to establish a precise mental model because users only know what is currently available, I don't know what is unavailable.
14. Use a non-destructive default button. A default button is usually defined for each screen. If you press the Enter key, this button is called. The problem is that sometimes you accidentally press the Enter key and the default button is activated. The default button must not be potentially destructive, such as deleting or saving (You may not want to save it at all ).
15. Arrange regions. When the screen has multiple editing areas, You need to organize these areas with visual effects and efficiency. As shown in 1, it is best to edit the left alignment of an area. In other words, make the left boundary of the editing area on a straight line and arrange them up and down. The corresponding label should be right aligned and placed next to the editing area. This is a neat and effective way to organize areas on the screen.
16. Data Alignment should be appropriate. For data in a column, the general practice is to align the right of an integer floating point and the left of the string.
17. The screen cannot be crowded. Crowded screens are hard to understand and therefore difficult to use. The experimental results (Mayhew, 1992) show that the overall screen coverage should not exceed 40%, and the screen coverage in the group should not exceed 62%.
18. Effective combination. Logically associated projects should be combined on the screen to display their associativity. Otherwise, any irrelevant items should be separated. You can also group A project set by interval or use a box.
19. Open the window at the operation focus. When you double-click an object to display its editing/Details screen, the user's attention is also concentrated here. Therefore, it makes sense to open a window here rather than elsewhere.
20. The pop-up menu should not be the only function source. If the main functions are hidden, users cannot learn how to use the software. The most frustrating way for developers is to abuse pop-up menus, also known as context menus. A typical method of using the mouse is to display a hidden pop-up menu and provide access to the specific function of the currently working screen area.
Ii. Prototype establishment and skills (1) build a prototype
A prototype is an iterative analysis technology in which users participate in the creation of an entity model for screens and reports. The purpose of the prototype is to display the possible design of the application user interface. Figure 2 shows the steps for prototype creation.
● Determine user requirements. The development of the prototype depends on the user's needs, and the Demand determines the business objects that the system must support. Requirements can be collected through interviews and in modeling phases (such as CRC class responsibility collaboration diagrams), use cases, and class diagram modeling phases.
● Build a prototype. Use prototype tools or advanced languages to develop screen and reports required by users. The most useful advice at this stage is not to spend a lot of time writing "good" code, because after evaluating the prototype, you are likely to discard the code.
● Evaluate the prototype. Evaluate the prototype of a version after it is created. The main purpose is to verify whether the prototype meets user needs. Three basic results should be identified during the evaluation: Successful prototype, failure, and omission. After evaluating the prototype, you will find that some parts must be discarded, some must be modified, and even new parts must be added.
● Determine whether the process is complete. The prototype creation process can end when there are no new requirements in the evaluation process, or there are only a few irrelevant requirements. (2) prototype building skills and technology
1. Search for realistic objects. A good user interface makes the user experience. Therefore, we should take this as a starting point to determine how users are used in the real world.
2. Actual users work together. The best candidate for prototyping is the actual users who have completed application software development. These people are the biggest beneficiaries of the successful implementation of the system, and they are the most clear about their needs.
3. Set and execute the task. Set a schedule to determine when to evaluate the prototype with the user. In doing so, setting expectations for users and forcing them to do the job well is a win-win situation.
4. Use a prototype tool. Buy a prototype tool that allows you to quickly integrate the screen. Because the code written soon is rarely worth keeping. Even if the code generated by the prototype tool is different from the code type you intend to develop further, you don't have to worry too much about it.
5. user participation. Just like a test run before buying a car, you should try it before developing the application software. In addition, you can quickly determine whether the system meets the requirements by testing the prototype yourself. A good way is to let the user regard the prototype as the actual system and use it through some use cases.
6. Understand the basic business. Before developing a prototype that supports the business, you need to understand the fundamental business. Interview with Major users, read internal documents of business processes, and read documents on how competitors implement them. The more familiar the business, the more likely it is to build a prototype that supports its business.
7. Different prototype levels. Three prototype types of the system can be developed in sequence. A hand-drawn prototype is used to display basic/general functions. A computer prototype is used to display the screen, but does not contain the data to be displayed. Ultimately, it contains the displayed data screen. Starting with simplicity, avoid spending a lot of time on things that are likely to be discarded. As the prototype gradually approaches the Final Solution, its complexity increases in turn. If the prototype is continuously improved, users will have a clearer understanding of how the application software actually works.
8. Do not work on code. At the beginning of the prototype creation process, as you gain a deep understanding of the business, a lot of work can be discarded. Therefore, it makes no sense to spend a lot of energy writing code that is likely not to be retained.
3. Interface Flowchart ● The interface flowchart shows the relationship between the user interface components, screens, and reports of the application software. for users, the user interface is the system itself. Although the user interface prototype often causes developers to get stuck in how the interface actually works, it is only a means to describe the user interface. The User Interface prototype causes the developer to omit the high-level relationship and interaction between the application interface objects (usually the screen. The interface flowchart allows developers to simulate these high-level relationships.
● The interface Flowchart helps developers verify the user interface design diagram. 3 is the interface flowchart of an Order System. A box indicates a user interface object (screen, report, or form), and an arrow indicates a possible process between screens. For example, you can go to the customer query screen or order logon screen through the main menu screen. Once you enter the order logon screen, you can go to the product query screen or the customer order logon screen. The interface flowchart can easily display the high-level profile of the application interface.
As the interface flowchart provides a high-level view of the system interface, developers can quickly understand the system's expected operation process. It provides a view to verify the overall process of the application's user interface. For example, is a screen flow meaningful? Why can't I go to the customer order directory screen from the customer editing screen? Which directory contains all orders made by a customer? In addition, why cannot we get the same directory from the product perspective? In some cases, people are interested in finding out which orders contain a product, especially futures products or products that are not available. The interface flow chart can also be used to determine the consistency of the user interface. For example, in Figure 3, select the print command to generate the customer summary report and print the order, the user interface is consistent. 4. beginning and end
Every developer, especially system analysts, prototype developers, and programmers who build user interfaces, should be responsible for Human Factors en-gineering --- hfe) and the user interface standards based on the Development Platform industry standards are described in the tomb. For example, any developer based on the Win32 platform should have and read the Microsoft User Interface Guide (microson 1995 ). Never forget that the user interface is software, not database, not network, or cool Java code written by developers. Based on the above insights, you can say that you are not qualified to develop software if you do not understand the user interface design!
So what developers need to do is: first, reading this article is just a good start and further education is needed. Starting with an introduction to user interface design, this course covers ergonomics, symbols, psychological models, screen design basics, and report design basics. If you want to develop an object-oriented User Interface (object-oriented user interfaces), read chapter 9 of the Book Building object applications that work (Ambler, 1998a) written by the author. Second, it takes two days to learn the development platform-based user interface standards. The existing user interface standards include many common operating systems, including general user interface standards for Internet development. Once again, if you do not have such courses, you also need to study.
In short, every developer should understand the basic principles of user interface design.
V. Summary Below we will summarize the main tips for designing an efficient user interface as follows:
1. General Guide
● User interface consistency is critical,
● Set up and follow the interface standards,
● The adoption of industry standards also makes your application software look or feel more consistent with the software developed by other organizations,
● Clarify software Operation Rules to users. With consistency, the rules will only be concise,
● Support for native and skilled workers;
● Consistent and positive wording. Full name should be used,
● Do not blindly follow other software. You must know that not everyone knows how to design a user interface;
● Display shortcuts on the desktop;
● Think based on the business objects and their corresponding interface objects, rather than from the application software itself;
● The visual, sensory, and behavioral interface objects must be consistent with the real-world performance. 2. screen design
● Inter-interface switching and interface layout are important;
● Understand the components to apply them correctly;
● Exercise caution when using the color and add it as an indicator;
● The comparison principle is followed by the use of dark text on a light background and the use of light-colored Wenyu on a dark background;
● The font should be appropriate and consistent;
● When a project is unavailable, it is not necessary to remove the project, so that users can form a precise psychological model:
● Use harmless default buttons;
● The editing area is left aligned, and the corresponding labels are right aligned,
● The right alignment of integers and floating-point numbers, and the left alignment of strings;
● Avoid screen congestion;
● Use boxes and intervals to combine projects logically related to the screen;
● Open the window at the operation focus;
● The pop-up menu should not be the only function source. 3. Build a prototype
● User requirements determine prototype development;
● Prototype evaluation task: discovers the successes, failures, and omissions of the prototype;
● The prototype creation process can be completed if only a small number of requirements or no new requirements are found during the evaluation process;
● Find the real object and determine the user's usage in the real world;
● Work with actual users after software development,
● Set and execute the prototype development schedule;
● Use a prototype development tool:
● Users participate in development and test the prototype:
● Understand the fundamental business;
● Do not spend much time on items that are likely to be discarded,
● Once the interface objects are stable, they should be documented,
● Flowchart of the prototype development interface:
● Create a document for each interface object that constitutes the prototype. The content includes: the purpose and usage of the interface object; other related interfaces
Objects, the usage of each part.
Introduction:
Scott W. Ambler: Canadian, Senior Consultant for object development. He has been engaged in face-to-face technical work since 1990 and has held various roles: business design, system analysis, system design, project management, Smalltalk programmers, Java programmers, and C ++ programmers. |
