怎樣設(shè)計(jì)一個(gè)優(yōu)惠信息卡片—Part1#交互#設(shè)計(jì)思路

Cover

前端時(shí)間接觸了一個(gè)涉及電商優(yōu)惠的需求荧止,簡單說就是收集印度各個(gè)電商的優(yōu)惠內(nèi)容(優(yōu)惠券或者折扣)然后再統(tǒng)一提供給用戶。因此揍鸟,如何讓用戶能夠快速名斟、高效的找到自己想要的優(yōu)惠信息是本次設(shè)計(jì)的重點(diǎn)。在最終的設(shè)計(jì)方案中枣察,由于一條優(yōu)惠內(nèi)容包含的信息量比較大争占,相比于列表的樣式,最終決定用卡片的樣式去承載優(yōu)惠信息序目。因此優(yōu)惠信息卡片是一個(gè)很重要組成部分臂痕,其承載了主要的優(yōu)惠信息及相關(guān)功能。

首先明確一點(diǎn)猿涨,界面中的卡片是作為信息及功能的載體握童,去呈現(xiàn)給用戶的。界面上的每一個(gè)設(shè)計(jì)都應(yīng)該是有根據(jù)的叛赚,不能拍腦袋想當(dāng)然澡绩,因此卡片上的信息和功能稽揭,作為一個(gè)個(gè)元素,其存在和擺放都應(yīng)該是有原因的肥卡。

回顧這次設(shè)計(jì)溪掀,我個(gè)人總結(jié)把設(shè)計(jì)卡片的過程分為三個(gè)部分:匯總元素、篩選元素步鉴、擺放元素揪胃。

匯總元素

這個(gè)階段其實(shí)就是你作為交互設(shè)計(jì)師,去吃透PRD的階段氛琢。

首先要去收集這個(gè)卡片上可能呈現(xiàn)的所有信息及功能喊递,無論是PRD里面說明的,還是從交互的角度出發(fā)覺得需要在任務(wù)流程中提供給用戶的艺沼,都需要先一一列舉出來册舞。

PRD中列舉出的信息有:標(biāo)題、使用說明障般、對(duì)應(yīng)的應(yīng)用信息(icon+名稱)调鲸、配圖(banner),功能有:主要按鈕(下載&打開&領(lǐng)碼)挽荡。但是這些對(duì)用戶來說足夠了么藐石?

*題外話:“作為一個(gè)交互,接到PRD時(shí)最好都保持著一顆懷疑而又探索的心定拟,因?yàn)槟阋喇a(chǎn)品是擁有修改需求的先手權(quán)的于微,完全跟著PRD走你會(huì)很被動(dòng),也體現(xiàn)不出一個(gè)交互的價(jià)值青自≈暌溃” *

抱著這種心態(tài),我就去當(dāng)?shù)氐囊恍﹥?yōu)惠券提供網(wǎng)站逛了一圈延窜。
主要有兩個(gè):CouponRaja恋腕、Gabon

優(yōu)惠券卡片示例-CouponRaja

以CouponRaja上的優(yōu)惠內(nèi)容為例,可以看到一條完整的優(yōu)惠內(nèi)容竟然需要包含這么多元素:描述(簡單描述&詳細(xì)描述)逆瑞、優(yōu)惠類型荠藤、優(yōu)惠來源、配圖获高、使用說明哈肖、適用品類&品牌、次要信息念秧、主要功能按鈕淤井、次要功能按鈕。

而為什么PRD中的優(yōu)惠信息只有那點(diǎn)呢?這里我想主要應(yīng)該是產(chǎn)品經(jīng)理考慮到商務(wù)運(yùn)營在扒取內(nèi)容和運(yùn)營的工作量庄吼,所以只保留了最基本的信息缎除。

所以這時(shí)候交互應(yīng)該考慮的是:

**1.就目前的信息严就,對(duì)用戶來說信息量夠不夠总寻; **

**2.如果夠,該怎么展示梢为,如果不夠渐行,還需要哪些信息,然后怎么展示铸董。 **

但是夠不夠不是拍腦袋說了算祟印。由于做的是移動(dòng)端的內(nèi)容,肯定是不能把網(wǎng)頁端所有的內(nèi)容都全部弄過來的粟害,要有取舍蕴忆。這里我們就要從信息最飽和的情況下去分析每條信息的作用,才能去決定保留哪些信息悲幅。

描述

描述可以說是所有元素中最重要的一個(gè)了套鹅,因?yàn)槠渫?fù)責(zé)最先向用戶傳達(dá)該優(yōu)惠信息的核心。

描述示例-CouponRaja

以CouponRaja上的為例汰具,可以看到描述有兩個(gè)卓鹿,一個(gè)簡單的一個(gè)詳細(xì)的:左邊的“Rs.300 OFF-300盧比折"扣和中間的“Flat Rs. 300 OFF on minimum purchase of Rs.999-最低購買滿999盧比后享受300盧比折扣"。

**左邊的簡單描述和右邊的詳細(xì)描述對(duì)比留荔,看上去有點(diǎn)重復(fù)吟孙,但其實(shí)非常有利于用戶快速聚焦信息,高效的找到自己想要的優(yōu)惠內(nèi)容聚蝶。 **

就好比你上淘寶杰妓,看到“50元優(yōu)惠券”或者“5折促銷”,而詳細(xì)描述則是“滿200減50”或者“適用于男裝類產(chǎn)品”碘勉。那么很明顯巷挥,先告訴用戶“減50塊錢"對(duì)用戶的吸引度是大于告訴用戶“你滿了200我才給你減50”。

**讓用戶先閱讀單獨(dú)的利益信息能瞬間勾起用戶的消費(fèi)欲望恰聘,而先閱讀帶上條件的利益信息句各,則會(huì)讓用戶提前知道了你的門檻。因此簡單描述的權(quán)重是大于詳細(xì)描述的晴叨,因?yàn)橄壤婧髼l件的信息展示順序是比較符合商業(yè)目標(biāo)和瀏覽邏輯的凿宾。 **

畢竟在快速瀏覽信息的過程中,一句話的信息量對(duì)用戶來說還是略大兼蕊,而一個(gè)數(shù)字和一個(gè)單詞的組合對(duì)用戶的吸引力則非常直接初厚。

因此在優(yōu)惠描述這里,將其拆分成簡單描述和詳細(xì)描述是有依據(jù)和道理的。

優(yōu)惠類型

優(yōu)惠類型示例-CouponRaja

優(yōu)惠類型是包括折扣(DEAL)和優(yōu)惠券(COUPON)兩種的产禾,負(fù)責(zé)告訴用戶當(dāng)前的優(yōu)惠內(nèi)容的類型排作,是可以直接去買買買享受折扣,還是說需要領(lǐng)取一個(gè)優(yōu)惠券亚情。

類型這里比較特殊妄痪,它雖然是一種信息,但它的表達(dá)方式卻可以不僅僅局限于文字楞件,也可以通過圖形去表達(dá)衫生,這個(gè)后面會(huì)細(xì)說。

優(yōu)惠來源

來源自然不用說土浸,肯定是需要的罪针。比如這張100元優(yōu)惠券是京東的、天貓超市周末全場(chǎng)8折黄伊,如果沒寫清楚那用戶怎么知道這個(gè)優(yōu)惠可以在哪里使用泪酱。

配圖

配圖可以理解為當(dāng)前優(yōu)惠內(nèi)容的一個(gè)banner,往往是配合熱門推薦的優(yōu)惠內(nèi)容一起使用还最,用圖片去吸引用戶的注意力墓阀,不過并不是所有的優(yōu)惠內(nèi)容都會(huì)有配圖。

使用說明

某些情況下憋活,優(yōu)惠是需要滿足某些特定的條件才能使用的岂津,比如特點(diǎn)的時(shí)間、特點(diǎn)的商品種類以及某些限制悦即。

使用說明示例-餓了么

*像餓了么這種外賣平臺(tái)吮成,商戶都會(huì)有詳細(xì)的優(yōu)惠使用說明,有時(shí)候你會(huì)發(fā)現(xiàn)你明明達(dá)到了滿減的金額辜梳,卻沒有減掉對(duì)應(yīng)的錢粱甫,就是因?yàn)槟愕馁徫镘嚴(yán)锩嬗幸恍┎环蠞M減條件的商品,而印度電商的優(yōu)惠使用說明往往比這個(gè)還要復(fù)雜作瞄。使用說明的存在就是負(fù)責(zé)將這些復(fù)雜的使用規(guī)則茶宵、使用限制告訴給用戶。 *

適用品類&品牌

適用品類&品牌示例-CouponRaja

適用品類&品牌也應(yīng)該算是使用說明的一種宗挥,比如告訴你這個(gè)優(yōu)惠券可以在以下男士運(yùn)用品牌使用:阿迪乌庶、耐克、匡威契耿、新百倫等瞒大,負(fù)責(zé)對(duì)優(yōu)惠內(nèi)容的使用說明做進(jìn)一步補(bǔ)充。

次要信息

次要信息可能包括很多搪桂,比如過期時(shí)間透敌、優(yōu)惠券真實(shí)性、最近被使用時(shí)間等。這些信息對(duì)用戶來說可有可無酗电,并不是決定性的信息魄藕,只是其中有一條比較特殊,那就是過期時(shí)間撵术。因?yàn)闀?huì)有這么一個(gè)場(chǎng)景:比如在淘寶中看到一個(gè)很實(shí)惠的優(yōu)惠券背率,明天就到期了,覺得不用就虧了荷荤,然后馬上就花掉了退渗。這是一個(gè)潛在的消費(fèi)心理,特別是印度用戶蕴纳,是很貪小便宜的,所以過期時(shí)間相對(duì)來說是比較有價(jià)值的个粱。

主要功能按鈕&次要功能按鈕

按鈕示例-CouponRaja

對(duì)用戶來說古毛,每一條優(yōu)惠內(nèi)容最重要的功能就是領(lǐng)取這個(gè)優(yōu)惠。而領(lǐng)取這個(gè)最終的目的都许,根據(jù)業(yè)務(wù)目標(biāo)的不同稻薇,會(huì)衍生出很多不同的到達(dá)路徑,比如點(diǎn)擊按鈕后要求注冊(cè)&登錄以拉新增用戶或提高日活胶征。因此根據(jù)路徑的不同塞椎,反映到主要功能按鈕上的點(diǎn)擊反饋上也會(huì)不一樣。

而次要功能一般是分享睛低、收藏案狠、發(fā)送到手機(jī)&郵箱、添加到卡券包等主路徑延伸場(chǎng)景钱雷,其都不影響用戶完成主路徑的操作骂铁,不是必備功能。

優(yōu)惠碼

優(yōu)惠碼示例-CouponRaja

在所有的優(yōu)惠券信息中罩抗,有一條隱藏信息比較特殊拉庵,就是優(yōu)惠碼。通常情況下只有優(yōu)惠券會(huì)包含優(yōu)惠碼套蒂,這是由于印度當(dāng)前電商環(huán)境所決定的钞支,和國內(nèi)淘寶、京東之類電商平臺(tái)的優(yōu)惠券有所不同操刀。

**優(yōu)惠碼在網(wǎng)頁端通常是不直接露出的烁挟,需要用戶付出一定的操作成本才會(huì)出現(xiàn),因?yàn)槿绻苯勇冻鲡晒危怯脩魜砹藦?fù)制了優(yōu)惠碼就走信夫,對(duì)新增注冊(cè)、日活、合作導(dǎo)量等業(yè)務(wù)目標(biāo)都沒有任何幫助静稻。當(dāng)存在優(yōu)惠碼的情況下警没,主要功能按鈕就需要直接提示用戶領(lǐng)取優(yōu)惠碼,刺激用戶點(diǎn)擊振湾。 **


分析完所有元素后杀迹,接下來就是要根據(jù)自身產(chǎn)品的業(yè)務(wù)目標(biāo),去決定留下哪些元素押搪。

由于自身的產(chǎn)品是一個(gè)應(yīng)用商店树酪,所有的需求最終導(dǎo)向的目的都應(yīng)該是通過內(nèi)容刺激用戶下載,提高日活大州、留存以及發(fā)行系數(shù)续语。

**因此對(duì)于優(yōu)惠內(nèi)容,在暴露給用戶的過程中厦画,應(yīng)該做到最高效疮茄、最直接的傳達(dá),以刺激用戶因?yàn)楸粌?yōu)惠內(nèi)容吸引根暑,產(chǎn)生消費(fèi)沖動(dòng)從而生產(chǎn)下載行為力试。 **

下一部分將說明如何去篩選這些元素的。


非常感謝您的閱讀排嫌,您的支持是我最大的動(dòng)力畸裳!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市淳地,隨后出現(xiàn)的幾起案子怖糊,更是在濱河造成了極大的恐慌,老刑警劉巖薇芝,帶你破解...
    沈念sama閱讀 216,496評(píng)論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件蓬抄,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡夯到,警方通過查閱死者的電腦和手機(jī)嚷缭,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,407評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來耍贾,“玉大人阅爽,你說我怎么就攤上這事〖隹” “怎么了付翁?”我有些...
    開封第一講書人閱讀 162,632評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長晃听。 經(jīng)常有香客問我百侧,道長砰识,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,180評(píng)論 1 292
  • 正文 為了忘掉前任佣渴,我火速辦了婚禮辫狼,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘辛润。我一直安慰自己膨处,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,198評(píng)論 6 388
  • 文/花漫 我一把揭開白布砂竖。 她就那樣靜靜地躺著真椿,像睡著了一般。 火紅的嫁衣襯著肌膚如雪乎澄。 梳的紋絲不亂的頭發(fā)上突硝,一...
    開封第一講書人閱讀 51,165評(píng)論 1 299
  • 那天,我揣著相機(jī)與錄音三圆,去河邊找鬼狞换。 笑死,一個(gè)胖子當(dāng)著我的面吹牛舟肉,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播查库,決...
    沈念sama閱讀 40,052評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼路媚,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了樊销?” 一聲冷哼從身側(cè)響起整慎,我...
    開封第一講書人閱讀 38,910評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎围苫,沒想到半個(gè)月后裤园,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,324評(píng)論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡剂府,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,542評(píng)論 2 332
  • 正文 我和宋清朗相戀三年拧揽,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片腺占。...
    茶點(diǎn)故事閱讀 39,711評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡淤袜,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出衰伯,到底是詐尸還是另有隱情铡羡,我是刑警寧澤,帶...
    沈念sama閱讀 35,424評(píng)論 5 343
  • 正文 年R本政府宣布意鲸,位于F島的核電站烦周,受9級(jí)特大地震影響尽爆,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜读慎,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,017評(píng)論 3 326
  • 文/蒙蒙 一漱贱、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧贪壳,春花似錦饱亿、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,668評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至蚂且,卻和暖如春配猫,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背杏死。 一陣腳步聲響...
    開封第一講書人閱讀 32,823評(píng)論 1 269
  • 我被黑心中介騙來泰國打工泵肄, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人淑翼。 一個(gè)月前我還...
    沈念sama閱讀 47,722評(píng)論 2 368
  • 正文 我出身青樓腐巢,卻偏偏與公主長得像,于是被迫代替她去往敵國和親玄括。 傳聞我的和親對(duì)象是個(gè)殘疾皇子冯丙,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,611評(píng)論 2 353

推薦閱讀更多精彩內(nèi)容