104
设计实践 Practice
1
1.书桌上收音机与报纸的交互方式２2.放映室的交互设计
多媒体作品中交互行为的设计研究
Research of Multimedia Interactive Behavior Design
张 雯 Zhang Wen付 琳 Fu Lin
内容摘要：多媒体作品的交互性是其存在的意义，然而技术与媒介都是创作的手段，通过这些手段设计有意义的交互行为是关键。本文将深入分析多媒体作品交互行为的设计，探索多媒体作品的发展之路，力求为多媒体交互设计提供可创新的思路。
关键词：多媒体艺术、交互行为、视觉呈现、虚拟体验
多媒体艺术设计诞生于20世纪70年代，其不同于传统艺术最根本的特性是交互性。多媒体艺术设计为用户创造了一个与作品之间进行即时交流与互动的新语境，改变了传统艺术被动欣赏和接收信息的方式，使人们在获取作品内容的同时感受一种特殊的艺术审美与“自在的艺术体验”。
在多媒体作品的使用中，用户通过与作品之间的直接交互行为引发作品发生变化，从而感受变化带来的体验。但不论与作品之间的接口是键盘、鼠标或其他更复杂精密、甚至是看不见的操作，用户与作品之间的关键或根本都是交互行为的设计，即用户使用什么样的动作触
发热区产生变化，而行为带来的体验是能引起使用者愉悦和满意的。这个过程可以分解为使用者发生行为，行为之后触发变化，变化之后产生的心理感受，这三部分就是交互行为设计的全过程。当不借助任何的外接设备，交互动作的发生依然依靠键盘和鼠标，就是点击、拖动等常规动作。当我们将行为与行为之后的画面变化合理搭配，触觉与视听觉完美结合，必将产生出乎意料的新奇表现。多年来，我们致力于多媒体作品的交互设计创新，带领学生创作了许多优秀的多媒体作品，每部作品都试图在交互设计方面有所突破。在实践中总结了以下几点创作方法。
一、交互行为与界面内容相结合
在设计作品的交互行为时要充分考虑作品界面的形式内容，巧妙利用传统的交互方式——鼠标点击、拖动，引发符合界面内容真实情况的画面变化，创造出恰到好处的感官体验。多媒体作品《红色经典》由北京印刷学院设计艺术学院04级多媒体艺术设计方向学生王倩和柳莺合作创作，内容是介绍“八个革命样板戏”的时代特征和艺术特色。作品采用二维手绘风格，还原六七十年代的风貌，虚拟那个年代的剧院场景，使浏览者有一种身临其境的感觉。而作品所要介绍样板戏的一切内容都附加在与其内容相符的剧院实物上，并且交互行为模
拟实物的真实状态。如在资料室里，所有陈设都如同那个年代，老式的书桌、电话、收音机，还有黑胶唱机。鼠标划过书桌上的电话会铃铃作响；点击桌面上的收音机，画面中的手转动收音机频道开始播放关于样板戏的报道；点击桌面上的人民日报，观者看到样板戏的文字报道。这些交互方式设计得非常巧妙，利用收音机与报纸的真实功能，使观者通过交互的行为体验如同生活中的触觉、视觉与听觉，流畅而真实。（图1）
二楼放映室，一切都如同那个年代简陋而真实。桌子上的胶片通过发光效果告诉观者这是热区，鼠标点击产生跟随动作把胶片放在放映机上，放映机开始转动，镜头发
设计实践 Practice
105
出光束，同时画面镜头开始推近，通过墙上的放映孔进入影片播放厅，木偶人的报幕形式将我们更加真实地带回那个年代。画面左下方转动的电影胶片为热区，鼠标点击选择影片片断，屏幕上开始播放影片视频。（图2）
总结来说，这类创作应首先对作品表现的主题内容进行正确、充分的分析，设计与作品内容和表现形式相适合的交互方式；其次交互行为要与界面的内容、热区的性质、媒体的属性相配合，具体讲来即根据界面的环境，热区的形态（图形、文字或是其他形态），热区形态代表的意义（是隐喻型还是形象型），触发热区之后界面发生的变化（界面元素的动态效果、转场等）和所引发的媒体反应（新内容是图片、文字、视音频、动画还是游戏等媒体形式）设置具体的交互行为。
行为与结果的对应，即画面内容为旋转，交互也是通过旋转动作完成，画面表达切水果的状态，交互动作也为切的动作。交互动作以图形形式表现，视觉上即时地呈现使用者的动作，使交互动作后的视觉呈现与交互行为实现完全的对应，真正使触觉与视听觉相对位。这种行为与画面对应的创作方式应该更加丰富地应用于多媒体作品的交互设计上。（图3、4）
点击一次，导航随即消失。导航内容包括主界、返回、帮助、退出等功能，当鼠标移动到代表哪个功能的指针位置时即执行功能。这是多媒体作品在导航设计上的首次尝试，是突破传统的交互表现方式，是利用传统技术创新交互行为最好的实例。（图5）
作品的另一亮点是最大化显示功能。页面的直接进入状态就是恐龙外形的最大化显示，这种最大化是超出一屏显示量的，鼠标移动图片观察每一个细微的地方。右侧面板缩略图显示框中，缩略图跟踪图片移动显示相应的位置，这样既可以使观者清楚地看到细节，又能够整体把握。并且页面通过右侧面板上的缩小和放大按钮切换整体显示和最大化显示状态。这是多媒体作品显示方式的全新尝试，交互方式完全符合功能的需求，全面而又贴切。
而另一部多媒体作品《汴州行旅，聆听画音》，将这种局部与缩略图整体显示相结合的方式更全面体现。作品由06级多媒体艺术设计方向学生徐仕猛、亢小虎等六名同学共同创作，以《清明上河图》为蓝本，数字化地完整展现《清明上河图》全貌，视觉化、形象化地解读北宋时汴州（现开封）的汴河文化。作品采用画卷式展开方式呈现作品内容，观者通过鼠标移动在画卷中任
意畅游，同时界面右上角有汴河风景的俯视图，俯视图上的热点与画卷的移动保持同步，让浸入画面的观众能够随时明确自己的方位。而主动触及地图，地图导航会完整地呈现出来，再现汴河俯视全貌。而作品所要介绍的所有内容都在这展开的画卷中，通过各种热区点击查看，有文字、图片、视频的介绍，还有通过三维建模、动画手段复原建筑形态等，让观者更加真实地感受汴河文化的方方面面。（图6）
可以看出，上述案例依然采用传统的二维技术，突破在于我们切实的考虑行为引发变化的新表现，带来了全新的体验。
三、交互行为的新表现
多媒体作品《飞向蓝天的恐龙》是由05级多媒体艺术设计方向学生张雷、陶丽等六名同学共同创作的。作品采用独特的手绘风格，以手绘化石骨骼贯穿一线，二维动画和三维虚拟相结合，生动展现了“四翼恐龙”的生活环境及其飞行原理。作品最精彩的交互设计之一是图标导航设计。以往图标导航通常出现在作品界面下方，或隐藏式即画面中以一热区代替，触发热区以全部展开。无论哪种类型，界面中总是存在直接或间接热区，而本作品导航设计颠覆以往，使用一个完全隐藏式动态导航，当观者需要导航时，无论身处哪级界面，在任意界面位置按住鼠标左键3秒以上，表针式导航就将以鼠标左键位置为中心跳出，而在导航热区以外任意位置再
结语
“交互性”是多媒体艺术最重要最根本的属性，数字艺术时代下强大和创新作品的交互设计才能使其保持优势。我们要关注人机交互技术的发展，在技术和媒介的支持下，从设计的意义出发，深入分析作品的主题，设计与作品内容和表达形式相符合的交互行为，行为之后的视觉呈现更加丰富和富有新意，这种“新”是感官体验的新感受，并且是能够引起使用者内心满意度的新体验，这样才是具有高层次、高水平和真正意义上的多媒体作品。
二、交互动作后视觉呈现与交互行为的对应
视频交互作品Action 是06级多媒体艺术设计方向学生王晓童和黄浩博合作创作。作品本身的创作目的即在寻求多媒体交互设计的突破，作品采用了两种具有创新意义的交互形式，一种为借助外设备与计算机相配合完成的交互形式，即改变硬性的交互手段；而另一种为
3.交互动作为表现音乐CD转动的旋转动
作，当鼠标画出正确行为时，画面右边的人物以跳舞表示，下方的图标也显示播放音乐的动态效果；反之，画面左边的人物挠头发以示交互行为错误。
4.交互动作为切水果的动作，当画面中的水果被完全切开后，文字提示从开始的“想吃美味的我吗”变成“可以品尝甘甜的水果啦”，下方的橙子图标也不停的跳动；反之画面则毫无反应。5.作品导航设计6.作品界面设计
参考文献：
[1] 王利敏、吴学夫：《数字化与现代艺术》，中国广播电视出版社, 北京，2006。[2] 胡杰：《多媒体编创艺术》，北京艺术与科学电子出版社, 2008。
[3] 廖祥忠：《数字艺术论》，中国广播电视出版社, 北京，2006。
[4] 李四达：《交互设计概论》，清华大学出版社, 北京，2009。
34
56
张 雯 付 琳 北京印刷学院
104
设计实践 Practice
1
1.书桌上收音机与报纸的交互方式２2.放映室的交互设计
多媒体作品中交互行为的设计研究
Research of Multimedia Interactive Behavior Design
张 雯 Zhang Wen付 琳 Fu Lin
内容摘要：多媒体作品的交互性是其存在的意义，然而技术与媒介都是创作的手段，通过这些手段设计有意义的交互行为是关键。本文将深入分析多媒体作品交互行为的设计，探索多媒体作品的发展之路，力求为多媒体交互设计提供可创新的思路。
关键词：多媒体艺术、交互行为、视觉呈现、虚拟体验
多媒体艺术设计诞生于20世纪70年代，其不同于传统艺术最根本的特性是交互性。多媒体艺术设计为用户创造了一个与作品之间进行即时交流与互动的新语境，改变了传统艺术被动欣赏和接收信息的方式，使人们在获取作品内容的同时感受一种特殊的艺术审美与“自在的艺术体验”。
在多媒体作品的使用中，用户通过与作品之间的直接交互行为引发作品发生变化，从而感受变化带来的体验。但不论与作品之间的接口是键盘、鼠标或其他更复杂精密、甚至是看不见的操作，用户与作品之间的关键或根本都是交互行为的设计，即用户使用什么样的动作触
发热区产生变化，而行为带来的体验是能引起使用者愉悦和满意的。这个过程可以分解为使用者发生行为，行为之后触发变化，变化之后产生的心理感受，这三部分就是交互行为设计的全过程。当不借助任何的外接设备，交互动作的发生依然依靠键盘和鼠标，就是点击、拖动等常规动作。当我们将行为与行为之后的画面变化合理搭配，触觉与视听觉完美结合，必将产生出乎意料的新奇表现。多年来，我们致力于多媒体作品的交互设计创新，带领学生创作了许多优秀的多媒体作品，每部作品都试图在交互设计方面有所突破。在实践中总结了以下几点创作方法。
一、交互行为与界面内容相结合
在设计作品的交互行为时要充分考虑作品界面的形式内容，巧妙利用传统的交互方式——鼠标点击、拖动，引发符合界面内容真实情况的画面变化，创造出恰到好处的感官体验。多媒体作品《红色经典》由北京印刷学院设计艺术学院04级多媒体艺术设计方向学生王倩和柳莺合作创作，内容是介绍“八个革命样板戏”的时代特征和艺术特色。作品采用二维手绘风格，还原六七十年代的风貌，虚拟那个年代的剧院场景，使浏览者有一种身临其境的感觉。而作品所要介绍样板戏的一切内容都附加在与其内容相符的剧院实物上，并且交互行为模
拟实物的真实状态。如在资料室里，所有陈设都如同那个年代，老式的书桌、电话、收音机，还有黑胶唱机。鼠标划过书桌上的电话会铃铃作响；点击桌面上的收音机，画面中的手转动收音机频道开始播放关于样板戏的报道；点击桌面上的人民日报，观者看到样板戏的文字报道。这些交互方式设计得非常巧妙，利用收音机与报纸的真实功能，使观者通过交互的行为体验如同生活中的触觉、视觉与听觉，流畅而真实。（图1）
二楼放映室，一切都如同那个年代简陋而真实。桌子上的胶片通过发光效果告诉观者这是热区，鼠标点击产生跟随动作把胶片放在放映机上，放映机开始转动，镜头发
设计实践 Practice
105
出光束，同时画面镜头开始推近，通过墙上的放映孔进入影片播放厅，木偶人的报幕形式将我们更加真实地带回那个年代。画面左下方转动的电影胶片为热区，鼠标点击选择影片片断，屏幕上开始播放影片视频。（图2）
总结来说，这类创作应首先对作品表现的主题内容进行正确、充分的分析，设计与作品内容和表现形式相适合的交互方式；其次交互行为要与界面的内容、热区的性质、媒体的属性相配合，具体讲来即根据界面的环境，热区的形态（图形、文字或是其他形态），热区形态代表的意义（是隐喻型还是形象型），触发热区之后界面发生的变化（界面元素的动态效果、转场等）和所引发的媒体反应（新内容是图片、文字、视音频、动画还是游戏等媒体形式）设置具体的交互行为。
行为与结果的对应，即画面内容为旋转，交互也是通过旋转动作完成，画面表达切水果的状态，交互动作也为切的动作。交互动作以图形形式表现，视觉上即时地呈现使用者的动作，使交互动作后的视觉呈现与交互行为实现完全的对应，真正使触觉与视听觉相对位。这种行为与画面对应的创作方式应该更加丰富地应用于多媒体作品的交互设计上。（图3、4）
点击一次，导航随即消失。导航内容包括主界、返回、帮助、退出等功能，当鼠标移动到代表哪个功能的指针位置时即执行功能。这是多媒体作品在导航设计上的首次尝试，是突破传统的交互表现方式，是利用传统技术创新交互行为最好的实例。（图5）
作品的另一亮点是最大化显示功能。页面的直接进入状态就是恐龙外形的最大化显示，这种最大化是超出一屏显示量的，鼠标移动图片观察每一个细微的地方。右侧面板缩略图显示框中，缩略图跟踪图片移动显示相应的位置，这样既可以使观者清楚地看到细节，又能够整体把握。并且页面通过右侧面板上的缩小和放大按钮切换整体显示和最大化显示状态。这是多媒体作品显示方式的全新尝试，交互方式完全符合功能的需求，全面而又贴切。
而另一部多媒体作品《汴州行旅，聆听画音》，将这种局部与缩略图整体显示相结合的方式更全面体现。作品由06级多媒体艺术设计方向学生徐仕猛、亢小虎等六名同学共同创作，以《清明上河图》为蓝本，数字化地完整展现《清明上河图》全貌，视觉化、形象化地解读北宋时汴州（现开封）的汴河文化。作品采用画卷式展开方式呈现作品内容，观者通过鼠标移动在画卷中任
意畅游，同时界面右上角有汴河风景的俯视图，俯视图上的热点与画卷的移动保持同步，让浸入画面的观众能够随时明确自己的方位。而主动触及地图，地图导航会完整地呈现出来，再现汴河俯视全貌。而作品所要介绍的所有内容都在这展开的画卷中，通过各种热区点击查看，有文字、图片、视频的介绍，还有通过三维建模、动画手段复原建筑形态等，让观者更加真实地感受汴河文化的方方面面。（图6）
可以看出，上述案例依然采用传统的二维技术，突破在于我们切实的考虑行为引发变化的新表现，带来了全新的体验。
三、交互行为的新表现
多媒体作品《飞向蓝天的恐龙》是由05级多媒体艺术设计方向学生张雷、陶丽等六名同学共同创作的。作品采用独特的手绘风格，以手绘化石骨骼贯穿一线，二维动画和三维虚拟相结合，生动展现了“四翼恐龙”的生活环境及其飞行原理。作品最精彩的交互设计之一是图标导航设计。以往图标导航通常出现在作品界面下方，或隐藏式即画面中以一热区代替，触发热区以全部展开。无论哪种类型，界面中总是存在直接或间接热区，而本作品导航设计颠覆以往，使用一个完全隐藏式动态导航，当观者需要导航时，无论身处哪级界面，在任意界面位置按住鼠标左键3秒以上，表针式导航就将以鼠标左键位置为中心跳出，而在导航热区以外任意位置再
结语
“交互性”是多媒体艺术最重要最根本的属性，数字艺术时代下强大和创新作品的交互设计才能使其保持优势。我们要关注人机交互技术的发展，在技术和媒介的支持下，从设计的意义出发，深入分析作品的主题，设计与作品内容和表达形式相符合的交互行为，行为之后的视觉呈现更加丰富和富有新意，这种“新”是感官体验的新感受，并且是能够引起使用者内心满意度的新体验，这样才是具有高层次、高水平和真正意义上的多媒体作品。
二、交互动作后视觉呈现与交互行为的对应
视频交互作品Action 是06级多媒体艺术设计方向学生王晓童和黄浩博合作创作。作品本身的创作目的即在寻求多媒体交互设计的突破，作品采用了两种具有创新意义的交互形式，一种为借助外设备与计算机相配合完成的交互形式，即改变硬性的交互手段；而另一种为
3.交互动作为表现音乐CD转动的旋转动
作，当鼠标画出正确行为时，画面右边的人物以跳舞表示，下方的图标也显示播放音乐的动态效果；反之，画面左边的人物挠头发以示交互行为错误。
4.交互动作为切水果的动作，当画面中的水果被完全切开后，文字提示从开始的“想吃美味的我吗”变成“可以品尝甘甜的水果啦”，下方的橙子图标也不停的跳动；反之画面则毫无反应。5.作品导航设计6.作品界面设计
参考文献：
[1] 王利敏、吴学夫：《数字化与现代艺术》，中国广播电视出版社, 北京，2006。[2] 胡杰：《多媒体编创艺术》，北京艺术与科学电子出版社, 2008。
[3] 廖祥忠：《数字艺术论》，中国广播电视出版社, 北京，2006。
[4] 李四达：《交互设计概论》，清华大学出版社, 北京，2009。
34
56
张 雯 付 琳 北京印刷学院