基于移动终端的互动媒体产品设计与制作

王荣荣 谭坤 唐芸莉

摘要：以凤翔泥塑的交互媒体产品设计与实现为研究对象，分析移动终端的特点，并针对这一终端的主要用户进行需求分析，对凤翔泥塑的交互媒体产品进行了概念设计和交互制作研究。研究了视觉设计、交互制作与音效设计三个方面的合作。以实现整体交互功能的方法和流程。并在总结部分对非遗在交互媒体的发展提出了提高交互层次的建议。

关键词：移动终端；互动媒体；凤翔泥塑；非遗传承

1《凤翔泥塑》互动媒体产品总体设计思考

基于移动终端的凤翔泥塑互动媒体产品的设计，并非简单的的将凤翔泥塑的作品图片移植到移动终端上，而是通过可能潜在的用户进行分析，将产品定位于面向各个年龄段、各个职业受众的多媒体电子读物。从当前泥塑工艺的存在状态看，传统的泥塑风格已经已经不能完全契合当代人的审美。传统泥塑作品逐渐成为祈子、护生、辟邪、镇宅、纳福的符号，更多的承载了人们的美好期望。因此，此作品以凤翔传统泥塑为切入点，在对其历史以及传承的介绍以外，在作品赏析部分也着重对其美好寓意进行介绍。

2《凤翔泥塑》互动媒体产品信息架构设计

2.1流程设计

多媒体产品的交互流程主要采用层层递进的形式，开始动画结束后可自动跳到导入页也可以在动画播放的中途点击跳过动画按钮进入导入页，从导入页点击进入后跳转为实景导航页，可以从四个模块中选择自己想要了解的部分点击进入，进入之后为二级导航，展示这一部分的几个小部分，再选择一个点击进入后就是详情页，可以详细了解凤翔泥塑。在二級页面右下角有伸缩导航，可以跳到其余的二级页以及首页退出页等，使交互过程更便捷。

2.2架构设计

为了更全面的介绍凤翔泥塑而且符合大部分读者的浏览习惯，对凤翔泥塑的全部信息进行了分类，将其分为了四大模块，又将这四大模块划分为若干小模块，可以详细了解其历史、工艺、传承大师、风俗奇趣及作品。

3《凤翔泥塑》互动媒体产品界面设计

3.1导入页及导航页设计

我们的设计以简洁大方为主要风格，导入页以黄色为主基调，中间为泥塑两个大字以及陕西凤翔的小字，下半部分为有凤翔建筑特色的屋檐，如图2所示。导航以黑色为主要色调，分为四块内容，每块代表一个模块，鼠标滑过效果以黄色为主基调，下方为西游记中的师徒四人。

3.2二级界面的设计

二级页面为详情页的入口，为了保持整体风格的一致，二级页面也较为简约。二级页面起承上启下的作用，所以没有太多的文字，而是有几个进入三级界面的按钮，使交互过程有了过渡，也会使读者有更好的用户体验。

4《凤翔泥塑》互动媒体产品交互系统的设计与实现

4.1《凤翔泥塑》互动媒体产品交互系统的设计

交互系统设计有别于交互设计，它更强调系统的概念，是由一组相互作用、相互联系的元素组成，并通过产品的使用和创新用户的体验。因此，交互系统的设计与实现需要团队合作，需要研究由人、人的行为、产品使用时的场景和实现技术四个方面组成系统，即交互系统。其中，人指产品服务的对象，即用户。人的行为指在用户产品使用中的动作行为和反馈行为，如点击按钮、声音的打开与关闭等。使用环境是指用户使用产品时所处的环境，包括地理环境、社会环境等。实现技术主要是指为实现用户的所有交互功能而采取的包括硬件和软件技术，如语音识别、多媒体、虚拟现实、网络等。在交互系统设计中，历经需求分析、概念设计和原型设计三个阶段。

需求分析主要是了解用户，包括用户的身份、使用习惯、使用场所等信息。在实际调查中，发现对凤翔泥塑这一传统工艺形式感兴趣的群众还是有很多的，并且想了解更多有关凤翔泥塑的信息。在使用场所分析中，由于手机和计算机作为应用程序载体的便携性，用户往往是在小段空余时间，如在交通工具上、等人、等车中使用，时间多分散、短暂。综上所述，对本产品的需求进行归纳。首先产品面对的用户是广大群众，主要功能是通过交互体验来了解凤翔泥塑这一国家非物质文化遗产，考虑到用户使用环境的特点，在安卓手机端及ipad端打开再关闭可以记忆当前浏览的节点，再次打开时可以自动播放这一节点。

交互系统的概念设计是一系列有序、可组织、有目标的设计活动。在本阶段，交互系统设计为产品规划出基本的功能框架，分析用户在使用产品时所有可能出现的情况，并归纳出各种情况间的逻辑关系和应对方法。一般而言，交互系统中根据应用程序与用户的互动形式，可以将互动行为分为三个层次，分别是反应是互动、主动式互动和双向式互动。其中反应式交互可实现用户操作后，应用程序提供固定的反应，如点击切换下一界面等。而主动式互动需要用户对应用程序提出的问题予以解答，根据不同用户的回答应用程序将给予正误判断或各自相应的答案，如在app中进行拼图游戏等。在交互层次更高的双向式交互中，则是实现用户在使用应用程序时，自身和应用程序均发生变化，双方在互动中互相影响并改变自己，如一些职能玩具可以记录用户的使用习惯、爱好、常用语言等，并调整自身功能，使用户在后续使用中更和谐、更人性化。由于本产品属于电子读物，主要提供图片、视频和文字的展示功能，并需符合人们阅读电子读物的行为习惯，如返回上级界面、返回导航界面、关闭背景音乐或者中途退出等。根据上述需求分析和定位，研究者将交互层次定位为第一层次的反应式互动，主要通过按钮点击控制为用户提供固定的反应活动。

交互系统的原型设计是直接决定整个交互面貌和状态的关键性环节，此项交互媒体产品的交互系统程序包括开始动画、导入项、导航项、二级项等。点击导入页的“点击进入”按钮，即可进入导航页，在鼠标滑过导航页的四个大的按钮时，会有翻页的变化效果，点击即可进入各个二级页面，点击二级界面的按钮即可进入详情页。此外，每一个页面都有退出按钮和控制音乐开关的按钮，可以直接退出和关闭/播放音乐，各个页面都可以返回到上一级页面。二级页面上还有伸缩导航可以不返回实景导航直接跳到其他二级页面。此外还有帮助页，从帮助页上也可以直接跳转到任意界面。跳转到新的页面时都有相应的动画播放，增加其趣味性。

4.2《凤翔泥塑》互动媒体产品交互系统的开发实现

4.2.1交互动画的制作

在交互系统原型设计完成之后，进入交互系统的实现阶段。首先，先把每一个单独界面的动画制作出来，将静态的界面变成动态的界面，这一阶段需要使用flash软件和ID软件来完成。在此过程中要注意动画形式要多样化，要有层次感，使其有趣味性，引发读者的阅读兴趣。然后就是把制作出来的单个界面用编写代码的形式串联在一起，使其可以实现点击按钮跳转相应的界面，而且要保证产品可以流畅播放，不能出现卡顿等影响视觉效果的情况。

应用补间动画、遮罩层动画、设置缓动等方式完成线性导入页动画设计。注意通过時间轴和缓动来设置动画的运动节奏。通过调节实景导航按钮光线的亮度指完成按钮闪光效果。注意闪光动画的运动节奏。添加事件侦听，通过点击窗户可以跳转到其他页面。为减少调用外部swf的数量，在次级界面与其子界面跳转时，可采用调用库中影片剪辑的形式。将要跳转的界面合并到主页面库中，作为一个独立的影片剪辑，并定义其类名字。

4.2.2产品的发布

在所有的功能都实现后，要把产品发布在手机和ipad等移动终端上进行测试，保证可以正常浏览。测试完毕后就可以将整个程序打包发布于各类应用商店中供读者下载浏览。让用户可以在更为宽泛的平台了解凤翔泥塑的信息，对其产生兴趣并投身于非遗的传承与保护中。更新Flash中的Adobe AIR版本，从网上下载AIRSDK_Compiler包。在Adobe Flash的安装目录下新建一个AIR20.0.0.204的文件夹，将下载包解压至该文件夹即可。选择帮助＼管理AIR SDK，然后点击添加根目录新建的AIR20.0.0.204文件夹即可。将要发布的《中华刺绣》所有链接文件拷贝到D盘或E盘根目录下，其中的地址链接不能出现中文字符。打开首页文件进行发布，在属性面板设置发布设置目标为AIR20.0.0.204 for android。点击目标旁边扳手图标进入编辑应用程序设置面板。创建证书、选择横向全屏播放、将AIR运行时嵌入应用程序。

结论

非遗元素为互动媒体产品提供了视觉支持，同时互动媒体又为非遗的宣传工作注入了新鲜的血液，多元化的媒体传播方式为文化的传承与发展提供了有力的支持，扩大了群众对非遗的认知度，对于非遗的保护具有重要的意义。

基金项目：北京电子科技职业学院移动终端交互设计创新团队项目（CGJX2017_XSSZ_003/12）

作者简介：王荣荣（1997—），女，山西人，北京电子科技职业学院艺术设计学院学生。

通讯作者简介：谭坤（1982—），女，山东人，硕士，北京电子科技职业学院副教授，主要研究方向为互动媒体设计。