大厂案例 | 腾讯在虚拟世界探寻数字盲盒社交新方法

▲点击"三分设"关注，回复"社群"加入我们

欢迎来到专业设计师学习交流社区

三分设｜连接知识，帮助全球 1 亿设计师成长

转自：腾讯ISUX

编辑：章欣怡

共 4855 字 15 图  预计阅读 13 分钟

前言

 

“生活就像是一颗巧克力，你永远不知道下一颗是什么滋味。” 盲盒的诞生，给 “box” 的意象又增加了一份神秘。2020 年作为大众广为人知的盲盒元年，随着 12 月第一支 “盲盒股” 在港交所挂牌上市，盲盒零售店和自动盲盒机都如雨后春笋一般席卷了大小消费集散地。抽盲盒、买盲盒、再到次级市场交易盲盒，一个百亿盲盒市场被快速 “拆” 了出来。

 

从潘多拉的魔盒、薛定谔的猫，再到盲盒的隐藏款，“抽盒” 在搭上潮玩这趟商业快车的同时，也在不断试探年轻的好奇心和为此豪掷千金的底线。根据 《95 一样玩家剁手力榜单》 显示，收藏盲盒手办从最开始的 “亚文化” 消费，已经成为当下 95 后热度最高的收藏爱好。也不难理解，盲盒低至 50-80 元的单价，和 Z 世代年轻人群体逐渐下沉的消费趋势一拍即合。而搭载了游戏及商业 IP 的盲盒，除了有得天独厚的爆款产出特性，也在更多方面和更高层次上满足 Z 世代年轻人的好奇心、收集欲并拓展了线下社交的可能性。

 

那么同样备受年轻人喜爱的社交产品手 Q，在这趟 “万物皆可盲盒” 的浪潮中，又可以扮演怎样的角色呢？我们给出的答案是：数字盲盒。借助平台已有的大量 IP，数字盲盒相比线下实体盲盒搭乘 IP 红利的成本更低，推陈出新，以速度和 “量” 取胜是一大优势。同时，我们也希望以日签打卡的方式，在满足手 Q、Z 世代用户收集欲望的同时，打造一种基于线下盲盒收集但同时潜在拓展数字 “盲盒” 社交的新玩法。

01. 从线下到线上

在传承线下玩法的同时打造线上盲盒新玩法，则需要考虑到许多问题。我们留意到，线下盲盒有许多优势是无法照搬的，比如实体盲盒的触感，购买、拆开实体盲盒所获得的即时心理反馈等。但盲盒的核心特点，就在于 它给普通的商品增加了游戏属性。

 

因此，我们也尝试通过挖掘数字盲盒的独特之处，保留并增添整个抽盒过程的娱乐性和惊喜。从设计层面而言，我们从以下三个角度切入构思：

1） IP：筛选线下盲盒成功案例，敲定以 Q 萌的盲盒为主推 IP；并且线上盲盒可以实现短平快上架 IP，结合时效热点，孵化出更出圈的虚拟 IP。

2） 包装：趋同于线下盲盒包装，继承实体盲盒的视觉审美体验；线下盲盒受包装成本所限，线上盲盒可以打磨出更新颖的盲盒包装。

3） 隐藏玩法：同步线下盲盒玩法逻辑，采用 N+1 的种类形式，在每套盲盒系列中设定一个隐藏款。在用户抽盒过程中，整套盲盒以动画轮播的方式呈现，隐藏款则用问号代替，驱动玩家好奇心。并且依附 QQ 关系链，引导用户交换已经拥有的重复盲盒，从而收集整套端盒。

  

02. IP：重中之重

主打 IP 对品牌形象的构造有至关重要的作用。这种重要性不外乎企鹅之于手 Q，因此敲定、完善头部 IP，是设计手 Q 数字盲盒的首要考虑。在设计的首个阶段，我们选定了四类优质数字盲盒 IP：

1） 自有潮玩 IP：选择现有 ISUX 体系下已孵化成熟的精品潮玩 IP，比如 PUPU &蓝莓之夜，UPUP 牛&牛年大吉等；

2） 自有虚拟 IP：在手 Q 用户群中知名度高、在礼物系统中受到粉丝热捧的 IP。比如多肉植物、Alice 梦游仙境系列等；

3） 外部虚拟 IP：联名外部爆款 IP。手 Q 以 95 后年轻用户为主，也是外部各大爆款 IP 的目标消费者聚集地。因此我们挖掘了包括超人气虚拟偶像洛天依，迪士尼的达菲熊&星黛露春节系列在内的外部 IP 合作；

4） 外部潮玩IP：拥抱主流盲盒潮玩 IP，将消费者粉丝与盲盒的情感从线下延续至线上。知名 IP 包括 star moly 萌力星球、迷萌假日派对、达么吉发财者联盟系列等。

 

 

敲定 IP 方向后，我们综合了几个方面考虑数字盲盒的 IP 设计和上架思路：

1） 目标匹配度：IP 是否和手 Q 用户群体产生足够的共鸣；

2） 品牌定位：IP 是否和数字盲盒平台的风格、氛围及调性协调一致；

3） 制作成本：在估算数字盲盒 IP 生命周期的基础上，是否能以较低的设计、生产及修改成本进行批量生产。

               

03. 盒：再一次定义视觉边界

“从 Box 出发” 这一理念，也淋漓尽致地体现在虚拟盲盒视觉设定的方方面面。

3.1 LOGO 设定

在 logo 设定上，我们将 “盒” 的意象与字母 Q 的形态相结合，并充分考虑移动端设备屏幕的呈现空间，以 30 度的轴测图视角构建出一个正方形的盒子。这样既突显了 logo 的存在感，又给整个视觉界面留出了充足的展示空间。同时，logo 三维六边形的框架设计，也突出了产品的格调和设计感。

3.2 品牌色彩&字体 

在配色设定方面，我们提取传统线下盲盒品牌中核心玩家广泛认可的粉色，也从 QQ 品牌色中提取出蓝色，调和出一种明度更深的蓝色作为互补色。字体设定上，我们选择了造字工房元黑体搭配 DIN 的家族字体作为数字盲盒平台的运营字体。这款字体字形较为硬朗粗壮，但同时又兼顾圆角的设定，符合数字盲盒品牌 “活泼，潮流，可爱” 的气质定位。

 

3.3 品牌 Pattern

同时，我们在平台界面的视觉方面也延续 logo 的设计思路，通过使用 30 度轴测图的空间正方形，衍生为基础图形并在不同页面中配合主题品牌色使用。同时，该基础图形也在数字盲盒的其他页面结合产品形态灵活变形，强化数字盲盒品牌形象。

 

“盒” 的设计理念也延展到页面的设计思路中。在抽盒延展上，我们基于 30 度平行透视的设计理念进行了一系列构思。首先在抽盒页面，我们将页面简单分割为上下两个部分。盒内产品放置在一个通过透视视角构建出的 “桌面” 上，并通过动画进行进行系列产品展示。页面下半部分则用于信息及其他相关操作。

 

3.4 品牌应用至界面

在 ARK 传播、用户赠送数字盲盒的界面，我们也利用 30 度平行透视的设计思路，在分享卡片中对数字盲盒及相关产品进行了空间视觉处理。此外，贯穿始终的纯色背景在突出盲盒产品本身的前提下，也保证了整体风格的一致性。

 

3.5 盲盒包装

在包装设定上，我们延续线下盲盒常规的视觉惯例，以 “盒” 的形式进行产品包装，并以 logo 的 30 度侧轴图作为基础预览视角。众所周知，虽然线下盲盒的包装五花八门，比如浮雕、专色印刷，但最终还是落脚到 “纸本” 这一包装形式。相比之下，数字盲盒包装不受制作成本限制，发挥空间就更为广阔。在此基础上，我们将数字盲盒的包装设计成具有磨砂质感的毛玻璃材质。这一设计不仅让数字盲盒更有视觉冲击力和格调，同时雾化的透明磨砂表面也可以隐隐透露出盒内产品的轮廓和颜色，勾起用户抽盒过程中的紧张好奇情绪。

 

在此基础上，每个盲盒配合各系列的 IP 字体、规范化的系列编号、品牌 LOGO 和 IP色，则可以高效统一 IP 形象，规范化输出系列盲盒包装。

04. 让 “盒” 动起来

 

完成了盲盒静态视觉的构思后，就进入了动画设定的阶段。我们将抽盒 UI 中的动画种类大致分为三种：

一、 辅助型循环动画：限制较少的页面动画，主要目的是烘托抽盒界面的氛围。

二、 辅助操作的反馈型动画：主要为用户抽盒后唤醒的交互动画，增强抽盒结果的用户心理反馈。由于此类动画基于用户操作触发，因此时长限制较为严格。动画过长会直接减缓载入速度，消耗用户等待时长，适得其反。

三、 载入动画：动画形式简单，主要目的是在等待的过程中加入趣味的细节，动画资源要保证尽可能小。界面设计继承品牌图形设计思路，风格统一。

抽盒页面的设计是整个数字盲盒设计的重中之重。这就要求设计师既突出展示盲盒产品本身，又保证抽盒界面的趣味性。在底层动画中，我们继续延续 30 度平行透视视角的设计逻辑，使用 After Effects 的摄像机工具以 Y 轴旋转的方式做成 Fake 3D 的效果。在制作 Fake 3D 动画时，我们也使用了 Lottie 组件。Lottie 组件的优势在于在实现动画高保真还原的同时，也可以通过在 AE 内替换对应素材即可在统一标准下实现量化输出，规范后续动画生产标准，提高生产效率，降低设计成本。

 

在底层动画上，我们也加入了四层动画进行功能和效果的区分。在叠加的首层动画上，我们对每套数字盲盒的所有产品进行了展示，进一步加深用户对可能拆出的盲盒产品的期待心理。在第二层和第三层动画上，我们以 Z 轴旋转的动画特效，将数字盲盒进行一种立体的空间感展示，并使用粒子效果配合光环旋转的动画特效环绕数字盲盒，引导用户的点击路径。同时在最顶层，也就是第四层动画，我们还加入了手 Q 具有代表性的大黄脸表情，并赋予它弹跳和位移的效果，增添抽盒界面的趣味性。

‍

但在盲盒抽取结果动画设计方面，我们在项目前期的尝试中就遇到一个难题——拆盒动画最重要的部分就是盒子打开并告知用户抽中了哪款盲盒。如果每一个抽盒结果都配置不同的动画，那么单独一套盲盒 “UPUP 牛&牛年限定鹅”，将至少需要设计六种盲盒结果动画，不同系列的盲盒的动画设计成本也将成几何倍数增加。

 

因此我们需要找到一种尽可能控制开发资源和成本，同时又不拘泥于盲盒IP类型和风格的通用方案。我们设计了一款拆盒动画作为底层素材，并且搭配放大效果和粒子碎花下落的 “撒花” 庆祝的氛围特效，最终制作出一段不超过 800 ms 的物品从盒子 “蹦出” 的效果动画，流畅处理了抽盒结果的过场动画，也完善了整个数字盲盒的抽取逻辑。

05. 结语 

畅想：未来：无限延展的 “盒”

本次数字盲盒的设计项目时间紧，需要赶在年前新版本发布之前敲定设计细节。因此设计的重点和难点，就是需要找出一个和品牌强关联的视觉元素，提纲挈领地引导整个视觉设计方案。而我们给出的 30 度轴测图视角，就成功给予了数字盲盒空间的概念，并将这一设计细节灵活贯穿项目始终。此外，一些视觉类设计比如盲盒 Z 轴旋转，也需要从视觉设计师的视角出发，提前通过和包括开发在内的相关项目团队进行对接，给予解决方案。这在很大程度上也节约了人力成本，推动了项目的快速落地。

 

而在整个数字盲盒的设计过程中我们也反复思考，如何通过打磨数字盲盒的特点和亮点，实现超过线下抽盒的体验。比如在一开始就提到，线下盲盒从项目创立、建模、工厂生产打样、后期形态修正再经过一系列生产运输到达消费者面前，时间长、成本高。而相比之下，数字盲盒则在抓热点、做爆款上具备得天独厚的优势。通过和潮流 IP 快节奏展开合作，在短期内提升影响力及曝光度，触达大批潜在受众。

 

与此同时，我们也体现出数字盲盒的亮点.在一些特性上做到超过线下抽盲盒体验

盲盒 IP 选择，在线下盲盒运营策略中，从项目立项到设计师创意建模再到工厂生产打样，反复修正盲盒最终的形态，下线生产物流到消费者面前，是一个非常冗长的过程。相比线上盲盒的节奏则会轻盈很多，我们在线上数字盲盒中发挥特点，筛选出一些时效性强，热度高的 IP，快速制作素材上架数字盲盒平台。以「创造营 2021」为例，线上盲盒可以在最短时间内响应热点，制作出短时间内出团成员的 IP 素材并且上架数字盲盒平台，这些都是线下盲盒所无法触及的。

 

盲盒潮玩是 z 世代身边最热门的话题之一，消费主义浪潮过后，人们从新审视「盲盒」的价值意义，未尝不是一件好事。数字盲盒固然无法代替真实盲盒带来的重量和触摸手感，但是现实盲盒潮玩逃不开工业化的生产成本，数字盲盒平台通过有低成本扁平化的策略，有温度的情感化设计，和用户建立起来另一种连接。今年上半年「NFT」和「加密艺术」大热，数字盲盒也可以顺应虚拟道具上链的热潮，与新技术碰撞出更多可能性。

—  The end  —

📚 精选阅读📚

一篇文章告诉你服务设计到底能做什么？

游戏新手指导怎么做？一起看看《对马岛之魂》如何打造初次对抗体验

制定 “小目标”，了解产品管理中的结构化思维

35+ 的 Windows 系统到底有什么了不起？细数系统界面设计的演变

导师与学员的高效交流 APP 设计 —— Lightship

后疫情时代，如何通过服务设计恢复真正的人际互动？

🙋 一起聊设计 🙋‍♂️

高质量，学设计行业交流群

期待与更多优秀设计师一起成长

🤩

PS：欢迎大家关注三分设，每天早上9点，准时充电。分享优质设计、创意灵感、新知新识，定期大咖老师直播分享，零距离连麦，答疑解惑。 添加小小虫微信号【 Lil_Bug 】，备注【 三分设 】加入！（只面向星标了公众号三分设的粉丝）