10种图文答题交互,高考前一起来做题吧!

原创 收藏 评论
举报 2022-05-31

微信图片_20220531102219.gif

距离高考还有6天。


提到高考,答题无疑是最符合高考主题图文的交互形式,自i排版于2017年首推商业化SVG图文定制服务以来,各种答题玩法便层出不穷。


对品牌来说通过题目可以很方便地植入品牌信息,对用户来说答题就像游戏一样能激发挑战欲,具有很强的参与感。

微信图片_20220531102206.gif


今天给大家总结了10种经典答题玩法,来自微信公开课、京东科技、雷克萨斯中国等22个案例。


为方便大家查看,小品哥将这22个答题案例整理在一个文档中,另外文档中还增加了10多个非答题类的高考创意图文,扫码关注【品牌时光机】在对话框回复关键词【高考】即可领取。

志愿填报指南关注二维码.jpg

以下是精选的10种经典答题玩法:


1

普通点击切换答题

来自「微信公开课」:

008hZReMly4h2rczrl82wg309l0f5gn2.gif

点此查看原文


使用了最为简单的点击切换图片交互,用户无论点击哪个选项都会显示正确答案。点击切换的效果还可以是点击后移入移出、点击圆形切换等。


【拓展案例】

GQ实验室:《找恋爱对象如何不看走眼?》

欧莱雅中国:《欧莱雅集团第一个虚拟偶像,正式上线!》



该交互对应编辑器模板:组件:点击-切换图片
编号:10005(组件)



2

宫格式答题

来自「多乐士」:

008hZReMly4h2rd1u0itag30au0l4jt2.gif


点此查看原文

选项采用宫格式排列,用户点击任一选项便会显示该选项的正确与否,每个选项都能点击一次。选项使用的交互形式一般都是点击切换图片。


【拓展案例】

壳牌中国:《高考过后,这里还有份不一样的“化学卷”》


该交互对应编辑器模板:组合:二列布局
编号:10144(组合)组件:点击-切换图片
编号:10005(组件)


3

列表式答题(展开、变换)

来自「GIADA」:

008hZReMly4h2rd47ibr2g30au0l41ky.gif

点此查看原文


选项采用列表式排列,用户点击任一选项便会显示该选项的正确与否,每个选项都能点击一次。选项使用的交互形式较为多样,一般有点击切换图片、点击展开、点击切换图片展开、点击擦除图片等。


【拓展案例】

极米投影:《2021清零倒计时,听说你又要立新年Flag了》


该交互对应编辑器模板:组合:点击展开
编号:10307(组合)


4

即时生成答题卡

来自「京东科技」:

008hZReMly4h2rd4tc3g6g307m0jw78w.gif

点此查看原文

选择每一题选项后,自动切换下一题,答题完毕后在下方点击生成答题卡。该玩法配合留言送福利活动还能更好地调动用户参与互动的积极性,比如前3位留言且答案全对的同学可获得品牌吉祥物等。


【拓展案例】

小米:《报告米粉,这里答题有奖!》

奔驰:《今天有奖品送》

JLRChinaPR:《开学了,这场摸底考试你能合格吗?》

分期乐:《分期乐撒币啦!快来答题瓜分2000元现金!!》


该效果需定制,定制请添加玉兔微信(ID:playhudong15)咨询。


5

即时生成答题卡并判断对错卡

来自「三星应用商店」:

008hZReMly4h2rd5ayb71g306e0gtmzo.gif

点此查看原文


选择每一题选项后,自动切换下一题,下方自动生成答题卡并判断对错。该玩法配合发送全对截图参与抽奖的活动同样可以调动用户参与互动的积极性,同时让用户更好地掌握知识点。


【拓展案例】

沃尔沃:《2018年全国统一高考瑞典试卷 你能得几分?》

该效果需定制。


6

音效开场

即时生成答题卡并判断对错

来自「泸州老窖头曲」:

008hZReMly4h2rd5swke9g307m0j0dq0.gif

点此查看原文


点击开始答题后,用户才能看到题目同时播放音效。好的音效能让用户更好地专注于答题,上方案例使用的音效是上课铃声,答题氛围一下子拉满,大家一定要进原文感受下。


该效果需定制。


7

即时判断对错

答对进入下一题


来自「宝马中国」:

008hZReMly4h2rd6bsca9g307i08q0w1.gif

点此查看原文


点击选项,答错提示需重新选择,答对进入下一题。即时的提醒可以让用户更好地了解题目传达的知识。


【拓展案例】

维他Vita互动平台:《够真滑板社营业啦!快来答题拿大奖》


该效果需定制。


8

答题组句

来自「雷克萨斯中国」:

008hZReMly4h2rd6od908g307i0ewtpd.gif

点此查看原文

点击选项,即时出现选项对应图片,答题完毕后,根据用户选择可生成相应的句子,给人一种私人定制的感觉

该效果需定制。


9

剧本杀式答题

来自「平安人寿」:

008hZReMly4h2rd75d4gsg307i0c3b29.gif

点此查看原文

每作答一个题目才会展开下一题,并且根据用户选择的不同展开的内容也会不同,直至最后一次点击完全展开生成测试结果。


该效果需定制。


10

仿真式答题

来自「vivo范儿」:

008hZReMly4h2rd855vudg307d0byk4b.gif

点此查看原文

在设计和交互上模拟线下真实考试试卷和场景,更容易唤起用户的答题状态,很有吸引力。


【拓展案例】

滴滴:《2018年滴滴打(kao)车(shi)卷》

ColorOS:《听说只有 5% 的人能答对 2 道题》

宝马官方车主俱乐部:《过去十年的作文题都在这里》


该效果需定制。

以上案例分享如果你觉得有用的话记得点个在看或转发到朋友圈和朋友们一起看!

如果以上案例还没有看够,可以到「品牌时光机」交互图文案例库(网址:brandtime.cn)搜索「高考」查看更多相关案例。

微信图片_20220531103630.png


目前案例库总案例数已达38000+,其中5000+案例支持一键还原,制作同款效果非常方便。

微信图片_20220531103651.gif


现在扫码添加客服还可免费领取15天的案例库会员权限????

微信图片_20220531103705.jpg????????扫码添加客服????????领取「品牌时光机」案例库会员



本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本内容为作者独立观点,不代表数英立场。
本文禁止转载,侵权必究。
本文系数英原创,未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)