赞助商
立即赞助

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

产品经验3年前 (2021)发布 流光
3.4K 0 0

项目背景

2019春节间,QQ包运营活动行了全新改版,将卡券福利、金奖励打包福袋形式,并通过俗小游戏及共享福袋的玩法吸引多用户参与。点击福袋入小游戏的界面,我们推出了QQ空间新福袋品视频,希望用户在等待加载过程感受到新氛围,时也加强空品认知,深化其与品情感联动。

项目设过程中面临两难题:一项目周较短,虽然视频素已雏形,但短时间需重新确立基调及建模渲染,输出完整的3D视频,对团队确实不小的挑战。其次则需考虑如何好新春氛围营造品牌认知传达之间平衡融合。

项目流程

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

  1. 概念探索

首先从空间的品牌Logo出发,进行了创发散,在众多关键词中梳理出了一条以「空间星球生产红包」为主题的故事线。空间星球作为大景不仅可以清晰地传递出品牌认知,也可以造出兼容性较高的界观,整不同主题的素;而生产红包的概念则用于展现运营活动的量活力,而红包为装饰素也能更直观地造节日氛围。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

  2. 故事线

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

故事分镜

动画的剧本以「探索星球-产包-新春尽空间」线索递。画面第一幕将空间星球的背景中,观众将随远景镜探索城市的全貌,随后镜拉近聚焦包厂的产流程。第二幕由近景镜随包天穿越云层,并切换追踪 UFO,完面云层的转场衔接,后空间星球伴随新春元素旋转场,Logo 格完品牌展示。了保证动画转场与镜运动的流畅性,我们以 Motion Camera 切换追踪目标的方式行拍摄,希望能营造出一镜到底的穿梭感。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

场景设计

虽然镜到底构思能加强故事串联性,是从场景设计度而言,将3D模型全部创在个场景里可能会造成镜头路径卡顿与灯不均等问题。此我们将场景拆分为三个模块:空球城市、红工厂、品灯笼。后期再以剪接手法造缝镜头感。另由于最终需要输出竖构图视频,三个场景设计皆以三构图作为基准。

  • 空间星球城市:以空间Logo星型作为延展,以城市为主题承载着各种以产品业为型的概念建筑。红包工厂则被安排在城市的视觉中心,希望能全景展示空间性,同也方便后期镜头位,带出红包玩法。
  • 红工厂:工厂结构为带玻璃穹顶旋转圆盘,其展示了物料传输与形变、染色封等制作红工序,希望能让用户感受到节红料足、量多、不尽氛围。
  • 品牌灯笼:作故事后的转合,场景以承载城市的灯笼旋转格收尾,呼应星球主题也契合新春感知。背景增加云层平衡构图,景则使用爆竹弹射粒子动画调动喜庆绪。

前期为了节约时,我们先在充满灵魂手稿上迅速成场景结构共识,后续再模情况进动调。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

  3. 元素建模 场景融合

确立景后,根据空间的业性及新春氛围进行了素提取快速建模。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

再以城市建筑群为整体,将业素春节素依循何节奏整同一群组中。虽然群组化的过程需要进行不断的摸索和修正(受后期物体固有色或灯光的响),但是完成此步骤后,无论是视频大景拍摄还是输出体组素材,都能较好的保证模型的整体复用性和局部细度。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

最后再依照三角构图的比例为画面,将模型组按照对应角度安插在大景中。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

  4. 色彩提取 质感塑造

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

在色彩的规划上,我们对春节题进行了情绪分析与炼,最终确定了金色和红色作为色。红色负责打整体氛围,而金色和QQ空间牌在色相上既有一定的联,同时画面的质感更浓烈细腻;白色则可给予画面呼吸的空间,缓解饱和带来的视觉刺激。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

在配色较为热烈的基调上,材质时我们更偏向轻量的雾面质感,对光进行收拢,并在分红色材质上增丝绒肌,营温暖亲的观感。空间2019年限定色号口红,了解一?

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

  5. 动画预合成

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

动统一

在动画计的部,含动效物体(工厂圆盘、船、黄钻、火箭等)的位移动向和旋转方向皆统一为逆针,同也为其循环动画制定了相同的节奏,一是为了暗示镜头趋势,顺应观众视线;二是使画面动细节更整体,韵律更确。

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

压缩渲染时长

渲染时长是3D动画中永的痛点,在项目周期极短的情况下,减低渲染成就变得尤为重要。为3D动画的初心者,在元旦深夜渲染屡屡出BUG屡屡跪的情况下,我们摸爬滚打出以下几种思路:

  • 简材质:减必要的玻璃、SSS、置换贴图材质。一来可采取较低采样数,大幅降低渲染时长;二来则可避免输清素材时易触发的UV错位或反射到位等问题。
  • 从粒子云到积云:刚开始接触烟雾物时,我们尝试使用 Thinking Particles 和 Turbulance FD 等插件进行云粒子渲染,现无论是预览效率还是成像品质没有的效果,另外也由它们的参数,容易在团合整程中衍生新问题。来考虑到对云的动态没有太的需求,我们弃用 TP 和 TFD,转用 Octane 中的 VDB 积云,既能时控预览云的形态,也能缩减计时间。
  • 层渲染:为了提高后期成的可编辑性和效率,对背景、主体物件、前景物体进行了层渲染,既避免渲染出错而导致全面返工,同也能在 AE 中对更多图层参数(动模糊、景深、动画速率等)进行二次调整。
  • 善用 Preview 与跳帧检查:渲染出是难以避免,是可以透过渲染测试来尽量降低渲风险。于动效而言,在制作各个阶段都可以快速导出线框动画预览节奏以及物体位;而于材质和贴图,则可以在素材完输出前按需进跳帧渲染,检查帧 Full Render 效,以免子满盘皆落索。

Final Output

为大家放送高清大图与完整视频,Qzone今年你最红:

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

△ 点击查看视频版

项目心得

  1. 有限时里更需要限沟

在项目周期极短的情况下,队中的每个人都需要清晰地认识每个间节点需要完成的任。对于3D动画这种前期概念模糊,后期作业复杂且段耗不确的任,可以使用倒推法进行规划,为渲染保留充的间。另外也需要成员在动画制作的每一个环节想清楚核心目标是什,再决定术方案,不要为了嗨式雕琢而丢了项目的进程。

在创作脑暴期,团队成员可能会个事物有不理解和想象。此,在动画概念未成形或腹稿阶段,我们需要及时地将自己想法可视化(论是灵魂概念稿是低模型)以消弭双理解误区。时也需要尽早确立并细化分工,并在制作过程时时步自己进度、问题及意见,避免进入合流阶段才猛然惊觉大家在做不元事情。

  2. 前期准备的重要性

除概念稿,针对场大的动画,分镜是节省时间的器。在前期,故分镜包括主物动画及转场方式需要尽能地构想完整,避免一边建模一边想转场动画。虽动画以在模型中试错,但是并非所有项目周期够充裕。尤其对烧显卡,烧时间的3D动画,分镜能最大度减少动画在试错程中的不稳定,降低时间与沟通成。而细节动画以在项目程中补齐完善,避免在前期花费太时间陷细节。

  3. 每天都要昨天更博一点

每学会一好方法、好具、好插件,我们就省出了至少一次睡眠机会。这次项目得准狠,许多3D制作细节从未触碰过的难点雷区,且这也我们第一次使用 Octane 行场景的动画输出。攻坚难点除了不断的试错,重的还找到对的方法。从粒子云到体积云的过程中,我们反复阅读官方文档浸泡技论坛,神的某条回复的某词里找到答案,终摸索出合项目的作流与素。另外日常也保持接触新具时的奋感手感,每天都多学一点新思,能接到紧急需求又无实战验时,知道该去哪里找解决方法。

  4. 知取舍,有放矢

在项目初期,为了能展示最佳的视觉体验,一直在景装饰和材质的质上不断地叠加细化。然而在对项目投放渠道、间限制和制作效率的关系有了更深刻的理解后,决定把重心从细节回归动画的整体性上。毕竟如果赶不上DDL,再良的输出也只能是一张窝藏在脑深的飞机稿。

新是全民欢腾伊始,而QQ空新品视频也是我们团队在3D动画上新开端。

后送几枚火火的手机壁纸,祝福各创意人今方案必过,设火!

QQ 空间春节品牌视频是如何设计出来的?来看这份案例复盘!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

近年来界面设计工具不断推陈出新,一些新兴的实用界面设计工具渐渐走进设计师们的视野,逐步改变着设计师的工作模式。作为互...
神器推荐
复古是一场与时空美丽的邂逅,跨越时间依旧经典,用复古致敬经典、在经典中绽放新意,与我们一起期待未来 20 年华丽的变化。 ...
QQ头像
近一年,随着iOS和安卓陆续支持了深色模式,各个团队的一通操作,也的确为用户带来“眼前一黑”的体验。深色模式也成为了前阵子...
深色模式
项目概述 QQ 20周年,是互联网产品长青的一个传说,就在 20 周年的时间节点,QQ 向用户提供一份关于他自己的、真诚热切的 QQ ...
H5
Nick Babich :当我们在进行产品设计的时候,经常会优先考虑理想状况下的各色场景,而理想的用户流程是没有任何问题和障碍的...
极端情况
项目背景 曹操出行是由世界500强车企吉利集团布局「新能源汽车共享生态」的战略性业务,秉持「低碳致尚、服务至上」的核心价...
实战复盘
借着近期乘车码相关业务版本迭代的成果产出,本文复盘了过程中的设计工作,将设计体验的思考与经验重新梳理成体系,建立可指...
产品设计
@菜心设计铺 :图标——界面设计最重要的元素之一。 菜心经常写关于图标的教程和感悟,可见图标设计在我日常工作中占了很大比...
图标设计