如何设计一个优惠券奖励弹窗 | 人人都是产品经理

当我们打开外卖软件时,总能收到各种优惠券弹窗,当大额红包出现在你面前时,你是否会根据引导一步步进行核销呢?优惠券弹窗是如何设计引导用户进行触达,并转化的呢?

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图1

最近一到饭点打开外卖软件,都会收到平台推送的优惠券弹窗,我也一次次经不住大额红包的诱惑,完成了优惠券的核销。但是也不禁发问,除了面额,优惠券弹窗在产品设计上是怎么一步步引导用户,最终完成自身转化的?今天这篇文章,我就结合过往设计优惠券弹窗的经验,带大家一起探索。

优惠券其实在电商平台是一个很大的运营体系,我们日常能接触到的仅仅是优惠券在前台的展示与操作流程,而在这背后需要有一系列的工作去做支撑,包括优惠券转化目标的设定,优惠券的创建、优惠券使用数据的跟踪等等,本文暂且对这些内容不做过多介绍,仅仅针对优惠券弹窗的前台产品设计做分析。

可能大家会觉得,优惠券弹窗不就是用弹窗承载优惠券信息嘛,有什么好设计与分析的呢?我在最初设计优惠券的时候,也是这样认为,但是在踩了不少坑以后,发现还是有不少设计点可以发掘,我将通过内容、形式、触点、转化四个维度来带大家了解。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图2

一、内容

优惠券弹窗的内容就是弹窗承载的信息,根据信息的归类,主要分为两部分,即弹窗内容、优惠券内容。

弹窗内容是除优惠券以外的信息,包括弹窗标题与弹窗视觉。一般在平台发放优惠券的时候,会有多种优惠券类型存在,如针对全平台的,针对营销板块的等等,所以在设计弹窗内容的时候,也需要根据不同的运营目标做区分。弹窗标题需要跟对应营销内容做关联,而弹窗的视觉风格也需要与对应的营销风格保持一致。这样做一方面能将不同的弹窗类型做区分,同时也能让用户提前感受到对应营销板块的氛围。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图3

而对于优惠券内容的设计,往往是根据优惠券在后台创建时所选择的内容决定的。但是在一般中小企业中,并没有完善的优惠券后台管理系统,所以此时就需要产品设计师来根据过往经验定义一些基础字段,来满足当前的营销需求,主要包含优惠券名称、类型、面值、使用条件、使用时间。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图4

二、形式

说起弹窗,大家的第一印象可能是居中弹窗,居中弹窗的优点在于能让用户更聚焦在弹窗的内容,从而提升弹窗中优惠券的转化,但是当平台过多的居中弹窗出现时,会打断用户在平台的操作连贯性,导致用户体验不佳。所以优惠券弹窗除了选择居中弹窗以外,对于那些轻量的优惠券,我们还可以用底部弹窗的形式,既完成了优惠券营销的目的,又不影响用户在当前页面的操作。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图5

除此以外,我们在弹窗的设计时,还要考虑弹窗的延展性。由于针对不同的场景优惠券的数量会有所不同,所以我们在设计之初要沟通清楚优惠券的最大数量,这样在设计弹窗的时候才能保证当承载最大数量的优惠券时,能在各种分辨率下都能完整的呈现;同时在视觉设计上,我们尽量让优惠券的背景保持纯色,这样我们仅仅需要将弹窗的顶部切图,剩下的让研发根据弹窗的数量做自适应。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图6

三、触点

触点即优惠券弹窗上的操作,提供什么操作是根据优惠券的领取规则决定的。一般优惠券主要分为两种:主动领取与自动发放。主动领取的优惠券需要用户在优惠券弹窗点击领取再发放,优点在于用户对于优惠券的获得感强,但是缺点是多了一步领取操作,从而增加了用户的转化链路。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图7

而自动发放即当弹出优惠券弹窗时,就已经发放给用户,只是在弹窗展示具体优惠券的面值等信息,此时操作的设定就要考虑优惠券的转化。我们在日常设计弹窗时,总喜欢加上“我知道了”按钮用来关闭弹窗,这种交互适用于一般的字段释义的弹窗,用来表明用户阅读弹窗信息后理解了字段的含义。而对于优惠券弹窗而言,除了知道获得了优惠券,还希望用户能立马带来转化,所以此时直接关闭弹窗就切断了优惠券的转化链路,那我们该如何设计操作呢?

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图8

显然我们希望提高当前优惠券的转化,就需要引导用户去使用优惠券,如何引导就需要结合优惠券的类型来设定。如果此次优惠券都是针对同一个板块,那我们就可以将”去使用“的按钮放在优惠券之外,引导用户跳转到对应可使用优惠券的板块;而如果每个优惠券对应的使用板块不同,那我们就需要将”去使用”的按钮放在各个优惠券上,来引导用户跳转到不同的板块去转化。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图9

除了转化操作的设计,还有一个操作就是关闭弹窗,不知道大家有没有注意到,目前大部分弹窗的关闭操作都是采用icon的形式,而且一般会出现在两个位置,即弹窗右上角与下方,那么到底该放在哪里呢?我们可以结合”阻力思维”来考虑。优惠券弹窗提供了转化操作,那么对于平台而言自然不希望用户看到后就关闭弹窗,所以就需要考虑关闭按钮放在哪里可以增加用户关闭的难度,显然根据用户持有设备的习惯来说,右上角比下方更难触达,所以关闭按钮放在右上角可能会在一定程度上增加优惠券的转化。

ps:我们可以通过A/B测来验证我们的猜想。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图10

四、转化

优惠券的设定能让用户感知到购买成本的降低,那该如何促进用户最终的转化呢?之前电商产品中,优惠券的使用是在下单页,我们选择优惠券,下单金额变更为折扣价格,后来逐渐的为了减少用户领取的链路,下单价格直接展示使用优惠券后的价格。但是当用户在优惠券弹窗点击“去使用”到对应的板块时,展示的是商品瀑布流,如何能让用户感知优惠券的存在?我们可以将优惠券前置,根据当前的优惠券面额与使用条件,展示对应商品的“券后价”,以此来增加用户的感知与优惠券的转化。

ps:券后价可能带来的研发成本较高,需结合具体的业务需求做考量。

如何设计一个优惠券奖励弹窗 | 人人都是产品经理 - 图11

结语

以上,就是笔者结合自己在工作中的经验,分享的一篇如何设计优惠券奖励弹窗的文章,经验有限,欢迎大家留言探讨!

专栏作家

一个青橙子,公众号:一个青橙子,人人都是产品经理专栏作家。专注产品设计中的案例分享。

本文原创发布于人人都是产品经理,未经许可,禁止转载

题图来自 Unsplash,基于CC0协议

该文观点仅代表作者本人,人人都是产品经理平台仅提供信息存储空间服务。