[{"data":1,"prerenderedAt":541},["ShallowReactive",2],{"page-Pipeline-1":3,"page-count-Pipeline":540},[4],{"id":5,"title":6,"body":7,"date":517,"description":13,"extension":518,"meta":519,"navigation":522,"path":534,"seo":535,"stem":536,"tags":537,"__hash__":539},"blogs\u002F_legacy\u002F2020\u002F2020-09-26-princess_connect_re_dive_animation_flow_note.md","公主连结Re:Dive的UB动画制作手法",{"type":8,"value":9,"toc":489},"minimark",[10,14,23,26,29,34,37,40,43,56,60,63,66,69,73,76,79,82,85,88,95,98,103,106,109,112,115,118,123,126,129,132,135,138,143,146,149,158,161,164,167,178,194,199,202,205,210,213,224,227,232,235,238,241,244,247,252,255,260,263,266,271,274,279,282,287,290,293,296,301,304,307,312,315,318,321,332,335,338,343,346,351,354,357,360,363,366,369,374,377,382,385,388,393,396,399,402,407,410,413,416,419,424,427,432,435,438,441,446,449,455,458,463,466,469,474,477,480,483,486],[11,12,13],"p",{},"翻CEDEC的slide的时候看到的，PCR官方的UB动画制作分享。",[11,15,16,17],{},"CEDEC2020：",[18,19,20],"a",{"href":20,"rel":21},"https:\u002F\u002Fcedec.cesa.or.jp\u002F2020\u002Fsession\u002Fdetail\u002Fs5e61f1793b481",[22],"nofollow",[11,24,25],{},"pcr最近有在玩，因为基本每天登陆下就可以了，所以还是比较轻松的。虽然开B服的时候有不少人吐槽战斗是几年前国内页游的水平，但是实际上还是有很多让玩家感到舒服的精巧的设计的。",[11,27,28],{},"这边的分享更加倾向于制作手法，没有什么技术上的点，所以贴图的情况比较多~",[30,31,33],"h2",{"id":32},"pcr的ub演出","PCR的UB演出",[11,35,36],{},"首先要看的是pcr的战斗模式：使用SD角色进行战斗，在UB时播放动画。",[11,38,39],{},"一般单场战斗己方可以上五个角色，然后在行动过程中会累计TP，TP满了就可以放UB。和FGO的宝具差不多，总体而言就是大招。看完这个分享就多少有点理解为何FGO官方一直不肯跳过宝具动画了，大概……",[11,41,42],{},"主要介绍的内容为",[44,45,46,50,53],"ol",{},[47,48,49],"li",{},"将动画演出融入游戏的方法",[47,51,52],{},"手描动画与组件动画的融合和制作流程",[47,54,55],{},"SD与动画的统一感",[57,58,59],"h3",{"id":59},"流程对比",[11,61,62],{},"动画与游戏在制作流程上有很大的不同：",[11,64,65],{},"动画通常会有数个月到半年左右的规划，制作上很难进行回退",[11,67,68],{},"游戏则需要连续性的不断推出短的动画，在必要的时候也会对动画进行替换或重制",[57,70,72],{"id":71},"ub动画的作用","UB动画的作用",[11,74,75],{},"最大限度的表现角色的魅力",[11,77,78],{},"通过2秒的动画让战斗场景更生动",[11,80,81],{},"过场动画和剧情动画的统一感",[57,83,84],{"id":84},"部件动画",[11,86,87],{},"PCR的战斗SD与UB都是采用部件动画的形式：",[11,89,90],{},[91,92],"img",{"alt":93,"src":94},"image","\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb.png",[11,96,97],{},"UB动画：",[11,99,100],{},[91,101],{"alt":93,"src":102},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-1.png",[57,104,105],{"id":105},"使用组件动画的理由",[11,107,108],{},"一开始是使用手绘动画的，但是与SD动作的节奏感融合感不够，导致感知上不够顺滑。而战斗的节奏感是PCR的体验核心，所以这里的违和感是致命的。",[11,110,111],{},"对前作进行参考的话，前作的技能切入过场是使用Flash制作的，当然使用的是部件动画。由于与SD使用的是同样的方法，在切入技能过场时有统一的节奏感。同时，由于使用部件的形式，可以在减少成本的同时获得不错的演出效果。",[57,113,114],{"id":114},"制作流程的变更",[11,116,117],{},"更多的流程留在了工作室内部，外包的方式不同，对制作流程有了更好的控制。",[11,119,120],{},[91,121],{"alt":93,"src":122},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-2.png",[11,124,125],{},"使用部件动画的UB的好处之一是：需要绘制的原画数量变少了",[11,127,128],{},"使用动画流程的话，一个UB需要16张原画。使用组件动画的话，由于动作是按照分割部件的形式来实现的，只需要最多7张就够了。",[11,130,131],{},"同时广泛使用部件动画能够在内部形成足够的技术累计，最终由专门的团队来负责组件动画的制作。",[30,133,134],{"id":134},"制作流程",[11,136,137],{},"总体的制作流程分为四个阶段：分镜、作画、动画、摄影",[11,139,140],{},[91,141],{"alt":93,"src":142},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-3.png",[11,144,145],{},"使用的工具：Clip studio paint ex、Adobe animate 、Adboe After effect",[11,147,148],{},"分享中使用的制作实例是：似似花的UB，这个角色具有以下特征：",[150,151,152,155],"ul",{},[47,153,154],{},"七冠-强力角色",[47,156,157],{},"变身和分身制作的能力",[57,159,160],{"id":160},"事前商议",[11,162,163],{},"基于规划者提出的演出计划进行讨论",[11,165,166],{},"确定UB的整体印象",[44,168,169,172,175],{},[47,170,171],{},"从什么地方开始进行切入过场动画演出",[47,173,174],{},"如何与SD的演出保持关联性",[47,176,177],{},"UB整体的色彩氛围和方向性的确立",[11,179,180,181,185,186,189,190,193],{},"演出计划：在自己的",[182,183,184],"strong",{},"面前","生成",[182,187,188],{},"数字化","的分身，在",[182,191,192],{},"躁点演出","后实体化",[11,195,196],{},[91,197],{"alt":93,"src":198},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-4.png",[57,200,201],{"id":201},"分镜",[11,203,204],{},"有3种分镜方案",[11,206,207],{},[91,208],{"alt":93,"src":209},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-5.png",[11,211,212],{},"最后使用的是C，分镜由于不全所以不是很懂为什么说是C。选择C的理由是",[150,214,215,218,221],{},[47,216,217],{},"有作弊感的数字特效和动作",[47,219,220],{},"万花镜一般的效果演出",[47,222,223],{},"提高转到SD部分的期待感",[11,225,226],{},"万花镜的特效在SD演出阶段也会使用，最后作为魔法阵演出保留在场景内",[11,228,229],{},[91,230],{"alt":93,"src":231},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-6.png",[11,233,234],{},"同时保证整体动画的前进方向与战斗的前进方向保持一致。",[11,236,237],{},"分镜阶段的作用：通过共通的总体印象来将UB与世界观统一在一起，分镜会为后面动画制作树立一个参照，同时让所有的制作人员能够比较轻松的对最终的目标动画形成一个印象。",[11,239,240],{},"分镜使用Clip studie paint ex和Adobe animate制作。",[57,242,243],{"id":243},"作画",[11,245,246],{},"使用软件为Clip studie paint ex，最终输出原画4~7张",[11,248,249],{},[91,250],{"alt":93,"src":251},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-7.png",[11,253,254],{},"与动画的制作流程不同，因为是部件动画，直接在原画分割后的部件上作补间。",[11,256,257],{},[91,258],{"alt":93,"src":259},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-8.png",[11,261,262],{},"相对于传统动画而言，必要的原画数量变少了。但是对单张原画的品质要求导致在每张原画上花费的成本也变高了。",[11,264,265],{},"下面的是单张原画的流程，由于都是图片所以直接贴出来了",[11,267,268],{},[91,269],{"alt":93,"src":270},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-9.png",[11,272,273],{},"需要遵守作画参考资料，正确的把握各个角色的特色",[11,275,276],{},[91,277],{"alt":93,"src":278},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-10.png",[11,280,281],{},"部件的划分基于分镜进行",[11,283,284],{},[91,285],{"alt":93,"src":286},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-11.png",[11,288,289],{},"作画流程：通过节省原画的枚数，在保证质量的同时提升量产能力。在单张原画上投入更多的时间也就可以保证与监修之间的意见沟通，防止动画中角色的个性出现崩坏。",[57,291,292],{"id":292},"动画",[11,294,295],{},"使用After Effect，因其具有优秀的Mesh处理功能，可以方便的对部件动画进行制作。同时，后面的摄影流程也使用同样的工具，可以避免在不同的工具之间导入导出产生的各种问题。",[11,297,298],{},[91,299],{"alt":93,"src":300},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-12.png",[11,302,303],{},"在制作过程中留意视线诱导，使得角色的脸或者武器的动作更加突出的表现出来。由于PCR的战斗是向右进行的，所以在制作过程中要尽量保证动作整体是向右前进的。",[11,305,306],{},"为了让效果更接近传统动画的表现，逐帧的对动作进行控制，而不是使用关键帧来带过，让动作幅度产生连续感。",[11,308,309],{},[91,310],{"alt":93,"src":311},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-13.png",[11,313,314],{},"对于似似花，通过角色具有的拷贝能力和水晶的印象进行联想，使用万花镜特效来表达角色特性。",[11,316,317],{},"特效部分使用ClipStudio和Photoshop进行手绘。手绘的特效以传统动画的表现为目标，例如运动的轨迹会在画面中进行表现残留。对于破碎和扩散的特效，使用手绘动画也能更好的进行表现。",[11,319,320],{},"整个动画流程中重要的点",[44,322,323,326,329],{},[47,324,325],{},"留意动画的易懂性和连续性：在设计中对战斗的前进和方向与视线诱导进行重复考量",[47,327,328],{},"尽量接近传统动画的表现：使用逐帧变化、采用手绘特效",[47,330,331],{},"注重角色特性：设计演出时考虑该角色的特性",[57,333,334],{"id":334},"摄影",[11,336,337],{},"这个流程使用Adobe After Effect，并不是指单纯的对动画进行摄影输出。而是指添加各种后期特效",[11,339,340],{},[91,341],{"alt":93,"src":342},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-14.png",[11,344,345],{},"一些特殊的UB还会添加逆光、闪光特效或者Motion Graphic",[11,347,348],{},[91,349],{"alt":93,"src":350},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-15.png",[57,352,353],{"id":353},"流程总结",[11,355,356],{},"整体流程的目标是让UB的过场切入与战斗的SD保持演出上的一致性，通过采用关键帧的动画，投入更多的时间到单帧的同时提高制作速度。在制作时追求传统动画的效果来精细的调节动作以及对特效采用手绘，最终制作出充满角色个性的UB动画。",[30,358,359],{"id":359},"新尝试",[11,361,362],{},"通过各种新的尝试，比以往的过程动画更加华丽，更接近于传统动画的风格。",[57,364,365],{"id":365},"系统",[11,367,368],{},"将SD与过程动画更多的融合在一起",[11,370,371],{},[91,372],{"alt":93,"src":373},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-16.png",[11,375,376],{},"将各个部分融合成一个完整的动画以特破演出表现的限制",[11,378,379],{},[91,380],{"alt":93,"src":381},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-17.png",[57,383,384],{"id":384},"演出",[11,386,387],{},"这边是以公主UE的UB为例子，通过背景的表现让演出感变得宏大，同时对摄像的移动进行精细控制让空间感变得更强。",[11,389,390],{},[91,391],{"alt":93,"src":392},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-18.png",[11,394,395],{},"不过很想吐槽：这个UB是真的长，但是却没有伤害，白瞎了特效……",[57,397,398],{"id":398},"世界观",[11,400,401],{},"主要强调与世界观的一致性，在蝶妈的UB表现上，采用了与游戏内剧情动画一致的演出和摄影特效。",[11,403,404],{},[91,405],{"alt":93,"src":406},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-19.png",[57,408,409],{"id":409},"制作流程变动",[11,411,412],{},"在流程上先确立UB的分镜，然后通过分镜同时对SD的动画和UB动画进行制作。",[11,414,415],{},"这样可以在保证动作一致性的同时对特效的绘制进行一定程度的共享。",[11,417,418],{},"最后在摄影流程中对特效进行融合以及加上翅膀的特殊处理",[11,420,421],{},[91,422],{"alt":93,"src":423},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-20.png",[11,425,426],{},"新流程的尝试：",[11,428,429],{},[91,430],{"alt":93,"src":431},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-21.png",[57,433,434],{"id":434},"新的问题",[11,436,437],{},"添加过多演出要素导致动画过程破坏战斗的节奏。",[11,439,440],{},"例子是蝶妈的UB，有时候确实会因为这个UB太长而不让她上场……",[11,442,443],{},[91,444],{"alt":93,"src":445},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-22.png",[11,447,448],{},"基于节奏感在AfeterEffect中对场景的明暗切换进行精细调整",[450,451,452],"blockquote",{},[11,453,454],{},"S.C. （スイッチチェンジ）＝一瞬に照明を変化させる事 （カットチェンジとも言う）",[11,456,457],{},"另外在系统上可以关闭UB演出，以及Shadow类敌人的动画都会导致演出控制上遇到麻烦",[450,459,460],{},[11,461,462],{},"Shadow是PCR的一种特殊敌人，相当于敌方持有己方的角色来使用",[11,464,465],{},"如果关闭了UB演出的话，则从整个演出中比较好接上的部分开始动作播放。",[11,467,468],{},"对于shadow角色的UB则额外的进行制作：",[11,470,471],{},[91,472],{"alt":93,"src":473},"\u002Fwp-content\u002Fuploads\u002F2020\u002F09\u002Fimage_thumb-23.png",[11,475,476],{},"这个在玩的时候真的没注意到是分开制作的，可能是动画的流程不一样？脸比较黑没抽到这个角色……",[30,478,479],{"id":479},"总结",[11,481,482],{},"UB动画相当于2秒中的“角色PV”，是能够重复的表现出角色的魅力和个性的地方。",[11,484,485],{},"制作手法充其量只是将想要表现的事物实现出来的手段，为了达到这个目的去寻找最好的制作手法是创作者的使命。",[11,487,488],{},"PCR的UB动画的目标是：将角色的魅力传达给玩家。",{"title":490,"searchDepth":491,"depth":492,"links":493},"",2,3,[494,501,509,516],{"id":32,"depth":491,"text":33,"children":495},[496,497,498,499,500],{"id":59,"depth":492,"text":59},{"id":71,"depth":492,"text":72},{"id":84,"depth":492,"text":84},{"id":105,"depth":492,"text":105},{"id":114,"depth":492,"text":114},{"id":134,"depth":491,"text":134,"children":502},[503,504,505,506,507,508],{"id":160,"depth":492,"text":160},{"id":201,"depth":492,"text":201},{"id":243,"depth":492,"text":243},{"id":292,"depth":492,"text":292},{"id":334,"depth":492,"text":334},{"id":353,"depth":492,"text":353},{"id":359,"depth":491,"text":359,"children":510},[511,512,513,514,515],{"id":365,"depth":492,"text":365},{"id":384,"depth":492,"text":384},{"id":398,"depth":492,"text":398},{"id":409,"depth":492,"text":409},{"id":434,"depth":492,"text":434},{"id":479,"depth":491,"text":479},"2020-09-26","md",{"layout":520,"status":521,"published":522,"author":523,"author_login":525,"author_email":526,"wordpress_id":527,"wordpress_url":528,"date_gmt":529,"excerpt":530},"post","publish",true,{"display_name":524,"login":525,"email":526,"url":490},"风铃","flinkor","flinkor@foxmail.com",3056,"\u002F?p=3056","2020-09-26 03:29:25 +0000",{"type":8,"value":531},[532],[11,533,13],{},"\u002F2020-09-26-princess_connect_re_dive_animation_flow_note",{"title":6,"description":13},"_legacy\u002F2020\u002F2020-09-26-princess_connect_re_dive_animation_flow_note",[538],"Pipeline","iL162DNsiBd6Brv4tyWTQWKWG-H1KOnN3wMWryLIWrI",1,1788763181268]