SlideShare a Scribd company logo
1 of 25
Download to read offline
1
简单、好用
交互设计的定义

          • 交互设计是人工制品、环境和系统的行为,以及传达
               这种行为的外形元素的设计与定义。
     内涵
          • 它不像传统设计学科主要关注形式(现在则也关注内
               容和内涵)而交互设计首先旨在规划和描述事物的行
               为方式,然后描述传达这种行为的最有效形式。
形式


          行为



                          资料来源:Alan Cooper 著《About face 2.0》

                                                               2
 简单、好用
交互设计原则

        • 用于解决行为、形式和内容问题的指导准则

        • 原则为之服务的主要目标是优化用户在使用时的体验




                                    3
简单、好用
交互设计原则

        优化意味着减少用户工作量
         • 逻辑工作-对文本和组织结构的理解

         • 知觉工作-识别形状、大小、颜色、视觉布局和语义

         • 记忆工作-回忆密码、空间位置和名字,及其它关系

         • 物理/运动神经工作-鼠标移动程度,使用姿势(单击
          、拖、双击),输入模式……




                                      4
简单、好用
交互设计原则

        • 不同组织层次的运作



              界面层次


              交互层次

              概念层次


                      5
简单、好用
交互设计规则

        交互设计师应该创建具有以下属性的设计方案

        • 伦理的(能体谅人、有帮助)

        • 有意图的(有用、可用)

        • 注重实效的(能生存的、可行的)

        • 优雅的(有效、巧妙的和情感的)




                               6
简单、好用
交互设计规则

        伦理的(能体谅人、有帮助)

        • 不要伤害
          • 人际伤害(失去尊严、蒙受羞辱)

          • 心理伤害(困惑、不舒适、沮丧、强迫、厌烦)

          • 物理伤害(痛苦、剥夺、死亡、安全降低)

          • 环境伤害(污染、生物多样性减少)

          • 社会和社会学伤害(剥削、不公正的产生)



                                    7
简单、好用
交互设计规则

        伦理的(能体谅人、有帮助)

        • 改善人类状况
         • 增强理解(个体、社会和文化)

         • 增强个体和团队的效率/有效性

         • 改善个体和组织之间的交流

         • 减少个体和组织之间的社会文化紧张关系




                                8
简单、好用
交互设计规则

        • 有意图的(有用、可用)
         • 基于对用户目标和动机的有意识设计。

        • 注重实效的(能生存的、可行的)
         • 有用的规范




                               9
简单、好用
交互设计规则

        • 优雅的(有效、巧妙的和情感的)
         • 表达最简单的完整方案 ,以少实现多、经济

         • 拥有一致性

         • 合适地包容、刺激认知和感情




                                  10
简单、好用
奥卡姆剃刀原理


                  11
简单、好用
奥卡姆剃刀原理

        • 14的世纪哲学家、圣方济各会修士奥卡姆的威廉(
         William of Occam,约1285年至1349年)提出的一个
         奥卡姆原理。

        • 奥卡姆立下一条准则:“实际存在的东西决不可不必
         要地添枝加叶”。




                                               12
简单、好用
交互设计中运用奥卡姆剃刀原理

        • 这个原理是告诫人们“切勿浪费较多东西去做用较少
         的东西同样可以做好的事情。”

        • “如无必要,勿增实体。”




                                    13
简单、好用
交互设计中运用奥卡姆剃刀原理

        • 奥卡姆剃刀原理在交互设计中:
         • 不必要的元素降低设计效率,增加不可预料结果的机率

         • 不必要的元素,不论是生理的,直观的,还是认知的,
           都会降低性能;

         • 不必要的元素潜伏着失败或问题。这个原理还有个美感
           要求,它把从设计中去掉不必要的元素比做是从溶液中
           去掉不纯洁的东西——设计是一种更整洁,纯洁的结果




                                      14
简单、好用
交互设计中运用奥卡姆剃刀原理
        相关理论
        • 在条件相同的情况下,要求得越少的哪个就越好,越
          有价值。——罗伯特·格罗斯泰斯特(Rober
          Grossteste,1175~1253,牛津大学第一任校长)
        • 自然界选择最短的路。——亚里斯多德
        • 如果某一原因既真有足以结实自然事物的特性,则我
          们不应当接受比这更多的原因。——艾萨克·牛顿
        • 万事万物应该最简单(Make everything as simple
          as possible, but not simpler )。——阿尔伯特
          ·爱因斯坦


                                                  15
简单、好用
一致性原则

        • 导航信息的混乱。




                     16
简单、好用
一致性原则

        • 按钮展现方式的不一致。




                        17
简单、好用
一致性原则

        • 叙述内容的不一致。




                      18
简单、好用
一致性原则

        • 审美一致
          • 风格和外观一致。审美一致增强识别度,传递相关组成部分信
           息,引发情感期待。
           如标识、字体、色彩组合。




                                          19
简单、好用
一致性原则

        • 功能一致
          • 意义和行为一致。功能一致人们能积极利用现有知识,
           使产品更易学易用。
           如带下划线的文字即可点。




                                       20
简单、好用
一致性原则

        • 内部一致
          • 与系统内的其他组成部分保持一致。内部一致建立起产
           品与用户之间的信任。在任何逻辑分组里,组成部分都
           应该在审美和功能上保持一致。
           例如网站中的icon系统。




                                       21
简单、好用
一致性原则

        • 外部一致
          • 与同一环境中的其他系统保持一致。外部一致把一致的
           好处延伸到多个独立系统,但不同的系统很少遵循共同
           的设计标准,因此很难达到。
           如网站的后台发布与前台系统。




                                       22
简单、好用
23
简单、好用
24
简单、好用
巫桂华      Huaca woo
 Mail:guihuawu@staff.yidaba.com
 MSN:guihuawu@hotmail.com



 谢谢!


                                  25
简单、好用

More Related Content

What's hot

CRE-004-引領企業創新
CRE-004-引領企業創新CRE-004-引領企業創新
CRE-004-引領企業創新handbook
 
Up學
Up學Up學
Up學ouk
 
CEO-017-領導力21法則Ok
CEO-017-領導力21法則OkCEO-017-領導力21法則Ok
CEO-017-領導力21法則Okhandbook
 
資工所考試密技說明會
資工所考試密技說明會資工所考試密技說明會
資工所考試密技說明會Mu Chun Wang
 
Living Your Dreams
Living Your DreamsLiving Your Dreams
Living Your Dreamsknksmart
 
It媒体细分和媒体关系管理
It媒体细分和媒体关系管理It媒体细分和媒体关系管理
It媒体细分和媒体关系管理Phil Ren
 
IE-036-豐田生產方式
IE-036-豐田生產方式IE-036-豐田生產方式
IE-036-豐田生產方式handbook
 
尋找工作之中的感動
尋找工作之中的感動尋找工作之中的感動
尋找工作之中的感動Winson Ng
 
人际沟通
人际沟通人际沟通
人际沟通sancoyh
 
毕业设计-Slide
毕业设计-Slide毕业设计-Slide
毕业设计-Slidefulin tang
 
HR-002-土地管理學系職涯路徑圖
HR-002-土地管理學系職涯路徑圖HR-002-土地管理學系職涯路徑圖
HR-002-土地管理學系職涯路徑圖handbook
 
Hr 002 土地管理學系職涯路徑圖
Hr 002 土地管理學系職涯路徑圖Hr 002 土地管理學系職涯路徑圖
Hr 002 土地管理學系職涯路徑圖handbook
 
CRE-019-創意思考與與創造力開發Ok
CRE-019-創意思考與與創造力開發OkCRE-019-創意思考與與創造力開發Ok
CRE-019-創意思考與與創造力開發Okhandbook
 
如何能增強免疫力
如何能增強免疫力如何能增強免疫力
如何能增強免疫力5045033
 
詼諧的哲理
詼諧的哲理詼諧的哲理
詼諧的哲理twtony
 

What's hot (18)

CRE-004-引領企業創新
CRE-004-引領企業創新CRE-004-引領企業創新
CRE-004-引領企業創新
 
Up學
Up學Up學
Up學
 
CEO-017-領導力21法則Ok
CEO-017-領導力21法則OkCEO-017-領導力21法則Ok
CEO-017-領導力21法則Ok
 
資工所考試密技說明會
資工所考試密技說明會資工所考試密技說明會
資工所考試密技說明會
 
Living Your Dreams
Living Your DreamsLiving Your Dreams
Living Your Dreams
 
It媒体细分和媒体关系管理
It媒体细分和媒体关系管理It媒体细分和媒体关系管理
It媒体细分和媒体关系管理
 
IE-036-豐田生產方式
IE-036-豐田生產方式IE-036-豐田生產方式
IE-036-豐田生產方式
 
Okayama_1
Okayama_1Okayama_1
Okayama_1
 
China Biz
China BizChina Biz
China Biz
 
尋找工作之中的感動
尋找工作之中的感動尋找工作之中的感動
尋找工作之中的感動
 
人际沟通
人际沟通人际沟通
人际沟通
 
Kids love the eyes
Kids love the eyesKids love the eyes
Kids love the eyes
 
毕业设计-Slide
毕业设计-Slide毕业设计-Slide
毕业设计-Slide
 
HR-002-土地管理學系職涯路徑圖
HR-002-土地管理學系職涯路徑圖HR-002-土地管理學系職涯路徑圖
HR-002-土地管理學系職涯路徑圖
 
Hr 002 土地管理學系職涯路徑圖
Hr 002 土地管理學系職涯路徑圖Hr 002 土地管理學系職涯路徑圖
Hr 002 土地管理學系職涯路徑圖
 
CRE-019-創意思考與與創造力開發Ok
CRE-019-創意思考與與創造力開發OkCRE-019-創意思考與與創造力開發Ok
CRE-019-創意思考與與創造力開發Ok
 
如何能增強免疫力
如何能增強免疫力如何能增強免疫力
如何能增強免疫力
 
詼諧的哲理
詼諧的哲理詼諧的哲理
詼諧的哲理
 

Viewers also liked

Growth Chart
Growth  ChartGrowth  Chart
Growth Chartredskin28
 
Futuro Ma
Futuro MaFuturo Ma
Futuro Manatcamp
 
Funny Christmas
Funny ChristmasFunny Christmas
Funny ChristmasElvaMay
 
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuus
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuusPerttu Monthan - Tervetuloa ja Intranetien tulevaisuus
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuusguest388107
 
Presentación del proyecto Joomla! en el congreso Hispalinux - Cáceres - 14-1...
Presentación del proyecto Joomla!  en el congreso Hispalinux - Cáceres - 14-1...Presentación del proyecto Joomla!  en el congreso Hispalinux - Cáceres - 14-1...
Presentación del proyecto Joomla! en el congreso Hispalinux - Cáceres - 14-1...Knowmades.com
 

Viewers also liked (8)

Growth Chart
Growth  ChartGrowth  Chart
Growth Chart
 
Xmas Tree
Xmas TreeXmas Tree
Xmas Tree
 
Futuro Ma
Futuro MaFuturo Ma
Futuro Ma
 
Funny Christmas
Funny ChristmasFunny Christmas
Funny Christmas
 
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuus
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuusPerttu Monthan - Tervetuloa ja Intranetien tulevaisuus
Perttu Monthan - Tervetuloa ja Intranetien tulevaisuus
 
Voyagesdenuit
VoyagesdenuitVoyagesdenuit
Voyagesdenuit
 
Haydn
HaydnHaydn
Haydn
 
Presentación del proyecto Joomla! en el congreso Hispalinux - Cáceres - 14-1...
Presentación del proyecto Joomla!  en el congreso Hispalinux - Cáceres - 14-1...Presentación del proyecto Joomla!  en el congreso Hispalinux - Cáceres - 14-1...
Presentación del proyecto Joomla! en el congreso Hispalinux - Cáceres - 14-1...
 

More from flydream

中企动力300 cn网站及网络营销建议
中企动力300 cn网站及网络营销建议中企动力300 cn网站及网络营销建议
中企动力300 cn网站及网络营销建议flydream
 
借助外站工具提高用户接触度
借助外站工具提高用户接触度借助外站工具提高用户接触度
借助外站工具提高用户接触度flydream
 
Myzone Of Yidaba Prototype
Myzone Of Yidaba PrototypeMyzone Of Yidaba Prototype
Myzone Of Yidaba Prototypeflydream
 
内容组织
内容组织内容组织
内容组织flydream
 
usability 30
usability 30usability 30
usability 30flydream
 
product manager handbook study
product manager handbook studyproduct manager handbook study
product manager handbook studyflydream
 

More from flydream (6)

中企动力300 cn网站及网络营销建议
中企动力300 cn网站及网络营销建议中企动力300 cn网站及网络营销建议
中企动力300 cn网站及网络营销建议
 
借助外站工具提高用户接触度
借助外站工具提高用户接触度借助外站工具提高用户接触度
借助外站工具提高用户接触度
 
Myzone Of Yidaba Prototype
Myzone Of Yidaba PrototypeMyzone Of Yidaba Prototype
Myzone Of Yidaba Prototype
 
内容组织
内容组织内容组织
内容组织
 
usability 30
usability 30usability 30
usability 30
 
product manager handbook study
product manager handbook studyproduct manager handbook study
product manager handbook study
 

interaction desgin

  • 2. 交互设计的定义 • 交互设计是人工制品、环境和系统的行为,以及传达 这种行为的外形元素的设计与定义。 内涵 • 它不像传统设计学科主要关注形式(现在则也关注内 容和内涵)而交互设计首先旨在规划和描述事物的行 为方式,然后描述传达这种行为的最有效形式。 形式 行为 资料来源:Alan Cooper 著《About face 2.0》 2 简单、好用
  • 3. 交互设计原则 • 用于解决行为、形式和内容问题的指导准则 • 原则为之服务的主要目标是优化用户在使用时的体验 3 简单、好用
  • 4. 交互设计原则 优化意味着减少用户工作量 • 逻辑工作-对文本和组织结构的理解 • 知觉工作-识别形状、大小、颜色、视觉布局和语义 • 记忆工作-回忆密码、空间位置和名字,及其它关系 • 物理/运动神经工作-鼠标移动程度,使用姿势(单击 、拖、双击),输入模式…… 4 简单、好用
  • 5. 交互设计原则 • 不同组织层次的运作 界面层次 交互层次 概念层次 5 简单、好用
  • 6. 交互设计规则 交互设计师应该创建具有以下属性的设计方案 • 伦理的(能体谅人、有帮助) • 有意图的(有用、可用) • 注重实效的(能生存的、可行的) • 优雅的(有效、巧妙的和情感的) 6 简单、好用
  • 7. 交互设计规则 伦理的(能体谅人、有帮助) • 不要伤害 • 人际伤害(失去尊严、蒙受羞辱) • 心理伤害(困惑、不舒适、沮丧、强迫、厌烦) • 物理伤害(痛苦、剥夺、死亡、安全降低) • 环境伤害(污染、生物多样性减少) • 社会和社会学伤害(剥削、不公正的产生) 7 简单、好用
  • 8. 交互设计规则 伦理的(能体谅人、有帮助) • 改善人类状况 • 增强理解(个体、社会和文化) • 增强个体和团队的效率/有效性 • 改善个体和组织之间的交流 • 减少个体和组织之间的社会文化紧张关系 8 简单、好用
  • 9. 交互设计规则 • 有意图的(有用、可用) • 基于对用户目标和动机的有意识设计。 • 注重实效的(能生存的、可行的) • 有用的规范 9 简单、好用
  • 10. 交互设计规则 • 优雅的(有效、巧妙的和情感的) • 表达最简单的完整方案 ,以少实现多、经济 • 拥有一致性 • 合适地包容、刺激认知和感情 10 简单、好用
  • 11. 奥卡姆剃刀原理 11 简单、好用
  • 12. 奥卡姆剃刀原理 • 14的世纪哲学家、圣方济各会修士奥卡姆的威廉( William of Occam,约1285年至1349年)提出的一个 奥卡姆原理。 • 奥卡姆立下一条准则:“实际存在的东西决不可不必 要地添枝加叶”。 12 简单、好用
  • 13. 交互设计中运用奥卡姆剃刀原理 • 这个原理是告诫人们“切勿浪费较多东西去做用较少 的东西同样可以做好的事情。” • “如无必要,勿增实体。” 13 简单、好用
  • 14. 交互设计中运用奥卡姆剃刀原理 • 奥卡姆剃刀原理在交互设计中: • 不必要的元素降低设计效率,增加不可预料结果的机率 • 不必要的元素,不论是生理的,直观的,还是认知的, 都会降低性能; • 不必要的元素潜伏着失败或问题。这个原理还有个美感 要求,它把从设计中去掉不必要的元素比做是从溶液中 去掉不纯洁的东西——设计是一种更整洁,纯洁的结果 14 简单、好用
  • 15. 交互设计中运用奥卡姆剃刀原理 相关理论 • 在条件相同的情况下,要求得越少的哪个就越好,越 有价值。——罗伯特·格罗斯泰斯特(Rober Grossteste,1175~1253,牛津大学第一任校长) • 自然界选择最短的路。——亚里斯多德 • 如果某一原因既真有足以结实自然事物的特性,则我 们不应当接受比这更多的原因。——艾萨克·牛顿 • 万事万物应该最简单(Make everything as simple as possible, but not simpler )。——阿尔伯特 ·爱因斯坦 15 简单、好用
  • 16. 一致性原则 • 导航信息的混乱。 16 简单、好用
  • 17. 一致性原则 • 按钮展现方式的不一致。 17 简单、好用
  • 18. 一致性原则 • 叙述内容的不一致。 18 简单、好用
  • 19. 一致性原则 • 审美一致 • 风格和外观一致。审美一致增强识别度,传递相关组成部分信 息,引发情感期待。 如标识、字体、色彩组合。 19 简单、好用
  • 20. 一致性原则 • 功能一致 • 意义和行为一致。功能一致人们能积极利用现有知识, 使产品更易学易用。 如带下划线的文字即可点。 20 简单、好用
  • 21. 一致性原则 • 内部一致 • 与系统内的其他组成部分保持一致。内部一致建立起产 品与用户之间的信任。在任何逻辑分组里,组成部分都 应该在审美和功能上保持一致。 例如网站中的icon系统。 21 简单、好用
  • 22. 一致性原则 • 外部一致 • 与同一环境中的其他系统保持一致。外部一致把一致的 好处延伸到多个独立系统,但不同的系统很少遵循共同 的设计标准,因此很难达到。 如网站的后台发布与前台系统。 22 简单、好用
  • 25. 巫桂华 Huaca woo Mail:guihuawu@staff.yidaba.com MSN:guihuawu@hotmail.com 谢谢! 25 简单、好用