Enviar pesquisa
Carregar
界面线索性设计
•
Transferir como PPTX, PDF
•
7 gostaram
•
1,648 visualizações
Alite Yu
Seguir
阿里巴巴用户体验百家讲堂
Leia menos
Leia mais
Design
Tecnologia
Diversão e humor
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 32
Baixar agora
Recomendados
Ui gathering(視覺設計)
Ui gathering(視覺設計)
Winnie Chiang
视觉设计
视觉设计
o0runner
Web UI其实很简单 public
Web UI其实很简单 public
evan wu
App介面設計要點
App介面設計要點
Ya Qiao Wu
设计师的转型
设计师的转型
Alite Yu
基于认知的产品界面设计
基于认知的产品界面设计
Mac zheng
A new way to use Wikipedia for collaborative innovation"
A new way to use Wikipedia for collaborative innovation"
TEDxFuzhou
UiGathering Talk - Motion User Interface / by Ivan Wei
UiGathering Talk - Motion User Interface / by Ivan Wei
UXTW(Taiwan User Experience Professional Association)
Recomendados
Ui gathering(視覺設計)
Ui gathering(視覺設計)
Winnie Chiang
视觉设计
视觉设计
o0runner
Web UI其实很简单 public
Web UI其实很简单 public
evan wu
App介面設計要點
App介面設計要點
Ya Qiao Wu
设计师的转型
设计师的转型
Alite Yu
基于认知的产品界面设计
基于认知的产品界面设计
Mac zheng
A new way to use Wikipedia for collaborative innovation"
A new way to use Wikipedia for collaborative innovation"
TEDxFuzhou
UiGathering Talk - Motion User Interface / by Ivan Wei
UiGathering Talk - Motion User Interface / by Ivan Wei
UXTW(Taiwan User Experience Professional Association)
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
Tim Xia
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
d0nn9n
Mobile app design 2010
Mobile app design 2010
Baidu
UI DESIGN入门讲座
UI DESIGN入门讲座
Tisa Fu
对《iOS人机交互指南》的一点理解
对《iOS人机交互指南》的一点理解
isnofate
来自腾讯Ceo马化腾的ppt
来自腾讯Ceo马化腾的ppt
henryweili
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
yihuixue
产品设计与用户体验(马化腾)
产品设计与用户体验(马化腾)
jiangwb
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
IxDC
Let's talk about Web Design
Let's talk about Web Design
Abby Chiu
阿里巴巴无线端设计
阿里巴巴无线端设计
lch19880425
指尖之美 如何打造优秀的移动应用
指尖之美 如何打造优秀的移动应用
isnofate
Week2.how to cooporeate with it
Week2.how to cooporeate with it
ditl
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
also24
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
also24
Pad&pc差异调研报告
Pad&pc差异调研报告
sean mao
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
IxDC
How to cooporeate with IT partners from a designer's viewpoint
How to cooporeate with IT partners from a designer's viewpoint
NTUST
Gui Conclusion2
Gui Conclusion2
Yao Lining
Gui Conclusion2
Gui Conclusion2
guest801da4
电子商务网站评测模版
电子商务网站评测模版
Alite Yu
移动端网页——发现视频内容的未来
移动端网页——发现视频内容的未来
Alite Yu
Mais conteúdo relacionado
Semelhante a 界面线索性设计
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
Tim Xia
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
d0nn9n
Mobile app design 2010
Mobile app design 2010
Baidu
UI DESIGN入门讲座
UI DESIGN入门讲座
Tisa Fu
对《iOS人机交互指南》的一点理解
对《iOS人机交互指南》的一点理解
isnofate
来自腾讯Ceo马化腾的ppt
来自腾讯Ceo马化腾的ppt
henryweili
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
yihuixue
产品设计与用户体验(马化腾)
产品设计与用户体验(马化腾)
jiangwb
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
IxDC
Let's talk about Web Design
Let's talk about Web Design
Abby Chiu
阿里巴巴无线端设计
阿里巴巴无线端设计
lch19880425
指尖之美 如何打造优秀的移动应用
指尖之美 如何打造优秀的移动应用
isnofate
Week2.how to cooporeate with it
Week2.how to cooporeate with it
ditl
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
also24
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
also24
Pad&pc差异调研报告
Pad&pc差异调研报告
sean mao
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
IxDC
How to cooporeate with IT partners from a designer's viewpoint
How to cooporeate with IT partners from a designer's viewpoint
NTUST
Gui Conclusion2
Gui Conclusion2
Yao Lining
Gui Conclusion2
Gui Conclusion2
guest801da4
Semelhante a 界面线索性设计
(20)
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
Ix d2013 d1_从效益角度选择合适的设计工具与流程_叶慧儿
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
腾讯大讲堂:62 拇指下的精彩(手机qq交互设计经验分享)
Mobile app design 2010
Mobile app design 2010
UI DESIGN入门讲座
UI DESIGN入门讲座
对《iOS人机交互指南》的一点理解
对《iOS人机交互指南》的一点理解
来自腾讯Ceo马化腾的ppt
来自腾讯Ceo马化腾的ppt
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
产品设计与用户体验Good(来自腾讯ceo马化腾的ppt)
产品设计与用户体验(马化腾)
产品设计与用户体验(马化腾)
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
IxDC 中国交互设计体验日-C1_张立州_手机客户端交互设计三部曲
Let's talk about Web Design
Let's talk about Web Design
阿里巴巴无线端设计
阿里巴巴无线端设计
指尖之美 如何打造优秀的移动应用
指尖之美 如何打造优秀的移动应用
Week2.how to cooporeate with it
Week2.how to cooporeate with it
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
手机客户端产品设计的10条法则
Pad&pc差异调研报告
Pad&pc差异调研报告
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
IxDC 中国交互设计体验日-C3a_钟磊_手持终端交互设计方法2_钟磊
How to cooporeate with IT partners from a designer's viewpoint
How to cooporeate with IT partners from a designer's viewpoint
Gui Conclusion2
Gui Conclusion2
Gui Conclusion2
Gui Conclusion2
Mais de Alite Yu
电子商务网站评测模版
电子商务网站评测模版
Alite Yu
移动端网页——发现视频内容的未来
移动端网页——发现视频内容的未来
Alite Yu
信、达、雅的设计之美
信、达、雅的设计之美
Alite Yu
alibaba-udc-交互设计公开课
alibaba-udc-交互设计公开课
Alite Yu
界面图标设计
界面图标设计
Alite Yu
My yahoo
My yahoo
Alite Yu
I os视觉分享 2011共享版
I os视觉分享 2011共享版
Alite Yu
交互设计Vs前端开发
交互设计Vs前端开发
Alite Yu
体验的历程 Afooli
体验的历程 Afooli
Alite Yu
Interaction designer how to grow up
Interaction designer how to grow up
Alite Yu
User centeredmetics-110223101127-phpapp01
User centeredmetics-110223101127-phpapp01
Alite Yu
如何选择和运用不同的用户研究方法
如何选择和运用不同的用户研究方法
Alite Yu
关于会议那些事儿
关于会议那些事儿
Alite Yu
理性的审美
理性的审美
Alite Yu
用户体验设计公开课讲义 交互设计禅意花园
用户体验设计公开课讲义 交互设计禅意花园
Alite Yu
交互设计禅意花园
交互设计禅意花园
Alite Yu
交互设计模式创新
交互设计模式创新
Alite Yu
消费品List改版分享
消费品List改版分享
Alite Yu
Mais de Alite Yu
(18)
电子商务网站评测模版
电子商务网站评测模版
移动端网页——发现视频内容的未来
移动端网页——发现视频内容的未来
信、达、雅的设计之美
信、达、雅的设计之美
alibaba-udc-交互设计公开课
alibaba-udc-交互设计公开课
界面图标设计
界面图标设计
My yahoo
My yahoo
I os视觉分享 2011共享版
I os视觉分享 2011共享版
交互设计Vs前端开发
交互设计Vs前端开发
体验的历程 Afooli
体验的历程 Afooli
Interaction designer how to grow up
Interaction designer how to grow up
User centeredmetics-110223101127-phpapp01
User centeredmetics-110223101127-phpapp01
如何选择和运用不同的用户研究方法
如何选择和运用不同的用户研究方法
关于会议那些事儿
关于会议那些事儿
理性的审美
理性的审美
用户体验设计公开课讲义 交互设计禅意花园
用户体验设计公开课讲义 交互设计禅意花园
交互设计禅意花园
交互设计禅意花园
交互设计模式创新
交互设计模式创新
消费品List改版分享
消费品List改版分享
界面线索性设计
1.
界面线索性设计 大脸
2.
目标导向设计vs过程体验设计
3.
1.什么是界面线索性?
4.
5.
Contextual Environment Prev. Now
Next How to Action
6.
当他们操作时,他们知道下一步即将出现什么、怎么回去——即使是在第一次操作。
7.
2.为什么是移动界面?
8.
界面限制 没有任务栏,没有窗口管理 没有最小化,没有关闭,默认全屏
屏幕尺寸降低到原来的1/4 按钮增大两倍
9.
界面限制
10.
因各种限制导致的导航缺失,使得线索性设计成为移动应用界面导航的救命稻草。
11.
其他原因 交互方式的拟真化 用户的移动场景需求
单任务思想 开发效率提高 竞争差异化
12.
3.线索性设计内容
13.
像素级拟物式外观
14.
看一眼,我就知道你是干嘛的。 类似真实物体的外观和呈现,让人几乎是条件反射般理解客户端的作用。
15.
即时反馈
16.
快速熟悉手势与导航 触摸屏的方式降低了操作的学习成本,即时反馈则大大降低了操作与反馈之间的距离,提高用户学习的效率。
17.
流动式动画
18.
显示界面的流动信息,隐喻操作行为。 无需言语,给动画1秒钟的舞台,他就能解释清楚,他就能被理解。就这么简单。
19.
有逻辑的物理空间
20.
Flipboard 封面 正文
目录
21.
让界面富有空间感,立体化。 从三视图,到立体图的进化。
22.
自圆其说的线索性
23.
有来有往,有去也有回。 关注于界面如何向前流动,也应该让用户知道如何返回。
24.
4.线索性设计展示
25.
iOS:瑕不掩瑜优秀的领先者 总体界面线索性设计的优秀,并不能掩盖其在多任务中的线索性的短板。
26.
Android:山寨仍需努力。 菜单,弹窗,易导致界面相互之间线索性的断裂。
27.
WP7:小伙子,我看好你哦。 革命性创新的线索性设计,全景视图让人惊艳。
28.
5.练习:书籍目录设计
29.
6.Q&A
30.
结束,谢谢大家! 大脸:tolyer@gmail.com
31.
彩蛋:这个PPT的线索性设计是如何? 答中有奖
32.
PPT线索性设计结构 封面 1.什么是线索性
….. …… 2.为什么是移动界面 … 3.线索性设计内容 …. 4.线索性设计展示 …….
Notas do Editor
互联网里还傻逼样有理想的设计师。 极简主义,革新,消除欲望。 外向接触本能受挫焦虑症患者。 人格残缺的高智商低收入男性。 88年,Geek,爱电影大家好,今天的课题<线索性设计>,属于我自己的自己的一个名词创意。首先我想调查一下:这里有几个苹果粉丝,这里有几个微软粉丝,请你们说说,你觉得苹果产品,最优秀的一点是什么,或者说,用一个词,形容你在使用他们产品的心情的时候,你会怎么形容。我个人来说,我是微软粉丝,我不喜欢苹果的产品,但是我很欣赏。我一直不服气的一个大众的认同理论:苹果的体验做得比微软好。我通常会抵触说,那你为什么离不开微软?我自己也一直在思考这个问题。
然后,我接触两种设计方法:目标导向设计&过程体验设计。而正是因为这两种设计方式,表现了两家公司不同的设计风格。那么今天,我是来解释我自己对这个理论的一点认识的,这个理论就是,为什么苹果公司的体验更好?第二个问题,就不在这个话题的讨论中。首先举个例子,大家看ipad,有人告诉我,我怎么让文件夹回到上面的位置。
我们不得不否认的一点是,界面与界面之间其实是应该纯在联系的,我指的这种联系是说,空间感。存在相互之间的层级和逻辑关系的,而且这种关系,月符合现实的,越好。越容易让别人理解,越来越不用让别人学习。
比如,我们在网页中,常使用的tab的导航,实际上就是tab notebook的一种变化。
那么在,界面设计当中,我们除了关注当前界面之外,还应该去关注上一个界面,与下一个界面。以及他们之间的过渡。建立一个上下文空间。因为,他们能够非常容易帮你解答一个问题,how to action?尤其是在触摸屏上。
线索性给人以可预测性。这是一种掌握的感觉,是一种控制的感觉。
直接触摸,而不是借助其他工具翻译命令。因此,界面的线索性也要建立起来。推箱子的例子。用户随时在移动,常被打断,恢复的时候,用户需要知道当前的位置。单任务思想,一个界面只完成一项任务,卡片式界面,让界面相互之间富有逻辑。
桌面图标的立体效果拍照,开锁的声音书架日历外形
iPad文件夹打开操作,iPad双击Home的效果。
我记得很久以前xp是这么设计的,当你拖动窗口的时候,窗口并不会和你一起动,和你动的是一个虚框。他只会表达一个移动状态。按钮状态。滑块,声音,滑动,缩放,弹性列表(无法获得真实力学反馈而采用的视觉模拟)
如果一个错误行为,你需要半年后才能得到教训,和你马上得到教训,这有什么区别?即时反馈,降低了用户的的犯错所导致的等待成本,以及他所引起的挫败感。
几乎任何的页面翻转,都有动画效果。卡片式滚动,逻辑界面,一个页面,一项任务。
iPad文件夹打开操作,iPad双击Home的效果。
通过动画,视觉外观,建立符合真实逻辑的物理空间。演示Flipboard的物理空间与杂志的关系。浮层与下侧界面的空间关系。
通过动画,视觉外观,建立符合真实逻辑的物理空间。演示Flipboard的物理空间与杂志的关系。
iPad文件夹打开操作,iPad双击Home的效果。
Safari的多窗口切换,ibooks的书籍返回,iphoto的界面返回。Flipboard阴影的变化。
Flipboard的杂志化,卡片式的逻辑界面,层级过深,但是界面确富有逻辑。多任务时,应用切换障碍。
展示wifi设置内,android界面的变态:菜单弹窗。
展示Windows phone 的旋转切换.
iPad文件夹打开操作,iPad双击Home的效果。
iPad文件夹打开操作,iPad双击Home的效果。
Baixar agora