在Material Design畅销的时期，灵动的动画效果为设计师们称道，MD提出了一整个章节来介绍动效，从理论分析，到实践参数，事无巨细，为推广MD的设计理念确实博了不少眼球。云音乐跟风做了进入歌单页的转场动效，然而效果并不理想，一方面官方代码本身并不完美，存在一些瑕疵；另一方面在转场设计和实现上都不够流畅完美，没能达到预期的效果，在持续了几个版本后终于下掉。

官方的问题

官方文档其实已经非常详尽，我们基本上是参照Google Play里从首页进入app详情页的转场效果，应用到云音乐的歌单里：将歌单封面作为通用元素，通过移动位置，引导用户视线，实现从首页到歌单详情页的过渡。实际在开发时，发现官方代码将动画效果绘制在最顶层，导致移动中的歌单封面会盖住标题栏，即app bar（盖住底部system bar的问题技术小哥解决了）。Google play也出现了同样的问题，说明官方也没有解决。更严重的是，动画经常会造成莫名奇妙的错误，比如侧边栏拉出来时，底部播放条盖住了设置和退出按钮；退出歌单详情页后，封面图仍然残留在原位等等。Android机型差异较大，一开始我们对系统版本进行限制，仅限5.0以上才能看到动效，一些经常会出错的rom干脆直接屏蔽。但是异常还是时有发生，这也是最后下定决心下掉的根本原因。

节奏感

转场动画是一个整体的效果，里面包含了很多小动画的相互配合，速度、层次配合得好，整个动画就会有一种节奏感。点击歌单以后，封面开始向上移动，这是第一个层次；移动到一定距离新页面开始展开，最好是从歌单封面处开始，展开全部的详细信息，这是第二个层次。展开完毕正好歌单移动到最终位置，两个层次一起结束。

理想化的设计常常忽略实际加载和处理数据的时间，比如在详情页的头部，Google Play展开的是一个矢量的色块，云音乐则是模糊的位图，加载位图和处理模糊需要更多的时间，导致其无法跟展开动画衔接上，视觉上会先看到封面移动，然后展开了灰色的色块，再出现模糊过的图片，变成有三个层次，累赘了不少。如果模糊图片已经有缓存，会从灰色色块“突变”成模糊图片，影响观感。同时动画的预处理，导致在首页点击歌单时，有一定的停顿感，不是立刻开始移动，这在性能差一些的设备上尤其明显。

曲线移动

第一次看到Google Play的转场动画，以及其他MD的动效，觉得非常惊艳，身边的设计师们也都表示欣赏，就好像Dribbble上经常看到的开脑洞的飞机稿，终于有机会能够被实现。对于云音乐这样比较成熟的产品，各种设计都趋于模式化，我想如果能加上这样的动效，增加一些新鲜感，对于产品的气质，口碑的传播都是有好处的，所以开始着手研究。但是转场动画上线后，普通用户并不能理解MD的设计，会觉得异样，收到最多的反馈是：为什么歌单封面是弯着移动的？按照MD设计理念，动画应该尽可能地贴近真实世界里的效果，在真实世界里移动都是曲线进行的，起止都有加速度，比如扔东西的抛物线，手臂的移动。这个理念我想设计师都会买单，但是实现出来的效果，非设计师的广大用户们根本不能理解，他们只是觉得好奇怪好拖沓，明明直着走更快嘛，这种时候一切说法都好苍白无力。我记得以前用人体模型调动画的时候，缺乏预备、惯性、缓冲、跟随、交叠等各种细节的动画，观众一眼就可以看出来好假；逼真的动画，即更符合真实世界的规律，观众不用思考就能理解和接受。也就是说，MD的设计理念本身是ok的，但是可能在表现形式上存在问题，歌单封面曲线移动让用户觉得是一个刻意的设计，而不是自然而然的结果。屏幕里的元素如何移动更逼真，可能是需要更深入调研的课题。

繁复

有人会觉得MD的动画有一种浮夸的嫌疑，比如可以直着走的却改成曲线移动说，可以用渐变的却用了波纹展开。MD的规范里提到转场动画的时间应该控制在375ms里，这个时间里有“两个层次”的动画，其实是非常紧迫的，可能就产生了“繁复”的感觉。当这个动画用在一个频繁出现的场景下，问题可能更严重，在云音乐里，打开歌单就是一个非常高频的操作，用户很容易就视觉疲劳了。另外执行动画过程，还是额外花费了时间，反而使进入页面的时间更长了。

性价比

总体来讲，对于歌单转场动画的反馈量其实并不多，小部分的用户中，一半表示很喜欢，一半表示很讨厌，大部分用户是“无所谓”的态度。数据上来看，对歌单的点击量也没有影响。其实每提出一个新的设计都是有风险的，万一不好，就是浪费开发成本，影响使用体验。我们决心要去试水，是因为官方已经先行，并且有现成的代码，开发成本已经降到最低。但是项目过程中，发现还是有一些官方的bug，如果后期还要持续优化，更增加了开发成本。另一方面上线以后也没能如预期提升体验，带来口碑，性价比不高，所以在新版本去掉了。