design user experience felix share
DESCRIPTION
Design User Experience Felix ShareTRANSCRIPT
![Page 1: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/1.jpg)
![Page 2: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/2.jpg)
• Why This Topic
• What is Design & User Experience
• The Elements of User Experience-UCD
• How can we Improve User Experience
– Process
– Pattern
– Principles
– Practices
![Page 3: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/3.jpg)
![Page 4: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/4.jpg)
![Page 5: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/5.jpg)
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
![Page 6: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/6.jpg)
![Page 7: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/7.jpg)
A person's perceptions and responses that result from the use or anticipated use of a product, system or service
![Page 8: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/8.jpg)
![Page 9: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/9.jpg)
表现层(surface)
一系列的网页,由文字和图片组成。
框架层(skeleton)
按钮、表格、照片和文本区域的位置。
结构层(structure)
确定网站各种特性和功能的最适合的组合方式。
范围层(scope)
功能和特性是否要纳入网站,即范围。
战略层(strategy)
经营者和用户分别想从网站得到什么。
![Page 10: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/10.jpg)
在每一个层面的决定都会影响到
它之上层面的可用选择。
这种依赖性意味着在战略层上的
决定将具有某种向上的“连锁效应”。
反过来讲,也就意味着每个层面中我
们可用的选择,都受到其下层面中所
确定的议题的约束。
这种连锁效应意味着在“ 较高层面”
中选择一个界限之外的选项将需要重新
考虑“较低层面”中所做出的决策。
![Page 11: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/11.jpg)
这并不是说每一个“较低层面”上的决策都必须在设计“较高层面”之前做出。事物都有两个方
面,在“较高层面”中的决定有时会促成对“较低层面”决策的一次重新评估(或者是第一次评估)。
在每一个层面,我们都根据竞争对手所做的事情、业界最佳的实践成果来做决定,这是最简单不
过的老常识。这些决策可能产生的连锁效应该是双方向的。
如果想在开始“较高层面”设计之前,要完全确定“较低层面”的话,几乎可以肯定的是,你已
经把你的项目日程——也许是你最终产品的成功——扔进了一个危险的境地之中。
相反地,应该计划好你的项目,让任何一个层面中的工作都不能在其下层面的工作完成之前
结束。这里最重要的一条是,在我们知道基本形状之前,不能为房屋加上屋顶。
![Page 12: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/12.jpg)
“应用软件”的设计问题
信息的发布和检索的角度来看待
![Page 13: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/13.jpg)
表现层(surface)
视觉设计,或者说最终产品的外观。
框架层(skeleton)
不管是软件界面还是信息空间,我们必须要完成信
息设计(information design)。在软件产品那边,
框架层还包括了安排好能让用户与系统的功能产生
互动的界面元素。对于信息空间方面来讲,这种界
面就是屏幕上的一些元素的组合,允许用户在信息
架构中穿行。
结构层(structure)
在软件方面,结构层将从范围转变成系统如何响应
用户的请求。在信息空间方面,结构层则是信息空
间中内容元素的分布。
范围层(scope)
从战略层进入范围层以后,在软件方面它就转变成
对产品的“功能组合”的详细描述。而在信息空间方面,
范围则是对各种内容元素的要求的详细描述。
战略层(strategy)
来自企业外部的用户需求(user need)是网站的目
标——尤其是那些将要使用我们网站的用户。与用
户需求相对应的,是我们自己对网站的期望目标。
![Page 14: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/14.jpg)
我们要从这个得到什么?
我们的用户要得到什么?
网站目标
商业目标
品牌识别
用户需求 1
用户细分 2
可用性和用户研究
网站目标和用户需求
![Page 15: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/15.jpg)
![Page 16: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/16.jpg)
功能规格和内容需求
Reason #1: So You Know What You’re Building
Reason #2: So You Know What You’re Not Building
过程(process):确定现在能解决哪些事情,
而哪些必须要再迟一点才能解决;
产品(product):在项目中要完成的全部工
作,保证在开发过程中不会出现模棱两可的情况;
![Page 17: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/17.jpg)
![Page 18: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/18.jpg)
交互设计与信息架构
信息架构着重于设计组织分类和导航的结构,从
而让用户高效率、有效地浏览网页内容;
信息架构的分类体系
交互设计:作为软件界面的网页,为用户设计结
构化体验
信息架构:作为超文本的网页,内容建设通过信
息架构构建用户体验
它们关心的是理解用户、用户的工作方式和思考
方式
方式一:将系统设置为不可能犯错的那种。
方式二:是错误难以发生,系统帮助用户找出错误并
修正它们。
当用户完成动作后才发现做错了,系统应该为用户提
供从错误中恢复的方式。【重做】1
当无法恢复时,提供大量警告 2
![Page 19: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/19.jpg)
![Page 20: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/20.jpg)
界面设计、导航设计和信息设计
界面设计:确定框架,“按钮、输入框、界
面控件”的领域;
导航设计:呈现信息;
信息设计:呈现有效地信息沟通。
网站标志全局导航
友好导航
指示标示线索
局部导航
辅助导航
搜索
下拉菜单
文本输入
按钮
合作伙伴
主题图片
正文
![Page 21: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/21.jpg)
![Page 22: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/22.jpg)
视觉设计
![Page 23: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/23.jpg)
![Page 24: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/24.jpg)
![Page 25: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/25.jpg)
![Page 26: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/26.jpg)
![Page 27: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/27.jpg)
1.整理业务流程
找到故事所处业务流程位置,理顺其上下文关系
2. 整理或者设计业务单据
根据业务流程整理故事涉及的业务单据,若没有自行设
计相应业务单据
3. 模拟业务单据流转
根据故事描述统外,业务单据的填写和流转
4. 设计系统中流程
根据故事业务流程设计系统中流程
5.设计系统表单
根据故事业务单据设计系统中相应表单
6. 根据系统上下文修正流程及单据
7. 设计逻辑模型
8.设计交互逻辑
9. 组织设计评审
10. 修改直至通过 GE
![Page 28: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/28.jpg)
![Page 29: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/29.jpg)
![Page 30: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/30.jpg)
![Page 31: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/31.jpg)
![Page 32: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/32.jpg)
![Page 33: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/33.jpg)
![Page 34: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/34.jpg)
1.有用(Useful):以用户为焦点,关注他们的生活、工作和梦
想。2. 快速(Fast):争取节省每一个毫秒。
3. 简单(Simple):简洁就是力量。
4. 魅力(Engaging):能够唤起新手的好奇心,能够吸引资深用
户。
5. 革新(Innovative):勇于创新。
6. 通用(Universal):全世界适用的设计。
7. 盈利(Profitable):为现行的和将来的商业模式做好安排。
8. 优美(Beautiful):外观具有视觉愉悦性,但是不会令用户分
心。9. 可信(Trustworthy):值得用户信赖。
10. 人性(Personable):加入人性化因素。
![Page 35: Design User Experience Felix Share](https://reader033.vdocument.in/reader033/viewer/2022060200/5599563a1a28ab84408b4744/html5/thumbnails/35.jpg)
Thanks A lot!Hoh~