qq红包 代码教程(QQ红包的趣味新玩法是怎么设计的)
QQ红包作为一个已上线4年的基础功能,在过去的一段时间经历了定位转变,用户数据下滑等问题。随着几个新玩法的推出,QQ红包又重新受到了年轻用户群体们的关注和欢迎,成为“沙雕”网友们日常的快乐源泉,那么这些玩法是怎么设计出来的呢,本文为你揭开背后的故事。
前言
2019年8月中旬,QQ红包上线了成语接龙玩法,因为“一个顶俩”这个无解的接龙成语,引发了网友们的热议,相关的话题冲到了知乎当日问题热榜第一位,微博上也有很多的讨论和转发,甚至还有网友自发创作了相关的鬼畜视频和表情包。
8月底,跟随QQ 8.1.3版本的发布,QQ红包又上线了画图红包的玩法,瞬间又引起了网友们的关注,在没有任何推广的情况下,获得了超高的热度。灵魂画手们纷纷登场,写实派和抽象派同台竞技,为大家奉献了一幅幅“精彩”的画作。
这些红包玩法受到用户的欢迎,获得了许多赞誉。但是,它们的推出并不是一蹴而就的,而是项目团队许多次探索和打磨的结果。那么,这些QQ红包新玩法是怎么设计的呢,现在让我们揭开背后的故事。
QQ红包是什么?在开始之前,让我们先了解一下QQ红包这个业务,QQ红包是什么?
QQ红包上线于2015年,初期承担着抢占移动支付市场份额的重任,随着移动支付渗透率的日趋饱和,QQ红包原来的战略使命已逐渐淡化。如今,QQ红包的角色已经转变成为一个QQ社交生态中的重要社交工具。
不同于微信红包和支付宝红包,QQ红包的用户群体更加年轻,90后,95后,00后占比达到了80%。
QQ红包新方向:贴合年轻用户喜好,拓展新的玩法
QQ红包的用户群体如此年轻,对于新鲜有趣的事物有着强烈的好奇心,然而QQ红包原有的拼手气,专属红包,文字口令,语音口令等玩法,上线时间都已经超过2年,用户对于这些红包玩法的新鲜感正在逐渐下降。
为了重新给年轻用户带来新鲜感,我们明确了QQ红包的新方向:更加贴合年轻用户的喜好,不断拓展红包新玩法,让红包更加年轻化、社交化、娱乐化。
如何找到QQ红包玩法切入点?
明确了QQ红包的新方向,那么要如何找到QQ红包玩法的切入点呢?我们做了许多前期的探索和尝试。
(1)高效用研,听取年轻用户的声音
我们从身边的亲朋好友寻找QQ红包的年轻用户,直接与他们沟通,来获得他们对QQ红包的真实反馈。通过自费给予报酬,或者降低自己的年龄,来拉近与年轻用户的距离,以此与他们维护良好的关系,在后续的设计中,这些年轻用户给了我们很多的启发和建议。
(2)整理问题点,推导设计方向
我们通过对年轻用户进行访谈,了解到了QQ红包现存的3个主要问题:金额少、场景少、趣味少。
根据用户反馈的问题,我们对应的推导出了QQ红包的设计方向。
- 情感化:除了金钱之外,可以让用户一同发出能表达情感的内容;
- 互动性:挖掘社交、娱乐场景,让用户能用与好友红包玩起来;
- 趣味性:设定一定领取门槛,让用户进行额外的操作,提升用户的参与度和趣味性。
快速CE,验证设计方向
明确了红包的设计方向,我们开始了初步玩法尝试,以情感化作为切入点,设计了语音明信片红包方案,让用户在发送红包时,编辑一张电子贺卡,并录制语音消息,连同红包一起发送出去,以此向好友传达金钱之外的祝福、感谢、思念之情。
在完成语音明信片红包的方案设计后,我们找到用户进行快速CE,以验证方案的可行性。验证结果发现用户对这个玩法不是很感兴趣,用户觉得在发红包时编辑明信片很麻烦,还有一些用户认为明信片已经是上个时代的事物,不太喜欢以这种形式发红包。
深挖场景,从年轻用户的喜好中找切入点情感化的方向不受年轻用户的欢迎,我们继续从互动性和趣味性方向寻找切入点。通过与用户沟通,研究95后,00后相关调研报告,搜集年轻用户喜好的兴趣点,并从中筛选出可行红包玩法的切入点。
通过对比和筛选,我们最终确认了“K歌”这个切入点。主要有两个考虑点,一个是互动性,商场迷你KTV的兴起,使得K歌成为年轻用户社交互动的热门选择。另一个是趣味性,我们可以与全民K歌合作,采用全民K歌的评分技术,设定领取红包的门槛。
新红包玩法:K歌红包
K歌红包的主要玩法:唱歌达标领红包,发红包者选择歌曲片段与红包一同发出,领红包的人需要唱出歌曲,并且K歌评分达标之后才可领取红包。
在结合K歌玩法和QQ红包的过程中遇到了许多问题,我们对体验细节进行了打磨。
(1)保证红包基本玩法:抢
对于红包而言,快速抢到红包仍然是最基本的玩法。常规的K歌,唱完一首歌大概要3-4分钟,难度大且投入成本高,用户会因为担心红包被抢光而失去耐心。这里我们只截取每首歌的副歌高潮片段,时长为8-20s,并外显这一时长信息,让用户没有心里负担,可以快速唱完并成功抢到红包。
(2)做减法
全民K歌的K歌主界面有十分丰富的功能,如果全部照搬到QQ红包上,会给领红包的流程造成干扰。我们把不必要的功能全部剔除,只保留核心的K歌体验,让用户减少决策,更专注于抢红包本身。
(3)结合实际场景思考
在进行红包玩法设计时,我们会更多的思考用户领红包的实际场景,而不是依赖思维惯性而设计。举个例子,K歌红包领取红包的主要交互操作,初期有两个选择,一个是按住button唱歌,另一个是点击button唱歌。
因为QQ语音口令红包,以及QQ发送语音消息,都是按住说话,如果按照思维惯性会选择按住button的方案,但是结合实际场景思考,如果按住button唱歌,屏幕离眼睛太近,用户很难看清红包封皮上的歌词,所以我们最终选择了点击button开始唱歌的方案。
(4)增强用户间的多向互动
原本发红包的互动,是发红包者和收红包者之间的双向互动,收红包的人抢到红包后,会回复文字“谢谢老板”或是一个感谢表情包,互动的形式较为单一。
新的K歌红包玩法,用户K歌的片段以语音的形式发送到聊天窗,并且展示K歌的评分,这样让发红包的人更有满足感,能引起收红包者之间的互动讨论,甚至能激发用户的竞争排位心理。
这样一来,不仅仅是发红包和收红包者之间的双向互动,还有收红包人之间的多向互动。K歌红包玩法上线后,受到了用户的欢迎,许多用户喜欢用《学猫叫》这首歌来“戏弄”好友。
提炼创意公式,持续拓展红包玩法
根据K歌红包的经验,项目团队开始有意识的寻找红包玩法方案的共性,逐步抽象提炼出一个红包玩法的创意公式:互动性 趣味性 基础红包=新红包玩法。
其中,互动性是指从年轻用户喜好的事物筛选,寻找可以激发用户产生互动的切入点;趣味性是指技术手段可实现的,设定一定的红包领取门槛,让用户更有参与感。
具体的玩法流程,则是发红包的用户在输入红包金额后,选择一个互动内容/题目,通过技术手段设定领取门槛;收红包的用户需要进行操作,并匹配上预设的门槛,才可成功领取红包;而操作的过程会生成内容,并发送到聊天窗口,让用户间产生多向互动。
以红包玩法创意公式作为设计思路,项目团队又一起共同脑暴细化方案,推出了表情红包,以及本文开头提到的接龙红包,画图红包玩法。
表情红包做表情领红包,用户在发红包时选择一个表情模版与红包金额一同发出,领红包的人需要打开手机摄像头,并根据表情模版做出对应的表情动作,通过面部/动作识别技术,判定所做的表情匹配模版后才可领取红包,领红包用户所做的表情也会生成一张表情gif图发送到聊天窗中。
(1)做减法:减少用户DIY,预设内容模版
市面上制作表情gif的app,支持用户DIY内容,但是在领红包的场景,用户更关注红包本身,因而需要做减法,减少用户的操作。为此,我们根据不同的表情模版配置好对应的滤镜,贴纸和特效等内容,用户只需一步操作,就可以录制生成一个效果完整的gif表情,并成功领取到红包。
(2)结合实际场景思考:让用户先预览表gif效果
因为用户拍摄生成的表情gif,最终会发送到聊天窗口中,考虑到用户对自己个人形象的重视,所以在用户的表情被成功识别后,我们先让用户预览表情gif的呈现效果,此时用户可以选择重新拍摄一个更满意的效果,也可以点击button直接领取红包。
接龙红包
接龙成语领红包,用户在发红包时选择一个成语与红包金额一同发出,领红包的人需要根据初始成语的末字拼音进行接力,通过拼音抓取识别技术,判定接龙成语拼音一致即可领取红包,下一个领红包的用户,需要接龙上一个人的成语继续领取红包,以此类推,直至该红包被领完。
结合实际场景思考:拼音提示信息实时更新
在群聊中抢接龙红包,有很大几率会出现一种情况,就是用户根据上一成语的拼音开始输入接龙成语时,该拼音的接龙成语已经被其他群友抢先输入,并已领取到红包了,此时如果用户还是按最开始的拼音输入,无法抢到红包,体验会十分糟糕。
这里我们在输入框上方做了一个小浮层设计,用户点击领取红包,小浮层出现并展示下一个接龙成语的拼音,给予用户一个快速提示。除此之外,这个浮层的拼音内容是根据最近的接力成语而变化的,这样用户只需关注浮层上的拼音内容,就可以输入当前正确的接力成语,从而成功领取到红包。
画图红包
画图领红包,用户在发红包时选择一个画图题目与红包金额一同发出,领红包的人需要根据题目进行作画,通过AI图像识别技术,判定所画的内容匹配画图题目即可领取红包,领红包用户所画的作品生成一张图片发送到聊天窗中。
(1)做减法:减少用户设置,随机画笔颜色
在设计初期,项目组为了让用户的画作表现力更加丰富,曾考虑可以让用户自主调整画笔笔触的大小,画笔颜色,以及画板的背颜色景等。经过讨论,确定仍遵循了“做减法”的设计原则,减少用户对画笔和画板的设置,选用随机画笔色彩这一方案,来保证用户画作的差异性和丰富性。
(2)结合实际场景思考:识别成功后,继续完善画作再抢红包
画图红包采用了AI图像识别技术,只需要识别到画面中对应题目的特征,就可以判定用户绘画成功并可领取红包。但是也会引发一个问题,就是用户有时只需画一笔,比如鲨鱼的背鳍,AI技术就可以判定用户绘画成功。这对于那些想要表现自己高超画技的用户而言是十分扫兴的,为了照顾这部分用户的感受,我们在AI识别成功画作后,支持让用户继续作画,丰富更多的细节,并发到QQ群中去获得赞美。
当然,对于那些只想快速抢到红包,并且不在意自己被称为“灵魂画手”的用户,在AI识别成功后,也可以直接点击领取红包。
(3)增强用户间互动:给画作评分
与K歌红包一样,画图红包后续期望能引入绘画评分技术,届时画的越好的用户,获得的评分越高,这样能让大触们可以一展身手,也能激发用户画出更好的作品,引发更多的互动和讨论。
这些QQ红包新玩法上线之后,数据上都有爆发的增长,它们拓展了用户的社交方式,刺激了群成员之间的互动,表情红包成了用户收割好友表情包的利器,接龙红包让大家重拾对成语的热情,还有小学教师用接龙红包进行成语教学,受到了小学生们的欢迎,而画图红包则让一众灵魂画手们得以挥洒天赋,成了“沙雕”网友们的快乐源泉。
服务新玩法,红包体验优化
随着红包玩法的不断拓展,一些体验问题开始暴露,我们又进行全局性的梳理,对红包进行了体验优化。
(1)拓展性
红包玩法的不断丰富,使得原有发红包页面框架无法继续满足新增的红包玩法。为了保证发红包页面的拓展性,我们在页面上划分了内容区域,其中固定内容是红包金额、个数这两个必要信息,而变动内容是红包玩法信息,例如表情模版,歌曲片段等。
划分内容区域后,固定内容区域信息不变,而变动内容区域可以根据不同的红包玩法而切换,以此发红包页面框架的拓展性,可以不断兼容新的红包玩法。
(2)一致性
因为历经不同设计师,各个红包玩法的领取弹窗样式,交互体验不一致,我们又划定了红包领取弹窗的玩法内容区域,统一主操作button的样式,精简提示文案,让各个红包玩法的领取弹窗保持一致,给用户传一致的QQ红包品牌感。
(3)趣味性和仪式感
在后续的红包设计中,我们也会在红包中做一些趣味性和仪式感尝试。比如在发红包时,红包页面的背景或输入框的颜色随着金额的大小而变化,金额越大变化越强烈,让这个隐藏的小彩蛋给那些发大金额红包的用户一种尊贵感和满足感。
除此之外,我们希望在收发红包流程能给予用户仪式感,比如封装,拆开红包的动效,适度加长拆开红包的等待过程,营造一种拆红包的仪式,以及收到红包金额后的音效和光效等。通过多个仪式感元素的运用,让用户能在发红包和收红包中有更愉悦的体验。
一些思考(1)创新不只是全新创造,也可以是结合和转化
K歌,自制表情包,成语接龙,以及AI识图其实并不是新鲜事物,但是结合了红包玩法,融入了抢红包拼手气的属性,就有了更强的竞争性和互动性。所以,创新可以不是全新创造,也可以是把现有的技术和玩法的做结合,或者进行转化,只要是这件事原来没人做过,就可以称之为创新。
(2)维护用户群,随时做用研
设计师可以通过身边的亲朋好友寻找用户,并维护一个随时可以进行用研的用户群体。这样一来,我们可以快速的验证设计方案,为方案决策提供依据,或者用于推动和说服项目成员,从而提升设计的决策效率。
(3)结合实际场景思考,而不是依赖设计经验
长时间的支持某个项目的设计,设计师会很容易形成思维惯性,完全凭借自己的经验来进行设计,但是遇到一些特殊情况,如果仍然依赖思维惯性设计,就会脱离用户基础的需求。因而,设计师在做设计时要结合实际的场景,思考用户的操作体验流程,以及会遇到的问题,并为之进行针对性的优化设计。
(4)抽象思维,提取设计共性,形成创意公式
在设计一系列的功能或玩法的时候,设计师可以抽象思维,去寻找方案中的共性,并逐渐提炼成一个创意模版,就像一个数学的公式,同一个公式可以套在不同题目上进行解答,甚至可以不断的发散,延伸新的解题方式。设计同样如此,如果提炼出了创意公式,就可以在功能和玩法中套用思路,不断的拓展系列性的玩法。
(5)关注用户所喜爱的,通过内容引起传播
网络造梗时代,网友们的创作能力是十分强大的,一个具有话题性的内容往往能引起广泛的传播,如果说是“一个顶俩”是无心之作,那么在后续的画图红包以及其他红包玩法中,我们会更加关注年轻用户喜好的题目类型,去上线一些有一定难度的,并且有一定话题性的内容,满足用户的需求,引起更多的互动和传播。
写在最后QQ红包作为一个上线多年的功能,从最初的发展期,又逐渐进入成熟期衰落期。而新的玩法推出,让QQ红包又一次获得了更多年轻用户的喜爱,焕发了新的生命。
当然,我们的脚步会不止于此,接下来,我们富有奇思妙想的项目团队会继续不断探索尝试新的QQ红包玩法,给有趣可爱的用户们带来更多的欢乐。
作者:腾讯isux
来源:https://isux.tencent.com/articles/qq-red-envelope.html
题图来自 腾讯isux 官网
,免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com