在今年的LoveLive!新春会中，我参与了一部分美术工作。除宣发海报、邀请函与正在制作中的感谢信等静态的平面设计外，也设计了安可转场的动画。这是我第一次涉及动效设计，因此想要写一个专栏记录一下自己的感想并补充一些制作过程。

这个安可转场动画是八九寺提出的致敬虹咲5th live一个企划，交给了我来设计。我负责了所有美术素材与动效的设计，郁苗协力了角色的Q版化，最终最苦最累的后期制作是嘟嘟噜完成的（他已经对我设计的关键帧过多的设计PTSD了），弹幕的文案是仔仔与黑羽完成的，音效还是嘟嘟噜添加的。

(资料图片仅供参考)

设计思路

之前虽然有做过一点平面设计的东西，但都是静态的图片，从未参与过动态的设计。接到设计需求之后我看了一下参考对象，大致了解到是需要有三个要素：

一个类似于进度条的东西（时长3分钟左右）

一个弹幕框（）

LL的角色要出现

此外，作为一个转场动画，需要做前后的衔接。关于风格，我延续了之前海报与邀请函的纸片风格：简单来说就是简约图形+弥散投影，像是一张纸片浮在上面。这种风格的优点是容错率高，缺点则是若要让人感觉“很有设计”则需要更多的投入。

我准备把进度条设计为一个纸片风格化的新春会LOGO，弹幕借鉴一些较为常见的样式即可。角色素材一开始是打算直接使用小剧场的，但做动效时候发现两个问题：1）小剧场的角色立绘均是正面的，与之后的动效不协调；2）画风不符。

LOGO的风格化

这一部分是我的工作主要内容，我们先看一下原版的LOGO：

我把它分解为了三个部分

顶部：兔耳与五角星

中部：LoveLive!

底部：新春会

从简单的开始处理。首先，底部的“新春会”三个字不太可能抽象化为简单的几何图形，可以放入其他图形中。顶部的五角星本身就是较为简单的几何图形，可以保留；兔耳是条状物，可以如此抽象化。School idol project字样可以省略，并不重要，且在原LOGO中面积占比较小。顶部与底部较好处理，但中部是主体，需要首先确定下来。

主体部分

几何

之前为LoveLive Music Player做UI的时候进行了一点字体设计，因此对于中部LoveLive!的风格化也在思路上有类似，例如：

尽可能使用“正”的几何图形，例如字母o变为正圆；

把每个字母的高宽比变为方形——当然，这样作为正文文本会损害可读性

需要的时候把小写字母变为大写的以方便设计

最终经过一番折腾，几何形状做出来了：

左边的L和O相信大家不难认出，O右下角的V则是旋转了45°的L，V上方的e则先是变成了E再抽象成了

至于第二个L下方的i，则是通过与L的遮挡关系做出了一点一竖。所有的字母均是从一个横竖三等分的正方形纸张上裁剪下来的：

I就是只有三分之一宽度的矩形，O的外径是内径的三倍。这样各个元素之间的呼应就增强了。

字母之间的相互关系也是基于LOVELIVE的字母顺序进行了一定程度的调整，加入更多的“对称”。例如O的中点在L右端的顶角，第一个V和E当中的间距（45°方向）也正好是三分之一的正方形宽度。但也有一些地方刻意打破了这些贴合对齐，例如第二个L的左侧实际上并没有和第一个VE的角重合，而是稍微向左了一点，表现出倾向性，可以让画面更有向心力。

但是作为进度条观众还是会看不懂。所以我在弹幕那边做了一个清晰的提示，在后文讲。

配色

之前做的很多设计我都是尽可能使用少的颜色，基本上集中在两个颜色附近，且一个为占了绝对多数。但是让观众盯着这样一个东西三分钟可能会比较无聊，于是就把原LOGO上的四颗星星的颜色拿来用了：

LOGO的其他部分

最开始设计的兔耳就是弯曲的纸条，弯曲后能看见另一面的。但这带来了风格上的冲突：虽然都是纸片，但这不扁平化；而且有了过于自然的弯曲，反而在这横平竖直的世界里不自然了。最终决定还是做成折叠的形式。

”新春会“是写在矩形的纸上的，那么就需要考虑纸张是正着摆还是斜着摆，字是正着还是斜着；排列组合一下也就四种，于是就得到了

这里顺便加上了背景，颜色后来也是调了一会儿的。比如这里紫色深一点，用在了下方图层的字母，以及最外面一颗星上，不会和其他颜色那样亮眼。星星最终和兔耳统一，做成了折纸风格。

弹幕

这个风格与之前设计的邀请函有些类似。先说顶部的LOVELIVE吧，那个就是为了解决大家看不懂LOGO而作的副进度条。LOGO的字母会依次从方形纸张上裁剪下来，安装到背景板上；每完成一个，就点亮一个字母（从白色变成紫色）。

弹幕框设计中最大的困难是容易显得太过简单，于是我在边框和背板上添加了纹理（背板的纹理实际上就是虹咲格裙的纹理）:

弹幕的动效是我用Animate（曾经叫做Flash）做的demo，后期用Ae完成的。我比较喜欢这种弹出的效果，有活力。

于是现在整体效果就成了：

不要在意弹幕框进度条为什么没满的事情。接下来就是思考动效了

动效

为了更好地和后期沟通，我做了一个小册子来解释我的想法。可以看见小册子上还保留着很多最初的设计想法，与成品不太一样。

我先设计了主体的动效。LOGO作为进度条，分为上中下三个部分并行，以中部为主进度条：顶部是折纸+安装于背景板上，中部则是裁剪粘贴，底部要手写；都是由角色完成的（关键帧爆炸）。

入场

最终背景板的移动变成了匀速运动，但加入了角色的腿部动作（腿绕着固定点走椭圆路径，角度不变，两腿反相）；弹幕框安装的实现也有所简化

这个甚至似乎还能做成周边：

选择了初代Leader穗乃果作为第一个登场的角色，同为初代偶像的大力海未搬运弹幕框

主体

很显然，这些后来都变了。兔耳的设计改成了折纸，星星的折纸被优化掉了，“新春会”也变了设计。注意到，即使是最新版的LOGO，“会”的字体也是不一样的，因为本来打算让可可写“新春”，岚珠写“会”（这两个都是中国角色）

这里可以看见曾经的配色，后来蓝色变成了深紫色。切割动效也是进行了进一步的抽象，不然难以实现。

看一眼工具：

美工刀参考了OLFA的墙纸刀，而凳子其实当时设计的时候加入了别的脑洞：

可组合的凳子（后来还设计了靠背组件，但是草图不知道丢哪了）

运动路径以及缓动曲线，因为自己的专业原因，会提出一些没他多乱用的细节要求。放一张当时解释被裁剪下来的纸片如何飘落的草图：

后期：再也不和学物理的合作了

出版的弹幕框配色真的是辣眼睛啊。这里的置顶消息就是上文的副进度条。我做的demo：

离场

这里有模仿Paramount的那个星星飞入的电影片头动画。

角色设计

最开始的设计是这样的

在八九寺的提一下参考了清濑老师的风格，变成了

这件T恤还用在了安可之后的新春特供版缭乱大马路上。以步梦作为模板，郁苗绘制了其他角色的草图，我再用Ai完成了矢量化。

坏了…突然发现没有水团的角色，我要被炎上了

写在后面

首先再次感谢八九寺、嘟嘟噜、郁苗、仔仔与黑羽的付出。这次大家或多或少都受到了疫情的影响，明年会更好。由于我从来没设计过动效，也不了解Ae的操作，因此设计出来就做好了被疯狂删改的准备了。但是，设计出不符合产能的动效，只会增加大家的工作负担，而且妥协后的最终结果可能也会远低于预期。虽然最终的完成度还是高于我的预期的。但是，我以后的设计会更加注重性价比，能用有限的时间精力做出更好的效果。

昨天与制作组的大家一同复盘了新春会，发现整个新春会的美术以及制图还有很多可以改进的地方。在明年的新春会中，我考虑参与更加全面的美术设计，做好新春会的branding design