集卡活动原理及交互、视觉、动效设计详解
根据兑吧集卡类型活动设计经验,阐述集卡背后的原理,总结对于集卡设计的交互、视觉、动效设计的设计小思路。
集卡是什么?
作为80、90的同学,一定不会忘记当年风靡一时的小浣熊集水浒卡,每包面赠送1张卡,共108张。初期只是吃面集卡,随着时间流逝,水浒卡变成了当代青少年之间的谈资,人人都在谈论卡片,人物扮相,武力高低,卡片的稀缺程度;到了后期,大家不再单纯的通过吃面获取卡片,而是开始交换卡片,用1张智多星吴用换2张霹雳火秦明,帮拥有重复卡的同学打扫卫生可获赠一张呼保义宋江。作为策划方,小浣熊公司也加推了如意卡,一张如意卡可兑换任意6张水浒卡。这就是传统意义上的集卡,以卡片作为载体,可通过交换或交易获得。

水浒英雄卡
随着互联网的发展,集卡也从传统实体卡片时代迈向了虚拟卡片的网络时代。从王者荣耀、ofo到支付宝集五福,无不是从不同角度去玩转集卡。在这漫长的过程中,变化的是卡片的形式与载体,不变的是卡片的交换属性。用户可相互赠与、交互卡片,获得虚拟卡片以及其对应的价值感、满足感。


收集市场上常见的集卡,卡片形式主要分为2种
常规玩法:卡牌数量3-10张不等;获得途径为系统赠送抽卡次数,次数耗尽后通过分享邀请好友获得新的抽卡次数,集齐即可 获得超额红包或瓜分现金;
深度玩法:在常规玩法之上,增加稀有卡;除分享邀请之外还可以通过做任务来获取不等抽卡次数;
集卡活动背后的原理是什么?
一个项目的产出,必然是由内到外塑造的过程。各大互联网公司都在做集卡,那集卡背后的原理是什么?为什么大家都不约而同的在年底推集卡,并且花大力气举集团之力推这么个活动?
借《用户体验要素》书中的用户体验五要素模型来简单分析下集卡表现背后的原理。

战略层: 通过中国最为传统认知度最强的春节节日属性,引爆大量的流量,以国民型玩法塑造国民型应用的概念,从而打造用户对于App更深层次的情感认知。其次通过超级活动达到拉新、促进老用户的活跃盘活集团关联App及App核心功能的流量,达到优异的数据效果。
范围层: 通过利益点刺激及通用型集卡玩法引爆活动;通过分享卡片形式达到社交功能;通过分享行为促进老用户活跃;通过任务功能盘活集团关联App及App核心功能的流量。

结构层: 通过稀有卡片设计,对用户而言增加了活动焦点与社交谈资,扩大影响;对于企业而言可以通过对稀有卡片的控制把控成本。通过瓜分而不是平分奖池的形式,对高度投入用户即深度体验用户赋予更高的奖励,也增加结果的不可预期性,强化期待过程。(近两年新增了一些简单的抽奖功能,因现在集卡活动的周期变长,往往持续半个月时间,最终结果反馈较慢,因此中间增加简单的抽奖可以更加即时快速的反馈,促发用户在长时间内更积极的投入。)
框架层: 常用以标题版头、集卡区、操作区、任务区四块进行操作区分,首屏以集卡为重心,连带展现标题及核心操作,让最核心的玩法呈现在第一屏。卡片以二维正向及反向做获得与未获得的区分;……
表现层: 活动的视觉烘托及动效表现,包括整体视觉风格、情感营造,页面动效氛围展现。比如支付宝集五福,利用中国年俗配色和传统图形符号设计,结合中国阖家团圆新年氛围,以视觉元素带来用户的情感共鸣,让活动具备强烈的亲和力,有效的助力了活动参与与传播。但情感投射只能激起一部分用户的热情,想要覆盖绝大多数的用户,通常而言都是简单粗暴的以最核心的利益点刺激。因此在运营视觉侧重上都会倾向于将金额作为最突出的设计,突出瓜分金额(当然财大气粗才可明显展现)与可得金额,激励用户参与。

以上利用用户体验五要素简单剖析集卡玩法背后的原理及基础的框架层、表现层原理,下方就框架层、表现层对应的交互、视觉动效表现进行深层次的讲解说明。
如何做一款“刷屏”的集卡活动?
任何刷屏活动,都是基于“需求-老用户-新用户”的传播原理,而除了要满足这个原理,还要做到有品牌、有逻辑、有创意,相信只有这样,营销活动才有可能产生刷屏之势。
想要做一款“刷屏”的集卡活动,首先要明确通过这个活动想达到怎样的目标,然后带着目标去展开一系列的营销手段。上面也说过,从战略层层面打造国民性的应用的情感认知,具体拆解下来的目标主要为品牌曝光、用户活跃、强化社交、产品导流4方面:

那么,根据这些商业目标,我们是如何落地到集卡营销活动中去的呢?
交互逻辑
Ⅰ致瘾机制----让用户养成习惯
活动中发卡逻辑的设计,如:每日参与抽取卡片,好友之间可互赠卡,做任务得奖励等很容易让用户上瘾,导致越玩越疯。
所谓“致瘾机制”,以《上瘾:让用户养成使用习惯的四大产品逻辑》书中总结的模型就是:“触发—行动—随机奖励—投入”。
延伸到集卡活动中就是:

数亿元奖金诱惑(触发)—用户下载APP集卡或参与集卡(行动)—抽到或换到卡片(多变酬赏)—参与抽卡换卡而消耗的时间和精力(投入)—更接近数亿元奖金(触发)。以此循环,养成每日参与习惯。
Ⅱ心流’体验-从简单到复杂的任务体系设置
心流指的是一种心理状态,一种将个人精神力完全投注在某种活动上的感觉;在集卡活动中我们要做的就是通过心流把控影响用户的主观因素。主要表现在:1.完全投入一项活动并从中感到愉悦;2.关注体验过程而忽视时间。

如何使用户在集卡活动过程中感到愉悦呢?任务模块难易程度的设置就显得非常重要了,好的任务体系应该是由简到难,循序渐进,在完成任务的过程中不让用户产生焦虑和挫败感,随着用户对活动的熟悉,好友分享网络的形成,自然就想要完成更高的挑战,所以在集卡任务设计上要尤为谨慎;

以大宴全城集卡活动的任务设置为例,我们可以很清晰的看出任务的设置由简单到复杂,根据用户对活动难度熟悉,获卡的难度也随之增加,看是简单的任务设计,确很容易让用户进入心流通道,以此完成集卡活动中设置的各项任务,达成目标;

视觉设计
相比其他类型的活动设计,营销集卡活动的设计需要更深入的了解业务层,要全方位的去考虑与思索活动的设计体系。通过学习和思考,我们整理了一套有针对性的设计方法,主要包括几个方面,下面就以春节为主题的营销集卡活动为例详细介绍下。
Ⅰ设计风格配色

ⅰ设计风格
由于需要考虑集卡活动玩法的复杂性又要考虑春节的活动氛围,所以页面风格和动画不能过于复杂与花俏,最好以轻量化设计为主,突出主要元素,注重页面质感,要做到既有优质的视觉体验又要有主题的氛围。


ⅱ色彩搭配
配色方面,特定活动选用特定主色,偏节点的春节、偏营销方向的可选暖色系为主色;辅助色起到平衡主色的冲击效果,减轻主色对用户产生的视觉疲劳,能一定量的活跃视觉,所以颜色属性明确,色彩的明度和纯度不宜过高。类似色为色环上相差30°以内的颜色,与主色色调统一和谐,情感特性一致,色相过渡柔和、自然。

Ⅱ视觉动线及框架排版
集卡首页通常承载内容为1-2屏长度,所以在页面中要留出一条“主路”至上而下的引导用户视线自然的从一个点转移到另一个点,用户体验爽不爽,沉浸感强不强都在动线视觉中。采用的有之字型布局,遵从用户习惯从左至右,引导用户扫描时候从左到右,再从上到下,自然移动模。

除此之外,减少分割与干扰,会让页面框架简洁而整体。
Ⅲ字体设计
简约、耐看、结构端正、字型带有美感与张力且符合春节特色。


动效设计
人天生就容易被运动的物体吸引,H5活动可以说无动效不欢,好的动效能够给活动锦上添花,对于营销集卡,可以让活动的目的性和功能性更直观生动,主要表现在加载、卡片获取和卡片合成中。
Ⅰ加载动效
加载动画作为用户活动的第一印象,是相当重要的,互联网有一个著名的‘8秒原则’,用户等待页面加载超过8秒,70%的用户会选择放弃。在火爆的营销集卡活动中,当因网络延迟等问题,导致卡片加载过慢时,最好的做法是增加一个有趣的加载动画,缓解用户焦虑的情绪。

Ⅱ卡片获取动效
卡片获取是整个集卡活动的核心,也是用户在完成所有动作之后的结果展示。在动效上可采用先发卡然后再翻开卡片展示结果的方式,相比于直接弹出抽卡结果,这样做的好处是使每一次获得卡片的过程都有开奖式的期待。再配合一些礼花,彩带等庆祝类型的动效氛围,能够给用户营造一种沉浸式的交互体验,增加集卡乐趣;

Ⅲ卡卡片合成动效
不是每个用户都能够走到卡片合成这一步的,但是,能走到这一步的用户一定是花费了一番功夫才集齐所有卡片。这样的用户是应该给予’奖励’的!卡片的合成作为整个集卡活动的最后一步,在动效的设计上一定是最酷炫的,最好的状态是能够给到用户惊喜感,满足用户的心理成就感。假设还有进一步的集卡任务(今日头条的普通金卡合成钻卡),那么下一步的卡片合成则需要更加丰富绚丽。

以上就是我们从逻辑-交互-视觉设计-动效几方面分析“如何做一款刷屏的营销集卡”所沉淀的全部干货啦,希望帮助大家更深入理解集卡类项目,并且更有效的产出对应的设计作品~
------------------------------------------
文章作者:王小星 玉龙
文章版权归兑吧UED所有,转载请联系授权并注明出处













































































