MG动画中界面动画与传统动画

  界面动画是一个全新的领域,它不同于以往任何一种动画形式,它是界面设计、传统动画、视觉特效等领域的一个交叉学科。传统动画的媒介作用在界面动画中的体现尤为明显。传统动画历史久远,已经发展出一套完整的体系来表现图形符号的变化。动画原理、运动规律、创作表现手法及创造性的分解与重构运动形态的思想对界面动画、MG动画和特效的创作都有重要的借鉴和指导意义。例如,谷歌在规范中对非对称性形变动画的描述:“一个矩形在放大过程中,宽与高的变化并不同步进行,这样能够使动画更具有细节”。显然这样的过程就是对现实世界运动过程的创造性还原和分解,用简单的方式实现了一个形变的效果,如图1-12所示。

  在最新的Material Design中也正式引入的“Strech”(拉伸)概念,用拉伸动画来表示界面中高速运动的元素。如图1-13所示,小球从a点移动到c点的过程中会处于拉伸状态。了解动画运动规律的读者会比较熟悉,这是传统动画中常用的“挤压与拉伸”原则。当物体受到力的作用时会产生一定程度的变形,挤压表现为物体形状的压缩,拉伸表现为物体形状的伸长。挤压和拉伸可用于表现物体的速度、动量、重量和体积,使物体看起来有弹性、有质量。

  在传统动画中,经常见到角色或道具发生挤压与拉伸的形变,如图1-14所示。形变动画特别能体现动画的精髓。毕竟在纸上或屏幕上去表现物体的动态与现实不同,如果只是机械地模仿和还原客观事物的运动形态会让动画变得僵硬、枯燥、缺乏表现力。所以传统动画强调创造性地分解和还原客观事物的运动形态,在动画过程中加入作者的主观动机,挑选重要的瞬间加以适度的夸张和强调,才能够更好地表现受力物体的重量、质感和运动状态。同样,在界面动画中适当加入形变元素,能让界面摆脱机械和僵硬,变得生动,令人印象深刻。图1-15所示为Mac系统窗口最小化动画,图1-16所示为QQ下拉刷新动画。

  Material Design也将角色动画引入界面动画中,角色动画的制作更需要对动画运动规律的理解和掌握。传统动画中还有很多原理和技巧可以被借鉴到界面动画中,如预备动作、跟随和重叠动作、次要动作,镜头与景别的用法等。传统动画的重要性正在逐渐显现出来。
  然而,很多时候动画基础知识对界面动画的重要性是被忽视的。虽然界面动画产生自产品的需求,但对于动画本身的实现、动画细节的处理、节奏感的控制、关键帧的调整等都需要一定的动画基础。如果对动画运动规律和表现手法一无所知,仅凭想象去做,就会导致动画很奇怪。所以UI设计师、个体开发者、产品经理想要了解界面动画,一定要对动画基础知识也有所了解。另外,作为一个新行业,很多企业、公司或个体开发者对界面动画本身不够重视,导致系统、应用、游戏界面动画体验较差。
  文中为何没有使用“动效”而使用了“界面动画”一词?虽然“动效”这个词对读者来说会比较熟悉,但是它的含义并不准确。游戏特效的制作人员也将他们的工作称之为“动效”,电影拟声的工作也叫“动效”。在网上搜索“动效”这个词,只有一个相近的词条就是“电影动效”。所以“动效”一词只是一种口头说法,而“界面动画”的描述就比较准确,指用户界面上元素的动态,所以本书中会统一使用“界面动画”一词。