上亿人使用的QQ IPAD版「斗图神器」原来是这么设计出来的！

腾讯ISUX – EU： QQ在很多人眼里是聊天的工具，那么在聊天这个看似简单的领域，究竟还能做什么创新功能？在此分享一下QQiPad版v6.7版本的主功能，同时也是设计侧主导的创新功能——“来斗”的设计总结，希望给大家一些灵感和启发。

背景

QQiPad版经过不断迭代，功能日趋完善，我们希望在此基础上继续挖掘创新点，给用户提供更爽更有趣的体验，为此做了一些调研和探索，得到了一些有用的结论：

1. QQiPad版的活跃用户呈年轻化趋势，90后00后是主力军

今年五月份ISUX北京设计部针对QQiPad版用户做了一次调研，调研结果发现，QQiPad版的活跃用户集中在90后00后这两个群体，偏年轻化。

2. 90后00后年轻人聊天热衷斗图，“斗图”已经成为一种聊天文化

3. 已有App试水表情包制作的功能，但路径长，体验差

目前主打斗图功能的App中，大部分为表情库，少部分提供简单的表情制作功能，以转发形式发送。聊天过程中使用这些app获得表情包时，需要在两个app之间反复跳转，即时性低，体验很差。

结合这三点发现，我们认为在QQ上做斗图功能是一个值得切入的角度，因此我们进一步做了用户调研，进一步了解现阶段QQ用户对聊天里斗图及制作表情包的看法，得到如下结论：

• QQ用户经常在聊天中斗图

• 合适的配文、搞笑的脸部表情、熟人素材是表情包获得共鸣的三大特点

• 多数用户DIY过表情或动过DIY的念头

• 多数用户因为没有合适的工具而放弃了制作表情的念头

这些结论说明QQ用户在聊天时不仅经常斗图，还希望能自制表情包，但现有的表情包工具体验不佳，无法满足用户的需求。因此，如果能够在QQ上降低制作表情包和发送表情包的门槛，大量潜在的“表情包用户”创作欲望将被激活，参与到这场表情包的“战斗”中来。

目标用户属性

在开始设计功能之前，我们进一步分析了斗图目标用户的属性，明确他们需求，根据需求进行设计。

根据以往的经验，一般用户产生专业内容的社区，有10%的用户产生内容，90%的用户参与，而在10%的用户中，有1%的人以意见领袖的形式存在。

在表情包领域，也存在着相似的规律。

处于金字塔顶端的是 “ 达人用户 ”，拥有强烈的创作欲望和发起话题欲望，有合适的素材便会动手创作，为了达到目的甚至会用多个App进行创作，不在乎成本，只在乎结果是否好玩、能否彰显自己引领聊天节奏的地位；

接下来是“活跃用户”，他们对表情包有较强的认知，虽然较少主动发起斗图，但是容易被带动起来，成为活跃的参与者和斗图的主力军；

剩下的便是90%的“围观用户”，他们创作欲望不高，更多是以转发表情包的形式参与斗图，追求简单快速低成本。

功能定位&交互设计

1. 迎合表情包文化，制作用户喜欢的表情包

通过用户调研结果了解，合适的配文、搞笑的面部表情、熟人素材是一个表情包成功的关键因素；纵观这几年的表情包文化发展，从最开始的暴漫，到现在广为流传的蘑菇头、熊猫头表情包，其模式都是“夸张的肢体简笔画+搞笑的面部表情+恰到好处的文案”，已经成为斗图表情包的主流形态，通过这种方式来表达自己的情感和想法，甚至不需要打字就能够聊上一整天。

因此，我们决定顺应斗图文化，为用户提供能够快速制作主流表情包（面部表情+身体+文案）的功能。

2. 让90%的“围观用户”能一键斗图

前文提到，90%的用户为“围观用户”，他们参与但不主动发起斗图，追求简单快速，为了让他们参与斗图，需要设计一个门槛极低的斗图功能，做到一键就能斗图。

在聊天中，将带人脸的照片作为触发元素，通过规则约束，匹配出适合恶搞的场景，再利用脸部图像识别和抠图技术，快速匹配素材和文案，一键发送，激活斗图气氛。

3. 为1%的“达人用户”提供相对完善的创作条件

达人用户是最热衷创作表情包的一波人，网络上流传的表情包大部分出自他们之手，相比创作难度，他们更关注能否产出理想效果的表情包表达自己的情感和想法，因此，需要为他们设计一个难度适中的编辑功能，同时为他们提供基础素材，满足他们从无到有创作和表达的欲望。

视觉设计

1. icon设计

斗图功能的icon设计充满挑战：

• 图形上需要充分表现斗图这一行为的特点。

• 图形要足够有吸引力，让用户有点击的欲望。

• 斗图功能入口众多，分布在不同的界面，这些界面上的图标都有其风格，因此设计的图形必须有较强的拓展性。

这些挑战也是明确的目标，基于这三个目标，开始着手斗图功能的icon设计。

开始设计之前先梳理一遍icon的使用场景，了解各自特点。（虚线部分为icon位置）

了解应用场景后开始进行发散，从斗图的三个维度去发散图形创意。

根据这三个方向搜集相应的图片作为参考：

根据设想的维度和参考的元素绘制图标，将他们进行不同程度的结合，绘制了多个方案。

对各个方案进行比较之后，选出了这两个方案进一步做结合，前者能更直观地表现斗图这一行为，而后者的表情给人一种嘲讽的感觉，更符合斗图的气质。

结合后以拿着剑的挑衅脸小人形象呈现，并根据不同使用场景进行了延展。

项目组内小范围测试了一下，得到一些比较积极的反馈：“这个表情特别贱”、“忍不住就想点”、“可以的”……说明设计结果与目标相符。

2. 界面设计

聊天触发界面：

一键生成表情包演示(gif)：

首次出现引导(gif)：

编辑界面：

为了获得更佳沉浸的编辑体验，将主界面定为深色调；同时为了强化发送，采用了更加突出的按钮样式设计。

3. 素材设计

预设素材的设计重心在于身体素材的绘制。搜集网络上比较火的表情包进行分析，发现以下特点：

• 风格略“糙”，多为简笔画。

• 形体夸张，体现在动作和身体比例上。

• 视觉感受偏“贱”和“萌”。

结合身边年轻人对这些表情包特点的评价，还可以了解到他们发送表情包的的诉求主要是为了有趣地表达自己的情感，糙、夸张、贱萌的表情包很好地满足了他们的诉求。基于这三个特点我们进行了大量的尝试：

绘制完之后又在内部进行小范围的评选，以了解大家对这些素材的接受程度和反馈。