互联网交互设计方法.pptVIP

实例：QQ秀快速换装任务分析任务走查法2换表情3换心情1换一套新形象5换一个自己以前的形象4随便逛逛实例：QQ秀快速换装任务走查法第二步.走查问题1副标题表意不明确描述这句说明仍旧没能说明“这里是什么功能”。如果能通过这句话说明：“在这里添加文字内容，显露您的心情”，说明的效果会更好。至于“让好友都知道！”这几个字几乎是没有用的，没有传达任何信息量。依据页面表达原则：信息的表达应该清楚、明确、直接。修改建议实例：QQ秀快速换装任务走查法第二步.走查问题2“请输入心情秀”表意不明确描述“请输入心情秀文字”其实是第二层要表达的信息，第一层应该是：“这里还没有输入文字”。没有第一句，直接是第二句，需要用户花些时间来推断，推断出，这里显示“请输入心情秀文字”是因为自己没有写文字进去。依据页面表达原则：信息的表达应该清楚、明确、直接。修改建议实例：QQ秀快速换装任务走查法第二步.走查问题3拖动预览中的心情秀时的光标使用错误描述拖动预览图中的心情秀时，光标为应该使用十字箭头。依据视觉表现规范：光标样式修改建议实例：QQ秀快速换装任务走查法第二步.走查问题4“心情秀”概念不清描述“心情秀预览”暗示出，“心情秀”是指外框+文字内容。“换心情秀”功能只是换框，这意味着“心情秀”是指外框。措辞上的含混使得同一个概念出现两种不同的定义，不易于理解。最直接的反应是：“既然心情秀是指外框+文字内容，那么当我点击下一个后，其中的文字内容是不是也会变化？”依据页面表达原则：措辞统一修改建议实例：QQ秀快速换装任务走查法第二步.走查问题5换心情秀外框操作不便描述“上一个”“下一个”的操作不方便。无预览图，无法确定当前选项在全部“框”的列表中所处位置。依据页面表达原则：操作结果不可预知修改建议实例：QQ秀快速换装任务走查法第二步.走查问题6“预览”按钮视觉效果不佳描述预览按钮视觉样式比较象disabled依据灰色通常表示“暂不可用”（disabled）修改建议实例：QQ秀快速换装任务走查法第二步.走查问题7“脱掉”按钮不易找到描述“脱掉”按钮在框的有下角，很多时候看不到，并且文字超小。依据页面表达原则：信息的表达应该清楚、明确、直接。修改建议练习：QQ秀照相馆任务走查法练习：QQ空间心情任务走查法3方法三.任务走查法21方法一.自然语言法方法二.结构图法互联网产品交互设计方法：使用自然的语言来表达页面信息。01面对面的传达信息-书面表达-界面语言02自然语言法页面表达原则自然语言法1.更少的信息量更好。2.结构化更易于理解。3.信息的表达应该清楚、明确、直接。4.操作可识别。5.操作前，结果可预知。6.操作时，操作有反馈。7.操作后，操作可撤销。8.让用户知道身处何地。9.避免内容看上去象广告。10.不提供多余的功能。11.相同的功能，在不同的页面中应保持一致性。12.措辞统一。常用的页面表达方式自然语言法从左到右，从上到下。大字更突出。图形更吸引人。动画会被误认为是广告。内容逻辑：并列关系；从属关系。多项并列的信息：不同的排序方式VS筛选内容具体操作自然语言法ABC将概括好的信息排序使用界面语言翻译概括待表达的信息实例：中信银行卡活动自然语言法实例：中信银行卡活动概括信息自然语言法您选择了回邮方式办卡，概括解释这个办卡方式。接下来您应该下载申请表回邮办卡的全过程是这样的...一系列注意事项。实例：中信银行卡活动排序自然语言法您选择了回邮方式办卡，概括解释这个办卡方式。接下来您应该下载申请表回邮办卡的全过程是这样的...一系列注意事项。实例：中信银行卡活动自然语言法翻译为界面语言实例：中信银行卡活动另外一种表达：自然语言法01020304您选择了回邮方式办卡，概括解释这个办卡方式。第一步.下载、填写申请表并回邮给中信第二步……..第四步……..练习：QQ空间黄钻催费页面自然语言法结构图法抛开页面细节只考虑信息的组织形式。信息构架的原则结构图法1. 一个页面一个主要内容。2. 个人信息与公共信息。3. 网页基本内容有两种：列表和文档4. 更少的信息更好5. 一个用户自己生成内容的页面，有两个状态：浏览状态编辑状态。6. 信息树应该尽量窄而浅，并且