天貓雙11是一場(chǎng)全民剁手節(jié)，本文作者親身參與了這場(chǎng)活動(dòng)的策劃與完整設(shè)計(jì)，以下是他對(duì)活動(dòng)的復(fù)盤(pán)總結(jié)，立刻學(xué)起來(lái)！

一、項(xiàng)目概況

「我的雙11-戰(zhàn)績(jī)」-移動(dòng)媒體屏項(xiàng)目，是2017年阿里巴巴集團(tuán)，淘寶&天貓&研發(fā)效能等 BU 一起設(shè)計(jì)推出的雙11大促營(yíng)銷(xiāo)活動(dòng)；為吸引更多媒體和用戶(hù)來(lái)參與，分享和傳播阿里的雙11，力達(dá)制作引爆全民共嗨的營(yíng)銷(xiāo)效果 。

二、項(xiàng)目背景&目標(biāo)

項(xiàng)目背景

往年雙11 PR 都是通過(guò)大屏對(duì)外傳播，用戶(hù)只是了解這件事情，但是參與度和熱情不足，大屏展示針對(duì)用戶(hù)的互動(dòng)性也相對(duì)較弱。

項(xiàng)目目標(biāo)

• 分享：通過(guò)去中心的方式傳播雙11。
• 回流：分享提升站內(nèi)流量和回訪率。

三、產(chǎn)品方案

1. 如何刺激用戶(hù)分享？

通過(guò)去中心的方式傳播雙11：

精神驅(qū)動(dòng)

• 對(duì)比：榮譽(yù)稱(chēng)號(hào)；競(jìng)爭(zhēng)排名
• 機(jī)制：對(duì)朋友有幫助的信息

利益驅(qū)動(dòng)

• 獎(jiǎng)勵(lì)：紅包
• 特權(quán)：折扣，例如全場(chǎng)8.8折卡

2. 如何引導(dǎo)用戶(hù)回流？

分享站內(nèi)提升流量和用戶(hù)回訪率/驅(qū)動(dòng)力：

• 從眾心理：別人有的我也要有，提升點(diǎn)擊和購(gòu)買(mǎi)力。
• 好奇心：誰(shuí)在買(mǎi)，誰(shuí)在推薦。
• 利益驅(qū)動(dòng)：紅包、優(yōu)惠券等，特權(quán)碼等。

四、競(jìng)品分析

理解和定義了項(xiàng)目以后，我們已經(jīng)清晰的知道自己接下來(lái)要做什么，如何去做，如何精準(zhǔn)的定位發(fā)力點(diǎn)。梳理清楚了項(xiàng)目和設(shè)計(jì)目標(biāo)后，為了避免「閉門(mén)造車(chē)」，也為了更加明晰的了解市場(chǎng)上已有的「熱?！购土餍汹厔?shì)元素，我首先對(duì)市場(chǎng)上比較火的 H5 頁(yè)面進(jìn)行了體驗(yàn)和分析，以下是給我體感比較豐富的幾個(gè)案例：

體驗(yàn)完以上的營(yíng)銷(xiāo)活動(dòng)，我發(fā)現(xiàn)這些優(yōu)秀的案例都具備3個(gè)特點(diǎn)：

• 數(shù)據(jù)以用戶(hù)為中心?；径家杂脩?hù)個(gè)人緯度展示，因?yàn)槊總€(gè)用戶(hù)的確都只關(guān)心和自己相關(guān)的數(shù)據(jù)信息。
• 強(qiáng)故事封裝數(shù)據(jù)。每一個(gè)產(chǎn)品的營(yíng)銷(xiāo)活動(dòng)都有一個(gè)相關(guān)的故事封裝，例如淘寶的「淘寶造物節(jié)」、杜蕾斯的「愛(ài)的密碼」，都充分利用用戶(hù)的好奇心和產(chǎn)品特性，做足了文章。
• 用戶(hù)分層，針對(duì)不同用戶(hù)給出不同利益點(diǎn)刺激。這些營(yíng)銷(xiāo)案例的最終分享頁(yè)都與用戶(hù)的利益點(diǎn)進(jìn)行結(jié)偶，滿(mǎn)足不同層次用戶(hù)的生理/心理需求，例如網(wǎng)易云音樂(lè)的營(yíng)銷(xiāo)/活動(dòng)報(bào)告，總以親友口吻敘述用戶(hù)使用產(chǎn)品的歷程，引起用戶(hù)內(nèi)心深處最柔軟的情感部分，用戶(hù)感覺(jué)到自己被產(chǎn)品關(guān)注/關(guān)心，從而愿意付出更多情感和精力，幫助產(chǎn)品一起成長(zhǎng)。

所以，從體驗(yàn)競(jìng)品和競(jìng)品分析中，我分析了使用/傳播我們頁(yè)面活動(dòng)的用戶(hù)需求，針對(duì)不同層次的用戶(hù)，深挖了他們內(nèi)心深處的需求點(diǎn)，給出引導(dǎo)其引流的刺激點(diǎn)。

五、用戶(hù)分層&需求定位

從體驗(yàn)競(jìng)品&競(jìng)品分析中，我分析了使用/傳播我們頁(yè)面活動(dòng)的用戶(hù)真實(shí)訴求，針對(duì)不同層次的用戶(hù)，深挖了他們內(nèi)心深處的需求點(diǎn)，給出引導(dǎo)其分享&引流的不同刺激點(diǎn)：

六、交互設(shè)計(jì)方案輸出

1. 交互稿1.0

針對(duì)以上定向的項(xiàng)目理解和定義，橫向的競(jìng)品分析和用戶(hù)調(diào)研，對(duì) PD 提供的數(shù)據(jù)和文檔進(jìn)行交互設(shè)計(jì)方案的輸出。整個(gè)交互方案從產(chǎn)出到定稿，共調(diào)整了9個(gè)版本，其中設(shè)計(jì)過(guò)程的價(jià)值對(duì)我來(lái)說(shuō)甚超最終結(jié)果，因?yàn)檫^(guò)程中的查漏補(bǔ)缺，讓我真真實(shí)實(shí)感受到自己的成長(zhǎng)和進(jìn)步，廢話不說(shuō)，先從第一版的交互稿1.0說(shuō)起。

在第一個(gè)版本里，提出最突出的亮點(diǎn)功能板塊有兩個(gè)。

亮點(diǎn)功能1：「時(shí)光機(jī)」的概念，第一板塊中的「轉(zhuǎn)動(dòng)神秘羅盤(pán)，查看我的過(guò)去現(xiàn)在和未來(lái)」

把經(jīng)過(guò)的地方、喜歡過(guò)的品牌、買(mǎi)過(guò)的商品、個(gè)人標(biāo)簽稱(chēng)號(hào)封裝在一個(gè)「時(shí)光機(jī)」的故事里，提煉成「走過(guò)」、「愛(ài)過(guò)」、「買(mǎi)過(guò)」、「有過(guò)」四個(gè)節(jié)點(diǎn)：

• 關(guān)于現(xiàn)在和過(guò)去：最初的愿望是希望用戶(hù)，在我們的頁(yè)面里看到自己的成長(zhǎng)和蛻變，不同時(shí)期購(gòu)買(mǎi)的商品和喜歡的品牌，代表了用戶(hù)特定時(shí)期的品味和回憶，這些產(chǎn)品/品牌從某些程度上也見(jiàn)證了用戶(hù)從「丑小鴨」到「男/女神」的蛻變，用戶(hù)可以查看自己歷年雙11的「剁手」記錄，查看購(gòu)買(mǎi)的物件的同時(shí)，也感嘆一把自己的逝水年華，最終愿意把自己蛻變的/有趣的故事進(jìn)行分享。
• 關(guān)于未來(lái)：針對(duì)用戶(hù)曾經(jīng)和現(xiàn)在的購(gòu)物記錄/瀏覽軌跡，對(duì)用戶(hù)明年雙11即將剁手的方向和典型物品進(jìn)行預(yù)測(cè)，挑起用戶(hù)好奇心和購(gòu)買(mǎi)欲的同時(shí)，也為后續(xù)雙11力推的產(chǎn)品做出宣傳和推廣，最終引導(dǎo)用戶(hù)進(jìn)行分享傳播。

后來(lái)由于采集數(shù)據(jù)的成本太大，關(guān)于未來(lái)商品預(yù)測(cè)的算法邏輯過(guò)于復(fù)雜，項(xiàng)目的時(shí)間有限，設(shè)計(jì)輸出的時(shí)間太趕，此板塊延展性的功能被砍掉，只保留了當(dāng)前雙11實(shí)時(shí)的數(shù)據(jù)和信息。

亮點(diǎn)功能2：「查看我與身邊土豪距離有多遠(yuǎn)」

此功能板塊從三個(gè)維度去詮釋?zhuān)?/p>

• 剁手排行
• 購(gòu)買(mǎi)件數(shù)
• 區(qū)域貢獻(xiàn)

從這三個(gè)緯度詮釋信息的原因是，很多人可能消費(fèi)金額不多，可是購(gòu)買(mǎi)件數(shù)很多，因此還是非常樂(lè)意去分享引流。

后來(lái)，還是因?yàn)橥梁?人均消費(fèi)數(shù)據(jù)的敏感性，也處于對(duì)用戶(hù)隱私數(shù)據(jù)的保護(hù)，我們只保留個(gè)人消費(fèi)的數(shù)據(jù)，和土豪的排名。

2. 交互稿 2.0 -8.0

在交互稿2.0–8.0的版本里面，主要做出的調(diào)整和亮點(diǎn)主要有以下幾點(diǎn)：

產(chǎn)品的整體封裝

優(yōu)化前的導(dǎo)航大標(biāo)題是非常正式的「雙11交易額」文案，優(yōu)化后是「我和雙11的那些江湖事兒～」，一部分是考慮到阿里的江湖文化，把整個(gè)雙11活動(dòng)比喻成一場(chǎng)江湖大事；另一部分是用戶(hù)在雙11會(huì)場(chǎng)購(gòu)買(mǎi)的行為也像是在此江湖中發(fā)生的奇聞逸事。

確定好主題后，進(jìn)而對(duì)頁(yè)面功能劃分為三個(gè)模塊：「江湖剁主」、「剁手神功榜」、「剁主浪跡」，把整體的功能數(shù)據(jù)封裝成一個(gè)故事，故事中不同的環(huán)節(jié)即是產(chǎn)品的核心功能，此操作既提升產(chǎn)品數(shù)據(jù)可讀性，又降低無(wú)趣，增加分享概率。

增加自定義分享板塊

最初的設(shè)定是分享整個(gè)頁(yè)面，包括個(gè)人頭銜/標(biāo)簽，購(gòu)買(mǎi)數(shù)量，附近熱門(mén)商品等，但后續(xù)評(píng)審中考慮到用戶(hù)分享的欲望和分享次數(shù)都會(huì)被限制，有些數(shù)據(jù)不便曝光在朋友圈，最終確定支持用戶(hù)自定義分享，讓分享彈力、次數(shù)和機(jī)會(huì)也更多，最主要的是用戶(hù)的隱私數(shù)據(jù)得到了較好的處理。

增加土豪距離我的實(shí)際物理距離通知

調(diào)整前是用戶(hù)和上一名剁手黨進(jìn)行對(duì)比，例如通知用戶(hù)：「您距離上一名用戶(hù)剁手值相差300塊」，考慮到此信息對(duì)用戶(hù)刺激點(diǎn)太低，同時(shí)又要保護(hù)土豪用戶(hù)的數(shù)據(jù)隱私，另一方面也為了線上線下可以進(jìn)行互動(dòng)趣味，我們最終確定添加土豪距離用戶(hù)的物理距離。

想象你在商場(chǎng)購(gòu)物，手機(jī)突然通知你：余杭最大的土豪距離你200M，前方高能預(yù)警，你是否會(huì)立刻警惕興奮起來(lái)，從此擦肩的人都長(zhǎng)了一張土豪的臉？還因?yàn)槭痔源蟛糠钟脩?hù)是女性用戶(hù)，經(jīng)調(diào)研驗(yàn)證，此功能點(diǎn)更能讓她們嗨起來(lái)，因此我們保留并做了深化處理。

除去上面的功能調(diào)整，其他的優(yōu)化點(diǎn)里面，我還強(qiáng)化了「我」和「土豪」 PK 的場(chǎng)景和氛圍，讓節(jié)日和剁手大賽的味道更濃更直觀，在這種「廝殺」的氛圍中，用戶(hù)的購(gòu)買(mǎi)欲也更容易得到釋放。

經(jīng)過(guò)了版本1.0-8.0的調(diào)整，終于交互定稿了，在最終確定的交互稿中，可進(jìn)行完整頁(yè)面的分享，也可進(jìn)行自定義板塊的分享，單個(gè)頁(yè)面主要包括三個(gè)部分：

• 剁主浪跡
• 剁主排名&土豪大戰(zhàn)
• 街坊鄰居都在買(mǎi)什么

3. 交互定稿-主頁(yè)面分享

在交互定稿中，其實(shí)相比之前的版本，也做了很多細(xì)節(jié)的調(diào)整和優(yōu)化，這里我主要分 4個(gè)點(diǎn)給大家：

新增和明確剁手等級(jí)

個(gè)人分享頁(yè)中，相比之前只有區(qū)域稱(chēng)號(hào)，此處增加購(gòu)買(mǎi)力 LV 等級(jí)的概念和數(shù)據(jù)圖標(biāo)，目的是為了讓用戶(hù)只管明確感知自己的剁手段位和頂配消費(fèi)者的差距，希望高消費(fèi)用戶(hù)更愿意去曬；低消費(fèi)用戶(hù)更愿意自?shī)首詷?lè)，達(dá)到分享引流效果。

虛擬霧化用戶(hù)和土豪的真實(shí)物理距離

考慮到土豪自身的身心安全，直接透漏土豪的真實(shí)距離會(huì)讓土豪們感覺(jué)惶恐不安，所以對(duì)于土豪和用戶(hù)之間真實(shí)距離文案進(jìn)行重新設(shè)計(jì)。例如和土豪在同一個(gè)商場(chǎng)距離200M時(shí)候，表述為「距離兩畝地兒/一站公交車(chē)」，這種抽象又不失趣味性的表述，讓抽象距離更容易被用戶(hù)感知。

刺激用戶(hù)購(gòu)買(mǎi)，新增商品人氣

在街坊鄰居都在買(mǎi)什么板塊里面，增加了購(gòu)買(mǎi)人氣，目前已有 X 人進(jìn)行購(gòu)買(mǎi)，增加產(chǎn)品的可信任度和購(gòu)買(mǎi)用戶(hù)的從眾心理，相比之前只顯示商品信息更容易引導(dǎo)獲得用戶(hù)認(rèn)同和購(gòu)買(mǎi)。

低頻但重要的信息不能砍掉，會(huì)流失重要類(lèi)型群體

當(dāng)時(shí)在信息層級(jí)中，區(qū)域鄙視鏈中因?yàn)槠渌麉^(qū)域排名的操作低頻，用戶(hù)關(guān)注度也不高，如果從普通淘寶用戶(hù)角度，此信息是沒(méi)必要展示的；但是對(duì)于媒體用戶(hù)，此板塊的信息關(guān)注度非常高，非常容易引發(fā)熱點(diǎn)討論。

在這一點(diǎn)上，在做對(duì)外設(shè)計(jì)的時(shí)候還是需要非常關(guān)注特殊人群的介入，媒體人群在整體的分享受眾中所占比例的確不大，但是他們所發(fā)揮的輿論和傳播價(jià)值是對(duì)產(chǎn)品影響非常大的。

六、視覺(jué)設(shè)計(jì)方案輸出

七、設(shè)計(jì)驗(yàn)證 & 運(yùn)營(yíng)成果

八、經(jīng)驗(yàn)總結(jié)

此項(xiàng)目從開(kāi)始到結(jié)束，項(xiàng)目周期為45個(gè)工作日。從產(chǎn)品提出想法，到最終開(kāi)發(fā)落地，測(cè)試推廣上線，時(shí)間非常緊迫，但是在有限的時(shí)間內(nèi)，大家還是非常用心的完成了全部工作，盡管效果不錯(cuò)，但是其中也有些現(xiàn)在看來(lái)可以做得更好的地方。

首先針對(duì)項(xiàng)目的時(shí)間給出一些自己的建議：

其次，在不同的時(shí)間節(jié)點(diǎn)和不同的項(xiàng)目角色進(jìn)行溝通時(shí)，需注意的點(diǎn)如下：

對(duì)于異常狀態(tài)的設(shè)計(jì)，需注意事項(xiàng)有：

作為一個(gè)交互設(shè)計(jì)師，其實(shí)很多時(shí)候?qū)τ诮换ポ敵龅馁|(zhì)量驗(yàn)證中，是否對(duì)異常場(chǎng)景考慮全面，能否給出合適的解決方案，這是一個(gè)比較重要的指標(biāo)，但是在做對(duì)外產(chǎn)品的時(shí)候因?yàn)楸旧碛脩?hù)的屬性和層次不同，就會(huì)出現(xiàn)很多異常狀態(tài)。

首先考慮全所有的異常場(chǎng)景，可以對(duì)場(chǎng)景進(jìn)行歸類(lèi)。

例如不同用戶(hù)類(lèi)型的操作異常、網(wǎng)絡(luò)異常、空白頁(yè)面等，先從大的板塊梳理下去，具體到每一個(gè)異常頁(yè)面。自己多總結(jié)歸類(lèi)的同時(shí)還可以發(fā)動(dòng)小伙伴，因?yàn)轫?xiàng)目組的小伙伴是來(lái)自不同的 BU ，關(guān)注的點(diǎn)和設(shè)計(jì)關(guān)注的點(diǎn)有所差異，所以可以拉起一場(chǎng)會(huì)議發(fā)動(dòng)小伙伴的力量，盡量在設(shè)計(jì)的時(shí)候把所有的異常場(chǎng)景都覆蓋到，先總結(jié)，再完成，再完美。

其次，在阿里產(chǎn)品都在往國(guó)際化方向進(jìn)軍的時(shí)候，營(yíng)銷(xiāo)設(shè)計(jì)必須考慮國(guó)際化的因素。

例如外國(guó)生活圈街道和人名字基本的顯示規(guī)則和需要考慮的超出寬度的場(chǎng)景等交互問(wèn)題，具體排名的表述，這關(guān)系到外國(guó)友人直接的清晰認(rèn)知，我們?cè)谠O(shè)計(jì)的時(shí)候也要考慮他們的生活場(chǎng)景和認(rèn)知習(xí)慣。

最后，在真實(shí)的場(chǎng)景中多體驗(yàn)自己的產(chǎn)品，揣摩用戶(hù)的真實(shí)心理。

例如在本次紅包的倒計(jì)時(shí)的邏輯設(shè)定中，紅包出現(xiàn)的前3秒鐘就開(kāi)始倒計(jì)時(shí)，為了讓停留在本頁(yè)中的用戶(hù)提前感知到接下來(lái)會(huì)有紅包雨出現(xiàn)，但是到雙11當(dāng)天，我搶東西的時(shí)候，因?yàn)榧t包出現(xiàn)的比較頻繁，不停打斷我搶購(gòu)，而且每次出現(xiàn)都有倒計(jì)時(shí)3秒鐘，其實(shí)當(dāng)時(shí)的體驗(yàn)是這3秒鐘有點(diǎn)像3分鐘，其實(shí)這一點(diǎn)是對(duì)真實(shí)場(chǎng)景下用戶(hù)的心理把握的還不夠到位，希望后續(xù)大家在做此類(lèi)設(shè)計(jì)師可引以為戒。

九、結(jié)語(yǔ)

其實(shí)本人也是第一次做這種營(yíng)銷(xiāo)形式的 2C 的產(chǎn)品&交互設(shè)計(jì)，因?yàn)槿粘Ｘ?fù)責(zé)的業(yè)務(wù)更多的是集團(tuán)內(nèi)部 2B 產(chǎn)品，發(fā)現(xiàn)在做對(duì)外的產(chǎn)品時(shí)和內(nèi)部產(chǎn)品，其實(shí)在設(shè)計(jì)的時(shí)候，有很大的不同，大概先扔個(gè)磚頭，后續(xù)再持續(xù)補(bǔ)充：

對(duì)于 2B 產(chǎn)品，特別是在集團(tuán)內(nèi)部，更關(guān)注的是產(chǎn)品本身的操作功能和效率、穩(wěn)定性等，好不好看相對(duì)沒(méi)那么重要，產(chǎn)品最大的競(jìng)爭(zhēng)力就在于能解決問(wèn)題，讓用戶(hù)更省心省力。

對(duì)于 2C 產(chǎn)品來(lái)說(shuō)，用故事對(duì)產(chǎn)品和素材數(shù)據(jù)進(jìn)行封裝推送的能力卻非常重要，如何把不同的數(shù)據(jù)和信息通過(guò)一個(gè)故事讓用戶(hù)融入連接進(jìn)來(lái)，引起共鳴，get 到用戶(hù)的刺激點(diǎn)，讓用戶(hù)開(kāi)心愉悅，為你的故事和情懷買(mǎi)單，從而愿意進(jìn)行分享和引流。

造成如此差異的原因，主要是因?yàn)椴煌漠a(chǎn)品定位、使用場(chǎng)景、用戶(hù)需求和使用習(xí)慣，我們?cè)谧鲈O(shè)計(jì)的時(shí)候必須清楚我們的項(xiàng)目目標(biāo)和設(shè)計(jì)目標(biāo)是什么，并時(shí)刻謹(jǐn)記，才能不偏離產(chǎn)品方向和用戶(hù)需求，做出有價(jià)值的產(chǎn)品和設(shè)計(jì)。

關(guān)注阿里巴巴體驗(yàn)技術(shù)團(tuán)隊(duì)公眾號(hào)，第一時(shí)間了解更多精彩內(nèi)容，還有設(shè)計(jì)職位期待你的加入！

圖片素材來(lái)源：天貓

「雙11設(shè)計(jì)的背后」

• 《雙11干貨！寫(xiě)給運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師的交互小技巧》
• 《今年的雙11品牌設(shè)計(jì)，官方首度揭秘背后全過(guò)程！》
• 《電商丨雙11期間，阿里巴巴UED的設(shè)計(jì)師都在做什么？》

================明星欄目推薦================

優(yōu)優(yōu)教程網(wǎng)： UiiiUiii.com 是優(yōu)設(shè)旗下優(yōu)質(zhì)中文教程網(wǎng)站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎(chǔ)設(shè)計(jì)愛(ài)好者也準(zhǔn)備了貼心的知識(shí)樹(shù)專(zhuān)欄。開(kāi)啟免費(fèi)自學(xué)新篇章，按照我們的專(zhuān)欄一步步學(xué)習(xí)，一定可以迅速上手并制作出酷炫的視覺(jué)效果。

設(shè)計(jì)導(dǎo)航：國(guó)內(nèi)人氣最高的設(shè)計(jì)網(wǎng)址導(dǎo)航，設(shè)計(jì)師必備： http://hao.uisdc.com