Design User Experience Felix Share

1. Design & User Experience @懒人Felix 2011-3-9

2. Agenda 1 Why This Topic What is Design & User Experience The Elements of User Experience-UCD How can we Improve User Experience Process Pattern Principles Practices

3. WhyThis Topic

5. Whatis Design A specification of an object, manifested by an agent, intended to accomplish goals, in a particular environment, using a set of primitive components, satisfying a set of requirements, subject to constraints

6. Whatis User Experience

7. A person's perceptions and responses that result from the use or anticipated use of a product, system or service

9. The Elements of User Experience 表现层（surface） 一系列的网页，由文字和图片组成。 框架层（skeleton） 按钮、表格、照片和文本区域的位置。 结构层（structure） 确定网站各种特性和功能的最适合的组合方式。 范围层（scope） 功能和特性是否要纳入网站，即范围。 战略层（strategy） 经营者和用户分别想从网站得到什么。

10. 在每一个层面的决定都会影响到它之上层面的可用选择。 这种依赖性意味着在战略层上的决定将具有某种向上的“连锁效应”。 反过来讲，也就意味着每个层面中我们可用的选择，都受到其下层面中所确定的议题的约束。 这种连锁效应意味着在“ 较高层面” 中选择一个界限之外的选项将需要重新考虑“较低层面”中所做出的决策。

11. 这并不是说每一个“较低层面”上的决策都必须在设计“较高层面”之前做出。事物都有两个方面，在“较高层面”中的决定有时会促成对“较低层面”决策的一次重新评估（或者是第一次评估）。在每一个层面，我们都根据竞争对手所做的事情、业界最佳的实践成果来做决定，这是最简单不过的老常识。这些决策可能产生的连锁效应该是双方向的。 如果想在开始“较高层面”设计之前，要完全确定“较低层面”的话，几乎可以肯定的是，你已经把你的项目日程——也许是你最终产品的成功——扔进了一个危险的境地之中。 相反地，应该计划好你的项目，让任何一个层面中的工作都不能在其下层面的工作完成之前结束。这里最重要的一条是，在我们知道基本形状之前，不能为房屋加上屋顶。

12. “应用软件”的设计问题 信息的发布和检索的角度来看待

13. 表现层（surface） 视觉设计，或者说最终产品的外观。 框架层（skeleton） 不管是软件界面还是信息空间，我们必须要完成信息设计（information design）。在软件产品那边，框架层还包括了安排好能让用户与系统的功能产生互动的界面元素。对于信息空间方面来讲，这种界面就是屏幕上的一些元素的组合，允许用户在信息架构中穿行。 结构层（structure） 在软件方面，结构层将从范围转变成系统如何响应用户的请求。在信息空间方面，结构层则是信息空间中内容元素的分布。 范围层（scope） 从战略层进入范围层以后，在软件方面它就转变成对产品的“功能组合”的详细描述。而在信息空间方面，范围则是对各种内容元素的要求的详细描述。 战略层（strategy） 来自企业外部的用户需求（user need）是网站的目标——尤其是那些将要使用我们网站的用户。与用户需求相对应的，是我们自己对网站的期望目标。

14. 我们要从这个得到什么？ 网站目标 商业目标 品牌识别 我们的用户要得到什么？ 用户需求 1 用户细分 2 可用性和用户研究 网站目标和用户需求

17. 产品（product）：在项目中要完成的全部工作，保证在开发过程中不会出现模棱两可的情况；功能规格和内容需求 Reason #1: So You Know What You’re Building Reason #2: So You Know What You’re Not Building

20. 信息架构：作为超文本的网页，内容建设通过信息架构构建用户体验

22. 方式二：是错误难以发生，系统帮助用户找出错误并修正它们。

23. 当用户完成动作后才发现做错了，系统应该为用户提供从错误中恢复的方式。【重做】1

24. 当无法恢复时，提供大量警告2

25. 信息架构着重于设计组织分类和导航的结构，从而让用户高效率、有效地浏览网页内容；

28. 导航设计：呈现信息；

29. 信息设计：呈现有效地信息沟通。界面设计、导航设计和信息设计 网站标志 友好导航 全局导航 指示标示线索 局部导航 搜索 主题图片 下拉菜单 正文 文本输入 按钮 辅助导航 合作伙伴

31. 视觉设计

33. wait Don’t let me wait Don’t let me think 1 think bother Don’t let me bother 懒人

35. How Can we Improve User Experience

36. The Design Process of YCFFIS 1 1.整理业务流程 找到故事所处业务流程位置，理顺其上下文关系 2. 整理或者设计业务单据 根据业务流程整理故事涉及的业务单据，若没有自行设计相应业务单据 3. 模拟业务单据流转 根据故事描述统外，业务单据的填写和流转 4. 设计系统中流程 根据故事业务流程设计系统中流程 5.设计系统表单 根据故事业务单据设计系统中相应表单 6. 根据系统上下文修正流程及单据 7. 设计逻辑模型 8.设计交互逻辑 9. 组织设计评审 10. 修改直至通过 GE

43. The Design Principles of Google 1.有用（Useful）：以用户为焦点，关注他们的生活、工作和梦想。 2. 快速（Fast）：争取节省每一个毫秒。 3. 简单（Simple）：简洁就是力量。 4. 魅力（Engaging）：能够唤起新手的好奇心，能够吸引资深用户。 5. 革新（Innovative）：勇于创新。 6. 通用（Universal）：全世界适用的设计。 7. 盈利（Profitable）：为现行的和将来的商业模式做好安排。 8. 优美（Beautiful）：外观具有视觉愉悦性，但是不会令用户分心。 9. 可信（Trustworthy）：值得用户信赖。 10. 人性（Personable）：加入人性化因素。

44. Thanks A lot！Hoh~ @懒人Felix