多媒体艺术编创第二章-多媒体交互设计课件

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,第二章 多媒体交互设计,多媒体艺术编创,第二章 多媒体交互设计,多媒体艺术编创第二章 多媒体交互设计,本章要点,第一节 多媒体交互,第二节 多媒体交互设计的内容,第三节 多媒体作品交互形式设计原则,本章要点,第一节 多媒体交互,多媒体作品的制作是一个系统构建的工程，就像设计一座蓝图无比宏伟的大厦，若是没有管道工、泥瓦匠、水电工等各种工匠一砖一瓦地艰辛积累，密切协作，这座大楼只能是空中楼阁、海市蜃楼。然而任何事物的结构都有支撑其存在的基础性元素，就像一间屋子，它的房梁和柱子是如何交叉，相互关系是否合理，决定着屋子的坚固程度以及其它元素的相互配合。,如果说在一个多媒体作品中，内容是整个节目的基石，界面设计是打开用户之门，那么交互结构的设计就是建立“人机”、“人人”沟通的桥梁。,第一节 多媒体交互多媒体作品的制作是一个系统构建的工程，就像,交互的世界.,人与环境的交互,人与人之间的交互.,那么在日常生活中有多少交互式产品呢？,考虑一下在一天里我们可能遇到些什么,计算机、饭卡、自动贩卖机、选课系统、查分系统、图书馆查询借阅系统、互联网、打印机、网络游戏、电话充值,再考虑一个问题？这些交互式的产品的可用性如何，有多少易用、毫不费力的？,工商,民生,第一节 多媒体交互,交互的世界.工商民生第一节 多媒体交互,第一节 多媒体交互,每一种出版媒体都在发展自己的习惯用法，并不断改进这些用法，形成新的习惯用法。多媒体作品也有很多习惯用法，这些习惯用法大部分是从纸质出版物中延续过来的，但是新的习惯用法也在不断地涌现。比如交互的时候，指针滑到超连接键上会改变成小手图标。,比如在任何作品中看到,图标我们就知道是播放,图标是快进,图标是暂停,图标是存储,图标是关闭,在这些图标的旁边就不必要加上相应的文字作为说明,第一节 多媒体交互每一种出版媒体都在发展自己的习惯用法，并不,第一节 多媒体交互,多媒体作品0.618的韵律在每一级的界面上都用了Windows操作系统默认的导航图标就没有加入相关的文字说明。,第一节 多媒体交互多媒体作品0.618的韵律在每一级的界,第一节 多媒体交互,门户网站雅虎，因为它在全球各地都有本土网站，同时其品牌标示也非常强。我们来看看Y，Yahoo France和雅虎中国的首页,它们的区别就不是很大，各个分区清晰可辨，就算都是不认识的文字也可大致明白每个分区的功能,第一节 多媒体交互门户网站雅虎，因为它在全球各地都有本土网站,第一节 多媒体交互,送你一枚指南针你就不会迷路。,第一节 多媒体交互送你一枚指南针你就不会迷路。,交互设计的目的,就是在设计过程中引入可用性。,交互设计作为一门关注交互体验的新学科在二十世纪八十年代产生了，它由IDEO的一位创始人比尔莫格里奇在1984年一次设计会议上提出，他一开始给它命名为Soft Face，,后来把它更名为,“Interaction Design”交互设计。,第一节 多媒体交互,交互设计的目的 就是在设计过程中引入可用性。第一节 多媒,第二节 多媒体交互设计的内容,多媒体作品的制作是一个系统构建的工程，就像设计一座蓝图无比宏伟的大厦，若是没有管道工、泥瓦匠、水电工等各种工匠一砖一瓦地艰辛积累，密切协作，这座大楼只能是空中楼阁、海市蜃楼。然而任何事物的结构都有支撑其存在的基础性元素，就像一间屋子，它的房梁和柱子是如何交叉，相互关系是否合理，决定着屋子的坚固程度以及其它元素的相互配合。,如果说在一个多媒体作品中，内容是整个节目的基石，界面设计是打开用户之门，那么交互结构的设计就是建立“人机”、“人人”沟通的桥梁。,第二节 多媒体交互设计的内容多媒体作品的制作是一个系统构建,1、多媒体结构与导航设计,深入了解交互设计之后我们发现,交互设计,的基础是,交互结构的设计,。所谓结构，就是构成整体的各个组成部分的比例及其结合方式、相互关系。,交互性是多媒体技术独一无二的最具特色和优势的根本特性。,交互性也是多媒体技术其它特性的核心,，它使多媒体技术其它特性的优势更突出，功能更强大。,在多媒体节目中有以下三种基本的结构类型：,线性的 顺序导航（单一方向的）,层级的或树状的 菜单导航（多个方向的）,网状的或图形的 地图导航（所有方向的）,第二节 多媒体交互设计的内容,1、多媒体结构与导航设计 第二节 多媒体交互设计的内容,2、多媒体热区与菜单设计,热区与菜单在多媒体中的作用是不容忽视的，热区与菜单是读者与多媒体作品之间交谈的“桥梁”。通过用户对热区与菜单进行单击、双击、拖动等操作，来完成多媒体作品的交互。,Windows操作系统下的应用软件之所以倍受青睐，与其界面的易用性不无关系，在菜单里清楚地显示出层次，可用的为黑色，不可用的为灰色。,第二节 多媒体交互设计的内容,2、多媒体热区与菜单设计 Windows操作系统下的应用软件,多媒体热区与菜单的设计方法有,丰富性、贴切性、感染性和吸引力；,采用形象生动的动画图标来提高注意力；,相同功能的按钮造型与位置一致；,采取下拉菜单的方式或选择的方式以减少输入工作量；,易识别、易使用，符合界面整体风格。,第二节 多媒体交互设计的内容,多媒体热区与菜单的设计方法有第二节 多媒体交互设计的内容,看看下面两组播放键，哪一种是最自然的反应呢？,看看下面四组箭头按键，哪一种是最自然的反应呢？,第二节 多媒体交互设计的内容,看看下面两组播放键，哪一种是最自然的反应呢？第二节 多媒体,3、多媒体作品的帮助系统,多媒体节目应提供用户咨询信息，它如同一个询问处、咨询部，当用户有需要的时候，能为使用者提供帮助，其中所含信息应仅供使用者参考。帮助信息不应中断或影响使用者正在进行的学习，也不能因此改变系统状态，也就是说，帮助信息不应严重干扰、中断或破坏系统的运行。另外帮助信息虽要明确但不应过于引人注目，要避免它在用户需要之前就吸引或干扰使用者的注意力。总之，要保证是在用户需要的情况下，并尽可能少地干扰用户的情况下向用户提供帮助。,?,第二节 多媒体交互设计的内容,3、多媒体作品的帮助系统?第二节 多媒体交互设计的内容,多媒体元素,交互形式,图片,鼠标滑过时，图片颜色发生变化（明度，色相，饱和度）,鼠标滑过时，图片上部出现动画,。,文本,选择文本的自动浏览，手动浏览或手动翻页,文本是否能够被拷贝,。,声音,音量大小控制,声音效果控制（重低音，BASS，高音）,。,视频,播放进度调整,画面对比度，亮度调整,。,热区,无事件触发时,。,有事件触发时,。,其它,。,转场,黑闪，白闪。,第二节 多媒体交互设计的内容,4、,多媒体元素的交互设计,多媒体元素交互形式图片鼠标滑过时，图片颜色发生变化（明度，色,第三节 多媒体作品交互形式设计原则,对于多媒体作品来说，交互设计是一种美学与文化、技术和人类科学的融合。交互设计关注如何设计可能提供的服务，关注用户与作品交互时的体验感受。那么我们在编创一部多媒体作品的设计交互形式时应该注意什么，应遵循哪些设计原则？,主要有以下八点：,第三节 多媒体作品交互形式设计原则 对于多媒体作品来说，交互,1、以沟通功能作为交互设计的核心,交互设计的关键是使人与计算机之间能够准确地交流信息。一方面，人向机器输入信息时应当尽量采取自然的方式；另一方面，机器向人传递的信息必须准确，不致引起误解或混乱。使阅读、导航与主体内容泾渭分明，充分体现人机的交互功能。这样设计出来的多媒体作品不但能够突出主题，而且易于读者的阅读。,在多媒体节目中，我们一般会设计一个导航页面来让读者宏观的把握多媒体节目的内容。,第三节 多媒体作品交互形式设计原则,1、以沟通功能作为交互设计的核心 在多媒体节目中，我们一般会,2交互方式力争一致,一致的交互方式不致增加阅读着的负担，让阅读着始终用同一种方式思考与操作。最忌讳的是每换一个界面用户就要换一套操作方法。Windows下的应用软件之所以倍受青睐，与其界面的一致性不无关系。,第三节 多媒体作品交互形式设计原则,在多媒体作品0.618的韵律中，设计者使用了一致的交互方式，基本导航和使用工具都采用了相同的造型和位置。,2交互方式力争一致 第三节 多媒体作品交互形式设计原则 在,2交互方式力争一致,在多媒体作品时钟之旅中，设计师就注意了交互方式的一致性，在作品中，基本导航工具都是相同的造型和位置。,第三节 多媒体作品交互形式设计原则,2交互方式力争一致 第三节 多媒体作品交互形式设计原则,3交互设计必须使读者随时了解浏览的情况,交互设计应该能够告诉读者现在阅读的内容在整个节目中的具体位置。特别是在需要复杂导航的时候，必须让读者了解他的阅读情况，如他的同级关系、上下级关系等。切不可让用户面对着一个没有反应的屏幕，以致怀疑是否出现了死机现象。,第三节 多媒体作品交互形式设计原则,3交互设计必须使读者随时了解浏览的情况 第三节 多媒体作品,3交互设计必须使读者随时了解浏览的情况,在多媒体节目运行前，我们一般设计一个loading画面，提示读者节目正在载入。在多媒体作品,怎样制作你的电影中中，作品提供一个非常帮的工具，利用这个你可以知道你身处何处,第三节 多媒体作品交互形式设计原则,3交互设计必须使读者随时了解浏览的情况 第三节 多媒体作品,4交互设计在界面中必须能够给读者提供帮助减少读者挫败感,多媒体节目在制作的时候决不可以认为读者都是电脑专家，无需提供帮助。,挫败感的范围从轻微的不满到极度的愤怒有很多种（达不到读者用户的预期期望；错误的信息；界面过于杂乱、艳丽、花招摆出没头没脑；引导读者执行了许多步骤之后出错，导致读者要从头开始）。,有关的文字、图形提示、信息、说明应该放在随手可得的位置。,第三节 多媒体作品交互形式设计原则,4交互设计在界面中必须能够给读者提供帮助减少读者挫败感第三,4交互设计在界面中必须能够给读者提供帮助减少读者挫败感,第三节 多媒体作品交互形式设计原则,4交互设计在界面中必须能够给读者提供帮助减少读者挫败感第三,5、信息或数据的视觉化,在我们的日常工作学习中，大量的信息是人们难以从中筛选,有用的信息，此时信息视觉化，信息体验化，通过特别的信息导航，使用户能够从中得到更深层次的理解，更快的作出决定。,如图，在美国2004大选中，有大量的信息和报道充斥着人们的耳目，TIMES通过一个网络终端把各种数据视觉化，再提供清晰的导航给人们提供信息，使人们可以快速的获得信息，并直观的理解信息并作出决定。我们的日常工作学习。,第三节 多媒体作品交互形式设计原则,5、信息或数据的视觉化如图，在美国2004大选中，有大量的信,6、,交互方式的丰富性,一个多媒体节目里交互性的是否丰富直接影响读者的兴趣，丰富的交互性可以最大限度的吸引读者注意力，达到充分传递信息的目的。,Nike iD美国的交互界面，让用户可以在特定的鞋款上，自己配色、加上个性化的图案。在强调DIY的今天，耐克这个互动界面给用户们提供了一个可以发挥想象力的空间，让他们自己来体验设计、体验耐克文化。这种灵活的控制使得整个多媒体灵活的随着用户的意愿而作出响应。,第三节 多媒体作品交互形式设计原则,6、交互方式的丰富性Nike iD美国的交互界面，让用户可以,7、,交互方式的情感内涵,行为的设计是关于产品看上去和用起来的感受使用产品的全部体验。而反应性则是用户后来的想法，这个产品给用户是怎样的一种感觉，它所描绘的图像，以及它所传达给其他人的关于它的主人的品位形象。,在多媒体节目风筝中，设计师实际上就充分利用了风筝本身的特点来设计交互和转场，达到引起读者情感共鸣的目的。,第三节 多媒体作品交互形式设计原则,7、交互方式的情感内涵在多媒体节目风筝中，设计师实际上就,8、用界面影响用户,在我们的生活中会有很多情感上的反应。,有很多的情感因素会影响用户的选择。所以我们就应该设计一个有情感的界面。,涉及情感界面的一个众所周知的方法就是使用富含有表情的图表和其他图形元素来表达情感状态。当然还有声音。,第三节 多媒体作品交互形