Generally speaking, UI is short for user interface. The prefix "Inter" of "Inter" means "together, interacting", but the concept of "interaction" has not been reflected after being translated into Chinese. ? [ 1]?
Understand the concept of UI through the following three levels.
First of all, UI refers to the medium of interaction between people and information, and is the functional carrier and typical feature of information products. UI exists as an available form of the system, such as visual interface, which emphasizes the organization and presentation of visual elements. This is the design of the physical presentation layer. Every product or interactive form appears in this form, including graphics and icons (? Icon), color, text design, etc. , through which users can use the system. At this level, UI can be understood as user interface, that is, user interface, which is the basic level of UI as human-computer interaction. ? [ 1]?
Secondly, UI refers to information collection and feedback, input and output, and is the interaction between people and products based on the interface. At this level, UlbJ is understood as user interaction, that is, user interaction, which is the significance of the appearance and existence of the interface. The interaction between people and intangible products depends more on the invisible operation of the program, and this internal operation mechanism matching the interface needs to be completed through the metaphor and guidance of the interface to the function. Therefore, UI should not only have exquisite visual expression, but also have convenient and quick operation, so as to conform to users' cognitive and behavioral habits. ? [ 1]?
Finally, the advanced form of UI can be understood as invisible to users. For users, the UI is "invisible" at this level, not visually invisible, but allows users to naturally interact with the system under the interface, immerse themselves in their favorite contents and operations, and forget the existence of the interface (poor design forces users to pay attention to the interface, not the content). This requires more research on user psychology and user behavior, and design interface structure, behavior and vision from the user's point of view. In the context of big data, in the information space, interaction will become more free, natural and ubiquitous. With the development of technology, design concept and multi-channel interface, until the appearance of pervasive computing interface, the interaction experienced by users is subconscious or even unconscious. ? [ 1]?
User research engineers are generally psychologists, and their literary background is more appropriate.
To sum up, UI designers are: software graphic designers, interaction designers and user research engineers.
Career prospects
Editor? speech sound
UI, that is, the user interface design industry, has just emerged in the global software industry, belonging to the high-paying technical design industry, and its development level is comparable to that of foreign countries. Secondly, many large IT enterprises at home and abroad (such as Baidu, Tencent, Yahoo, China Mobile, Nokia, Lenovo, Netease, Microsoft, Shanda, Taobao and many others) have set up professional UI design departments, but there is a shortage of professionals and fierce competition in human resources. The job market is in short supply. Now the domestic ui design is developing day by day. With the emergence of high-end training institutions in Hangzhou, the UI design industry has attracted much attention. But generally speaking, in this field, the gap with western developed countries is still very obvious. Different from material products, the software field has limitations in technology and materials, and the core problem lies in people. Therefore, improving the personal ability of software UI designers and truly enhancing the humanization of software products has become the top priority of UI development in China.
design principle
Editor? speech sound
1. Simple
The simplicity of the interface is to make users easy to use and understand the product, and reduce the possibility of users making wrong choices. ? [2]?
2. User language
Use language that reflects the user, not the language of the game designer. ? [2]?
3. Minimize the memory burden
The human brain is not a computer. When designing the interface, we must consider the limit of human brain to information processing. People's short-term memory is limited and extremely unstable, and the forgetting rate is about 25% within 24 hours. Therefore, it is easier for users to browse information than to memorize it. ? [2]?
4. Consistency
This is the characteristic of every excellent interface. The interface structure must be clear and consistent, and the style must be consistent with the product content. ? [2]?
clear
It is easy to understand and use in visual effect. ? [2]?
6. User familiarity
Users can use the interface through their own knowledge, but they should not go beyond common sense.
7. Consider the user's habits
Think what users think and do what users do. Users always understand and use it in their own way.
By comparing things in two different worlds (real and virtual), we can complete a better design. Books are better than bamboo slips. ? [2]?
arrange
The orderly interface makes it easy for users to use. ? [2]?
9. Security
Users can choose freely, and all choices are reversible. When the user makes a dangerous choice, the system will be prompted with information intervention. ? [2]?
10. Flexibility
Simply put, it is for the convenience of users, but it is different from the above. That is, the interaction is multiple, not limited to a single tool (including mouse, keyboard or handle, interface). ? [2]?
1 1.
High efficiency and customer satisfaction are the embodiment of human nature. There should be expert and novice player systems, that is, users can customize the interface according to their own habits and save settings. ? [2]?
design cycle
Editor? speech sound
First, determine the target users.
In the process of UI design, the requirement design role will determine the target users of the software and obtain the requirements of the end users and direct users. ? [3]?
User interaction should take into account the different emphasis of interaction design caused by different target users.
For example, the design emphasis for scientific users is different from that for computer beginners.
Second, collect the habits of the target users.
Different types of target users have different interaction habits. This habit of interaction often comes from its original interaction process with reality and the interaction process of existing software tools. ? [3]?
Of course, on this basis, it is necessary to find the interactive effect that users want to achieve through investigation and analysis, and confirm it through the process.
Third, prompt and guide users.
Software is a tool for users. Therefore, users should operate and control the software. The software responds to the user's actions and sets rules. ? [3]?
For the results and feedback of user interaction, prompt the user for the results and feedback information, and guide the user to carry out the next operation that the user needs.
Fourth, the principle of consistency.
Consistent design goals? [3]?
There are usually multiple components (components, elements) in software. The interaction design goals between different components need to be consistent.
For example, if the primary user of computer operation is the target user and the design goal is to simplify the interface logic, then the target needs to realize the whole software (software package), not part of it.
Are the elements consistent in appearance? [3]?
The appearance of interactive elements often affects the interaction effect of users. The appearance of the same software is consistent, which is very helpful to keep the user's focus and improve the interaction effect. Unfortunately, there is no special and unified measurement method for how to confirm the consistency of element appearance. Therefore, it is necessary to investigate the target users and get feedback.
Consistent interactive behavior
In the interaction model, after different types of element users trigger their corresponding behavior events, their interaction behaviors need to be consistent. ? [3]?
For example, all dialog boxes that require the user to confirm the operation contain at least two buttons: confirm and abort.
The extreme idea of the consistency principle of interactive behavior is that the same type of interactive elements cause the same behavior events. However, it can be seen that although this concept is correct in most cases, there are indeed opposite examples to prove that not designing according to this concept will simplify the user's operation process. ? [3]?
Five, the principle of usability
apprehensible
If the software is to be used by users, users must be able to understand the functions corresponding to each element of the software. ? [3]?
If it cannot be understood by users, it is necessary to provide a lossless way for users to understand its corresponding function through the operation of this element.
For example, delete an operation element. The user can click the delete operation button to prompt the user how to delete the operation or whether to confirm the deletion operation. Users can learn more about the corresponding functions of components and cancel the operation at the same time. ? [3]?
attainability
Users are the center of interaction, and interactive elements correspond to the functions that users need. Therefore, interactive elements must be user-controllable.
Users can use interactive devices such as keyboard and mouse to reach other previously invisible or non-interactive interactive elements by moving and triggering existing interactive elements. ? [3]?
It should be noted that the number of interactions will affect the achievable results. When a function is deeply hidden (generally more than 4 layers), the probability of users reaching the element is greatly reduced.
The achievable effect is also related to the interface design. An overly complex interface will affect the achievable results. ? [3]?
controllable
Users can control the interactive flow of software.
Users can control the execution flow of functions.
If control cannot be provided, prompt the user in a way that the target user can understand. ? [3]?
Design direction
Editor? speech sound
UI is a user interface, which is the abbreviation of English user and interface. Literally, it is two components of user and interface, but actually it also includes the interaction between user and interface, so it can be divided into three directions, namely: user research, interaction design and interface design.
User research
User research includes two aspects: one is usability engineering, which studies how to improve the usability of products and make the design of the system easier for people to use, learn and remember; The second is to explore the potential needs of users through usability engineering research and provide another idea and method for technological innovation.
User research is an interdisciplinary specialty, involving usability engineering, ergonomics, psychology, market research, education, design and other disciplines. User research technology is to study products from the perspective of humanity and intervene in product development and design from the perspective of users.
User research can integrate users' expectations of product function, design and appearance requirements into the product development process at the initial stage of product development by studying users' working environment and product usage habits, thus helping enterprises to improve product design or explore a new product concept.
It is a way to obtain users' needs and feedback, and it is also an important standard to test whether the interface and interaction design are reasonable.
Interactive design
This part refers to human-computer interaction engineering. In the past, interaction design was also done by programmers. In fact, programmers are good at coding, but not at interacting with end users. Therefore, although many softwares are fully functional, the interactive design is rough, cumbersome, difficult to use and difficult to learn. After using such software, people are not smart and enterprising, but feel cheated and humiliated. Many people are laid off because they can't operate computer software. This interaction makes the computer a terrible technological monster. So interaction design is separated from the programmer's work and becomes an independent discipline, that is, human-computer interaction design. His aim is to make the software easy to use, easy to learn and easy to understand, and to make the computer a tool to serve human beings conveniently.
interface design
In the long software development, interface design has not been paid attention to. People who do interface design are also called "artists" in a derogatory sense. In fact, software interface design, like industrial modeling design in industrial products, is an important buying point of products. Friendly and beautiful interface will bring people comfortable visual enjoyment, close the distance between people and computers, and create selling points for businesses. Interface design is not a simple artistic painting, it needs to locate users, use environment and use methods, and design for end users. It is a purely scientific artistic design. The standard for testing an interface is not the opinion of a project development team leader or the result of voting by project members, but the feeling of end users. Therefore, interface design should be closely combined with user research, which is a process of constantly designing satisfactory visual effects for end users.
design specification
Editor? speech sound
consistency
Adhere to the design principle centered on user experience, the interface is intuitive and concise, and the operation is convenient and fast. After the user touches the software, the corresponding functions on the interface are clear at a glance, and it is convenient to use the application system without too much training. ? [4]?
Font-keep the font and color consistent and avoid using multiple fonts in a set of themes; -Non-modifiable fields are uniformly displayed in gray text.
Alignment-Keep the alignment of elements in the page consistent, and avoid data alignment on the same page for many times if there are no special circumstances.
Form entry-In pages with required and optional fields, an eye-catching mark (*) must be given next to the required fields; -The text types of all data entry types should be restricted and the format should be checked. For example, telephone number input only allows numbers, and email address should contain "@" and so on. , and give a clear prompt when the user makes an error.
Mouse gestures-clickable buttons and links need to be switched to gestures;
Keep function and content descriptions consistent-avoid using multiple words in the same function description, such as editing and modifying, adding and adding, deleting and clearing. It is suggested that a product dictionary should be established in the project development stage, including terms and descriptions commonly used in products. Designers or developers should display text information in strict accordance with the terms and vocabulary in the product dictionary.
Accuracy principle
Using consistent marks, standard abbreviations and colors, the meaning of displayed information should be very clear, and users do not need to refer to other sources of information.
Display meaningful error messages instead of simple program error codes.
Avoid using the text input box to place non-editable text content, and do not use the text input box as a label.
Use indentation and text to help understand.
Use user language vocabulary, not just professional computer terms.
Use the display space of the monitor effectively, but avoid overcrowding.
Maintain language consistency, such as "OK" for "Cancel" and "Yes" for "No".
Readability principle
Text length
The length of words is very important, especially in a large blank design. Too long will lead to eye fatigue and reading difficulties. Too short often leads to awkward breaking effect, and the use of hyphenation can also lead to a large number of compound words, which seriously affects the fluency of reading.
Space and contrast
The length and spacing of each character are also important. Therefore, the spacing between each character is at least equal to the size of the character. Most digital designers are used to choosing the minimum character size of 150% as the space distance, which can leave enough space. When reading a large paragraph of each line, it will be difficult to understand if the length of the line is too long or the spacing between lines is too small.
align
Whether in the center of the text, on the left side or along the right side of the file, the alignment of the text is very important and will greatly affect readability. Generally speaking, text is used to being aligned to the left, because it reflects the way you read-from left to right. You are familiar with the beginning and end of each line.
Principle of layout rationalization
When designing, we should fully consider the rationalization of the layout, follow the habit of users browsing from top to bottom and operating from left to right, and avoid the shortcoming that the buttons of common business functions are arranged too scattered, which will cause the user to move the mouse too long. Do more "subtraction" operations, hide the function blocks that are not commonly used, so as to keep the interface simple, let users focus on the main business operation processes, and help improve the usability and usability of the software.
Menu-keep the menu simple and accurate, and avoid the depth of the menu exceeding 3 layers. -The functions in the menu need to be completed by opening a new page and adding "…" after the menu name. Only applicable to C/S architecture, please ignore B/S..
Button to confirm the operation button is on the left, and the cancel or close button is on the right.
Functions-Unfinished functions must be hidden and not put in the page content to avoid misunderstanding.
Typesetting-all text content is typeset to avoid edge display (page edge), try to keep the spacing of 10-20 pixels and align vertically; The spacing between control elements should be at least 10 pixels, and ensure that the control elements are not close to the edge of the page.
Table data list-character data is aligned to the left, numerical data is aligned to the right (easy to read and compare), and decimal places are displayed uniformly according to field requirements.
Scroll bar-horizontal scroll bars should be avoided when designing page layouts.
Bread crumb navigation-a breadcrumb navigation)—— bar should appear in a prominent position on the page, so that users can know the position of the current page and define the navigation structure, such as home page >; News Center > Ou Ke Intelligent Investment Promotion Service Platform is officially released, and the underlined part is clickable link.
Information prompt window-the information prompt window should be located in the center of the current page, and the background layer should be weakened appropriately to reduce information interference, so that users can concentrate on the current information prompt window. The general practice is to add a mask layer filled with translucent color on the back of the information prompt window.
Principle of system operation rationality
Try to ensure that users can successfully complete some common business operations without using the mouse (only using the keyboard), and switch between controls by using the Tab key to select all editable texts.
Query retrieval page, enter in the query criteria input box should automatically trigger the query operation.
When some irreversible or deletion operations are performed, there should be information to prompt the user, and let the user confirm whether to continue the operation, and tell the user the consequences caused by the operation if necessary.
The "Confirm" and "Cancel" buttons in the information prompt window need to be mapped with the "Enter" and "ESC" keys on the keyboard respectively.
Avoiding double-clicking with the mouse will not only increase the difficulty of the user's operation, but also make the user mistakenly think that the function click is invalid.
Form entry page, you need to pay attention to the first entry. Users can switch between input boxes or operation buttons by using the Tab key. Note that the Tab operation should follow the order from left to right and from top to bottom.
System response time principle
The system response time should be moderate. If the response time is too long, users will feel uneasy and frustrated, while if the response time is too fast, it will also affect the user's operation rhythm and may lead to errors. Therefore, the system response time follows the following principles:
The 2-5 second window displays the processing information prompt to prevent the user from mistakenly thinking that there is no response and repeating the operation;
Display the processing window for more than 5 seconds, or display the progress bar;