用户体验及交互设计.ppt

1、用户体验及交互设计,网络服务室 王厅 2010.03,用户体验概述 网站建设步骤及理念 互联网交互设计方法,目录,用户体验概述,用户体验(User Experience)，缩写为UE, 或者UX。 它是指用户访问一个网站或者使用一个产品时的全部体验。 用户体验设计则是以此概念为中心的一套设计流程。在英语中常被简写为UE Design。此流程完整的包括了有目标用户设定，满意度的范围和指标设定，用户需求的功能，交互研究，系统反馈和最终的报告与成果。 UED，其目标就是让用户自然愉悦地使用产品。 以用户为中心（UCD），用户体验从产品开发的早期就要介入进来，并贯穿整个流程。,什么是用户体验,互联网的

2、用户体验类型,感官体验：呈现给用户视听上的体验，强调舒适性。 交互体验：呈现给用户操作上的体验，强调易用/可用性。 情感体验：呈现给用户心理上的体验，强调友好性。 浏览体验：呈现给用户浏览上的体验，强调吸引性。 信任体验：呈现给用户的信任体验，强调可靠性。 76个点见附件。,为什么要进行用户体验,用户体验的目的： 让用户在使用产品或浏览网页时无障碍； 提高用户使用网站的满意度； 留住旧用户，发展新用户； 降低了用户时间成本及我们的研发成本； 提高用户对网站品牌的忠诚度。 如果用户体验不好： 对产品产生负面印象及评价，连带对于品牌的负面影响。 造成用户流失，从而在行业中丧失竞争力。,怎样开展用户

3、体验,划分用户群，确定目标用户。 走近目标用户，挖掘用户需求。 在用户需求与商业需求中寻找平衡点。 规划产品的发展策略，什么时候做什么事情。 快速设计、研发、测试、上线。快速调整。 始终提供给用户“有用”的东西。,一致性 视觉一致性：字体、颜色、图片等元素的规格、尺寸、样式、间距等； 交互一致性：页面跳转、弹出对话框、鼠标动作（单击、滑过）等； 内容一致性：内容导向、语气、角度、基调、风格； 框架一致性：页面及模块的结构和样式等。 阶段性 网站发展是有阶段性的，不能一蹴而就，在每个阶段都有既定发展目标。产品设计应符合当前阶段的战略发展目标。 用户参与性 用户提供内容 用户参与审核与优化 用户口

4、碑营销,用户体验在网站设计中需要注意的,用户体验中可能遇到的问题,用户体验与“抄袭”。 用户体验，不能以用户满意为唯一目的。 用户体验师可能会在外部用户与内部部门之间“走钢丝”。,网站建设步骤及理念,网站建设步骤,核心思想：营销 我们要获得的： 点击量（商业价值）、用户反馈、技术能力及专业流程的积累,网站建设理念,互联网交互设计方法,什么是交互设计,交互设计（IaD），人与网站的互动。设计和定义使用者如何使用一产品达到其目标，完成某一任务的过程。如注册、网购、聊天等。 交互设计不等于用户体验。 交互设计是一个设计工作。 交互设计是一门技术。 交互设计在目前阶段的主要使命是提高产品可用性。 通过

5、对界面和操作行为的设计提高产品可用性。,变化快。 质量低。 功能操作与信息传达并重。 高速创新从而带来的无标准。,互联网产品的特点,那么，互联网产品的交互设计应该怎么做？,互联网交互设计工作,信息架构 是一个整理信息，斡旋信息系统与使用者需求的过程，主要是要将信息变成一个经过组织、归类、以及具有浏览体系的组合结构。网站的组织系统、标签系统、搜索系统，以及导航系统的组合。目的是提供可用性及可寻性。 流程设计 根据用户需求分析，对用户在网站中需要完成的任务流程进行设计。目的是使流程清晰合理并使用户根据适当的引导顺利完成任务。 界面设计 网站原型设计、网站蓝图设计。将内容与功能的安排直观体现出来。

6、交互细节设计 根据基本的交互设计规则，对网站涉及到交互功能的细节进行文档化要求（详细设计文档）。,什么是信息架构？,我们可以抽象的理解为：通过一堵“墙”架起了“人”和“信息”的桥梁，使之各自找到需要的信息。 这堵墙亦可以理解成一个广义的“界面”，它就是传说中的“信息架构”！,如何进行信息架构？,根据自己所在的组织范围内的具体情况，推动商业、内容、用户三要素均衡发展。,商业：所有的网站和企业网络都存在于特定的商业或组织环境中。无论明显或不明显，每一个组织都有任务、目标、策略、员工、流程和程序、实体基础架构和技术基础架构、预算和文化。将这几种功能、愿景及资源混合之后，每一个组织就成为独一无二的组织

7、了。 内容：包括文件、应用程序、服务、模式，以及人们要找到你的网站时所需要的元数据。真要采用某个专业术语的话，可以说就是构成你的网站的“材料”。 用户：现实世界中顾客喜好和行为的差异，在网站和企业网络的情境中就会被转化成不同的信息需求和信息搜寻行为。,信息架构的类型,静态展示型 例如新浪、搜狐等门户型网站；华尔街日报等新闻类网站。 交互型 例如开心网等社区交互型网站；淘宝、当当等B2C电子商务网站。,信息架构的表现形式,网站的组织系统、标签系统、搜索系统，以及导航系统的组合。,即功能流程的设计。例如注册流程、电子商务网站中的购物流程封装设计等。 通过流程交互设计，可以简化不必要的逻辑步骤，减少

8、用户操作次数。 流程最好采用线性，明晰流程的起点与终点。 控制流程内的任务范围，过于庞杂的任务会形成干扰，容易让用户心生恐惧。,流程设计,范例：某添加账户的流程设计,之前的设计（7个步骤、8次提交）： 1。进入“系统设置”；2。进入帐户管理；2.1。选择“添加帐户”；3。输入邮箱名称；4。输入邮箱地址和密码；5。填写手机号和签名（可跳过）；6。设置邮件服务器；7。提交完成。 之后的设计（考虑了用户体验、安全问题与商业价值，常规提交4次）：,交互设计中的界面设计，又称蓝图设计或原型设计。使用一定的原型设计软件，对功能和内容进行组织和表达，其目的在于直观地呈现设计思想，并起到有效的信息传达的作用。

9、 方法一：自然语言法。 方法二：结构图法。,界面设计,更少的信息量更好。 结构化更易于理解。 信息的表达应该清楚、明确、直接。 操作可识别。 操作前，结果可预知。 操作时，操作有反馈。 操作后，操作可撤销。 让用户知道身处何地。 避免内容看上去象广告。 不提供多余的功能。 相同的功能，在不同的页面中应保持一致性。 措辞统一。,界面设计页面表达原则,具体操作： 第一步. 概括待表达的信息 第二步. 将概括好的信息排序 第三步. 使用界面语言翻译 适用于较明确的线性流程设计。,界面设计自然语言法,界面设计结构图法,具体操作： 第一步. 总结归纳全部待表达的信息。 第二步. 画树状图。 第三步. 画页面草图，演示。(其中包含：页面标题、导航、重要的链接和按钮。),界面设计结构图法,重点在