用户体验的概念及理念行业现状和展望.pptx

用户体验的概念及理念行业现状和展望Why?What is Interface?01“Interface is the contacting point between two systems where an output from one system bees an input to the other system、Information Processing信息信息处理理“界面就是界面就是两个两个系系统得之得之间得得联系系纽带,一一个个系系统中得中得输出信息通出信息通过界面界面转变成另一系成另一系统得得输入信息入信息、”Input to Man(perception)输入人入人脑(感知感知)Output from Machine设备输出设备输出Output from Man(Operation)人脑输出（操作）人脑输出（操作）Input to Machine设备输入设备输入Interface界面界面Why?What is Interface?01“User Interface Design refers to an approach for creating easy-to-understand interface with the application of human beings cognitive characteristics,information processing process which is basis for man-machine interaction problems、”Perception感知Recognition认知Interpretation分析判断Decision决策Execution执行用户界面设计方法就是指应用人得认知特征建立容易理解得界面用户界面设计方法就是指应用人得认知特征建立容易理解得界面、Guidelines of User Interface Design“There are many general guidelines developed by diverse scholars and for different purposes:web,information appliances、”世界各地得世界各地得学学者者们都根据各自得目得都根据各自得目得,发展出了不同得展出了不同得设计准准则、Guidelines of User Interface Design-Jacob Nielsen“There are many general guidelines developed by diverse scholars and for different purposes:web,information appliances、”1、Visibility视觉效果效果2、Match the system to the real world与与现实世界相世界相对应3、User control and freedom用用户得控制得自主性得控制得自主性4、Consistency and standards标准和一准和一贯性性5、Error prevention赦免赦免6、Recognition rather tan recall与与其其记忆不如不如认知知7、flexibility and efficiency of use使用得使用得灵灵活性和效率活性和效率8、Aesthetic and minimalist design美美学学得和得和简化得化得9、Help users recognize,diagnose,and recover from errors帮帮助用助用户认识误操作操作,并并诊断断原因原因,从从误操作中恢操作中恢复复10、Help and documentation帮帮助文件助文件咱咱们得水得水龙头e$i(internet)世界各地得世界各地得学学者者们都根据各自得目得都根据各自得目得,发展出了不同得展出了不同得设计准准则、jacobnielsen、dk Guidelines of User Interface Design-Jacob Nielsen杰各布杰各布尼尔森尼尔森“There are many general guidelines developed by diverse scholars and for different purposes:web,information appliances、”世界各地得世界各地得学学者者们都根据各自得目得都根据各自得目得,发展出了不同得展出了不同得设计准准则、1、Visibility of system status信息得可信息得可视性性2、Natural Mapping自然映射自然映射3、Consistency连贯性性4、Constraints约束束5、Simplicity简单直接直接6、Knowledge in the world and head常常识性性7、Design for Error为误操作而操作而设计8、Standardization标准化准化Guidelines of User Interface Design-Donald A、Norman唐唐诺曼曼“There are many general guidelines developed by diverse scholars and for different purposes:web,information appliances、”世界各地得世界各地得学学者者们都根据各自得目得都根据各自得目得,发展出了不同得展出了不同得设计准准则1、Metaphors比比喻2、Direct Manipulation直接得操作直接得操作3、See-and-Point4、Consistency连贯性性5、WYSIWYG所所见即所得即所得(可可视化操作化操作)whatyouseeiswhatyouget、6、User Control用用户控制控制7、Feedback and Dialog反反馈与与对话8、Forgiveness赦免赦免9、Perceived Stability感知得感知得稳定性定性10、Aesthetic Integrity美美学学Visibility:What function is possible?接下接下来会来会如何？如何？Visualize what function is possible,how to use,where we are and what would be the results,so as to bridge the gulf of execution and evaluation我们能做什么我们能做什么,如何做如何做,我们现在在什么位置我们现在在什么位置,结果会就是什么结果会就是什么,通过视通过视觉化得界面将操作得结果与我们得评估联系起来、觉化得界面将操作得结果与我们得评估联系起来、大家有疑问的，可以询问和交流大家有疑问的，可以询问和交流可以互相讨论下，但要小声点可以互相讨论下，但要小声点可以互相讨论下，但要小声点可以互相讨论下，但要小声点Visibility:Constraint约束束“Reduce the alternative ways of operation so that user has the only one way of doing right、”减减少少没没必要得必要得选择,这样用用户就只能沿着唯一正确得操作直就只能沿着唯一正确得操作直到最后、到最后、Visibility:Constraints“Reduce the alternative ways of operation so that user has the only one way of doing right.”减少没必要的选择，这样用户就只能沿着唯一正确的操作减少没必要的选择，这样用户就只能沿着唯一正确的操作直到最后直到最后Visibility:Constraints“Reduce the alternative ways of operation so that user has the only one way of doing right.”减少没必要的选择，这样用户就只能沿着唯一正确的操作减少没必要的选择，这样用户就只能沿着唯一正确的操作直到最后直到最后?Visibility:Affordance引引导“Visualize the clue or properties of interface so that user perceives correctly what function is possible、”可可视化得化得状状态和界面和界面,使用使用户知道可能出知道可能出现得得结果果、Visibility System State系系统状状态“Visualize what is the current system stage and what would be the results,so as to bridge the gulf of execution and evaluation”系统当前得状态就是什么系统当前得状态就是什么,结果会就是什么结果会就是什么,通过视觉化得界通过视觉化得界面将操作得结果与我们得评估联系起来、面将操作得结果与我们得评估联系起来、Visibility Where are we now?我我们在在哪哪？“Visualize where we are now and how further should I go to the end of process、”视觉化化显示我示我们目前得位置目前得位置,我我们距离距离终点点还有多有多远？Visibility Where are we now?我我们在在哪哪？“Visualize where we are now and how further should I go to the end of process.”视觉化显示我们目前的位置，我们距离终点还有多远？视觉化显示我们目前的位置，我们距离终点还有多远？Simplicity Interface Structure 界面界面结构构“Simplify the interface structure to minimize the effort needed for using a product、”简化操作界面得化操作界面得结构构,让产品得使用品得使用变得更加容易得更加容易Shallow&narrow decision structure操作操作结构构:浅浅窄窄Small steps but wide又又浅浅又又宽Many steps but selection range is narrow又窄又深又窄又深Simplicity Fit to Memory Structure与与记忆机制相适机制相适应Simplify the interface so that the amount of information can fit to the capacity of human brain、”简化界面,合适得信息量以适应大脑得记忆机制Fit to memory Structure适适应记忆机制机制Short term memory短期短期记忆Dont exceed 5+-2 items that can be stored in short term memory个左右的元素能适应短期的记忆机制个左右的元素能适应短期的记忆机制Long term memory长期期记忆Meaningful,easy-to-remember,fit-to-user-model informationNumber of information which can got attention at once,Chunking smooth perceiving of the result of action有意有意义的、易于的、易于记忆、适、适当当的信息量、醒目的、程序的信息量、醒目的、程序结构构分配，分配，有助于有助于对结果的果的评估。估。0351 860 7849#88Simplicity Technology技技术Take advantage of the relevant technology so that plex task can be simplified、”利用相利用相关关技技术,将复将复杂得任得任务简化化Technology for simplicity有助于简化得技术Unify the operation,and apply Technology for mental aid.Use technology for smooth feed back about product status统一操作模式，一操作模式，运运用技用技术和心理和心理学学，使信息反，使信息反馈更加有效更加有效ex)Display例：例：显示效果示效果Technological simplification through automation.Apply technology which changes the property of control itself.实时的系的系统状状态显示示ex)View Cam,Digital Watch例：例：电子表、子表、数数码相机相机Simplicity Visual Simplicity视觉简化化“Keep the appropriate level of abstraction of visual image and eliminate unnecessary visual images、”保持保持图象得抽象性象得抽象性,果果断断地消除冗余得地消除冗余得视觉元素元素Visual simplicity视觉简化化Control appropriate level of abstraction of visual image保持保持图象的抽象性象的抽象性Subtractive design:eliminate unnecessary visual images果果断断地消除冗余的地消除冗余的视觉元素元素 Simplicity Functional Simplicity功能功能简化化“Keep the number of functions necessary、”仅仅保留需要得功能保留需要得功能Functional simplicity功能功能简化化Control appropriate number of functions eliminating unnecessary functions有效地控制必要的功能有效地控制必要的功能数数量，果量，果断断消除冗余的功能消除冗余的功能80/20Natural Mapping自然映射自然映射User should be able to easily understand what the result operation would be by just the appearance of controls、应该使用使用户在一看到控制端在一看到控制端时,就非常自然得理解相就非常自然得理解相应得操作所得操作所产生得生得结果果Natural Mapping自然映射自然映射User should be able to easily understand what the result operation would be by just the appearance of controls、应该使用使用户在一看到控制端在一看到控制端时,就非常自然得理解相就非常自然得理解相应得操作所得操作所产生得生得结果果Natural Mapping自然映射自然映射User should be able to easily understand what the result operation would be by just the appearance of controls、应该使用使用户在一看到控制端在一看到控制端时,就非常自然得理解相就非常自然得理解相应得操作所得操作所产生得生得结果果Natural Mapping自然映射自然映射Wrong!User should be able to easily understand what the result operation would be by just the appearance of controls、应该使用使用户在一看到控制端在一看到控制端时,就非常自然得理解相就非常自然得理解相应得操作所得操作所产生得生得结果果Natural Mapping自然映射自然映射User should be able to easily understand what the result operation would be by just the appearance of controls、应该使用户在一看到控制端时应该使用户在一看到控制端时,就非常自然得理解相应得操就非常自然得理解相应得操作所产生得结果作所产生得结果Consistency延延续性性Provide consistency in operation so that user can easily remember and learn how to operate、延延续性得操作能有效性得操作能有效帮帮助用助用户记住住并学并学习如何操作如何操作Consistency延延续性性Provide consistency in operation so that user can easily remember and learn how to operate、延续性得操作能有效帮助用户记住并学习如何操作延续性得操作能有效帮助用户记住并学习如何操作Consistency延延续性性Provide consistency in operation so that user can easily remember and learn how to operate、延续性得操作能有效帮助用户记住并学习如何操作延续性得操作能有效帮助用户记住并学习如何操作Consistency延延续性性Provide consistency in operation so that user can easily remember and learn how to operate、连贯性得操作能有效帮助用户记住并学习如何操作连贯性得操作能有效帮助用户记住并学习如何操作Consistency延延续性性Provide consistency in operation so that user can easily remember and learn how to operate、延续性得操作能有效帮助用户记住并学习如何操作延续性得操作能有效帮助用户记住并学习如何操作Inertial惯性性Provide inertial in operation so that user can easily remember and learn how to operate.延续性的操作能有效帮助用户记住并学习如何操作延续性的操作能有效帮助用户记住并学习如何操作“Provide users with means to understand the cause of errors so that user can fix the error、”为用用户提供故障提供故障产生得原因生得原因,意意义在于有助于用在于有助于用户理解故障理解故障和解和解决决故障故障Design for Error:Understanding cause of error为错误设计:帮帮助用助用户理解故障得原因理解故障得原因Make errors reversible or undo so that user can recover from errors、”使使误操作可以撤消操作可以撤消,这样用用户就能就能从从误操作得困境中操作得困境中摆脱脱 Design for Error:Make it reversible为错误设计为错误设计:“后悔药后悔药”“Prevent users form accidental activation of destructive errors、”保护用户避免由于误操作导致致命错误,即使就是由于偶然得失误Design for Error:Protect against destructive error为错误设计为错误设计:保护措施保护措施Knowledge in the World and Head现实与与认识Principle 06:Knowledge in the World and head规则规则:现实与认识现实与认识Knowledge required for operation should be well allocated to product or user、The allocation of knowledge should be decided depending on mutual superiorities of user(head)and product(world)、操作系操作系统所需要具所需要具备得知得知识(能力能力),由用由用户和和产品共同承担。知品共同承担。知识得分配得分配,应该由由产品和用品和用户相互得相互得优势而定。而定。Property属属性性Knowledge in the World现实知知识Knowledge in the Head大大脑认识Retrievability可恢可恢复复性性Possible to search anytime if it is visual and oral、有有声声有色得有色得东西西,总就是很容易找到。就是很容易找到。Hard to search、Should depend on the memory to search、记忆中得中得东西不那西不那么么容易容易寻找。找。Learning可可学学习性性Needless to learn,just need to interpret the status of product、Depend on how to use the user mental model and limits、无无须学学习,只需修改只需修改产品得品得参数参数。取。取决决于如于如何利用用何利用用户得智力。得智力。Much learning needed、If the learning is meaningful and well agree with user mental model,learning could be easier、需要需要学学习,如果如果学学习就是有意就是有意义得得,并并且且与与用用户得智力模型相适得智力模型相适应,学学习将将变得容易。得容易。Efficiency of use使用得效能使用得效能A bit slow because it is needed to understand and interpret the product information有点慢有点慢,因因为她她需要理解需要理解并并依照依照产品品规则。Effective,because it is needed to remember just once、有效得有效得,因因为她她只需要一次就能只需要一次就能记住住Ease of use at first encounter首次使用得易用性首次使用得易用性Effective because beginners rely on the product information about the control、非常有效得非常有效得,因因为初初学学者可以者可以参参照照产品品关关于于控制得控制得说明。明。Ineffective because beginners cant remember the control information easily、低效得低效得,因因为初初学学者不能者不能轻松地松地记住所有得住所有得操作操作说明。明。Aesthetics美美学学得得Could be plex to indicate all the control information on the product itself、产品本身可以通品本身可以通过复复杂得得设计显示所有得示所有得操作信息。操作信息。User should remember all the control knowledge so,the product shape is simple and free、用用户需要需要记住所有得控制知住所有得控制知识,所以所以产品得品得形形态最好就是最好就是简单灵灵活得。活得。Standardization标准化准化Principle 08:Standardization标准化准化设计If it is difficult to apply all the user interface principles and some interface should be arbitrarily designed,standardize them to make them easy to use and effective after once user learn them、如果很如果很难统一所有用一所有用户对截面截面规则得得认同同,有有时候就需要候就需要专断断地地统一界面得一界面得设计,使之使之标准化。准化。这样可以可以让用用户在第一次使用后就能有效地在第一次使用后就能有效地记住住(规则)StopPauseRecordAudio DubbingSlowMotionStillEjectStandardization标准化准化Principle 08:Standardization标准化准化设计If it is difficult to apply all the user interface principles and some interface should be arbitrarily designed,standardize them to make them easy to use and effective after once user learn them、如果很如果很难统一所有用一所有用户对截面截面规则得得认同同,有有时候就需要候就需要专断断地地统一界面得一界面得设计,使之使之标准化。准化。这样可以可以让用用户在第一次使用后就能有效地在第一次使用后就能有效地记住住(规则)Standardization标准化准化Principle 08:Standardization标准化准化设计If it is difficult to apply all the user interface principles and some interface should be arbitrarily designed,standardize them to make them easy to use and effective after once user learn them、如果很如果很难统一所有用一所有用户对截面截面规则得得认同同,有有时候就需要候就需要专断断地地统一界面得一界面得设计,使之使之标准化。准化。这样可以可以让用用户在第一次使用后就能有效地在第一次使用后就能有效地记住住(规则)Standardization标准化准化Principle 08:Standardization标准化准化设计If it is difficult to apply all the user interface principles and some interface should be arbitrarily designed,standardize them to make them easy to use and effective after once user learn them、如果很如果很难统一所有用一所有用户对截面截面规则得得认同同,有有时候就需要候就需要专断断地地统一界面得一界面得设计,使之使之标准化。准化。这样可以可以让用用户在第一次使用后就能有效地在第一次使用后就能有效地记住住(规则)BREAKOverview of the UI reasearch Overview of the UI reasearch