UI設(shè)計(jì)師必會(huì)的CTA設(shè)計(jì)方案

在絕大多數(shù)人的眼里，交互設(shè)計(jì)師的職責(zé)是對(duì)產(chǎn)品用戶體驗(yàn)負(fù)責(zé)，毋庸置疑這肯定是正確的。但交互設(shè)計(jì)師并不是一個(gè)獨(dú)立的個(gè)體，我們既服務(wù)于用戶又服務(wù)于團(tuán)隊(duì)，服務(wù)于產(chǎn)品的商業(yè)價(jià)值，提升轉(zhuǎn)化率也是交互設(shè)計(jì)中不得不考慮的重要一環(huán)。

那么如何能讓用戶按照我們的期望使用產(chǎn)品呢？我個(gè)人總結(jié)了一個(gè)說(shuō)法，叫做交互設(shè)計(jì)中的Call To Action。
 

一. 交互設(shè)計(jì)中的Call To Action

「Call To Action」本身是市場(chǎng)營(yíng)銷里的一個(gè)重要理論，翻譯過(guò)來(lái)的定義是「召喚用戶去行為」，需要注意的是「Call」在這里只能是「召喚」或「喚起」而不是「要求」。 召喚是指通過(guò)設(shè)計(jì)讓用戶在不知不覺中觸發(fā)行為，即行為本身是用戶本來(lái)就存在的需求，而讓用戶發(fā)起這個(gè)行為的過(guò)程是通過(guò)設(shè)計(jì)影響的。

交互設(shè)計(jì)在行為設(shè)計(jì)學(xué)方面有一個(gè)與此非常契合的理論，那就是著名的福格行為模型（Fogg’s Behavior Model）。

福格模型簡(jiǎn)單來(lái)講就是一個(gè)公式：B=MAT。B(behavior)代表行為，M(motivation)代表動(dòng)機(jī)也就是用戶需求，A(ability)代表用戶使用的門檻，T(trigger)代表觸發(fā)。也就是用戶行為的產(chǎn)生需要用戶需求為基礎(chǔ)，需要保證產(chǎn)品的易用性，但是這還不夠，在這個(gè)基礎(chǔ)上我們還需要在產(chǎn)品中通過(guò)設(shè)計(jì)觸發(fā)用戶。

結(jié)合這兩個(gè)理論來(lái)看都提到了影響用戶行為的重要一點(diǎn)就是觸發(fā)，我所要說(shuō)的交互設(shè)計(jì)中的Call To Action也就是通過(guò)設(shè)計(jì)去觸發(fā)用戶行為。

二. 如何進(jìn)行Call To Action Design

交互設(shè)計(jì)中如何進(jìn)行Call To Action設(shè)計(jì)呢？我個(gè)人認(rèn)為交互設(shè)計(jì)中引導(dǎo)和觸發(fā)用戶行為的設(shè)計(jì)并不只是局限于某種交互樣式，而是存在于設(shè)計(jì)的整個(gè)流程，有三個(gè)環(huán)節(jié)不能忽略：注意力、傳達(dá)、觸發(fā)點(diǎn)。

當(dāng)我們希望引導(dǎo)用戶做某項(xiàng)特定操作的時(shí)候，首先獲得注意力使用戶感知，其次是通過(guò)傳達(dá)使用戶理解，在用戶理解的基礎(chǔ)上再去加入能夠觸發(fā)用戶行為的觸發(fā)點(diǎn)。

在這三個(gè)環(huán)節(jié)中引導(dǎo)用戶行為，我們能怎么做呢？我們可以拆開來(lái)講。

1. 注意力

吸引注意力

移動(dòng)端界面閱讀里用戶的瀏覽速度是非?？焖俚模胩岣邇?nèi)容的點(diǎn)擊率，吸引用戶注意是交互設(shè)計(jì)師不得不考慮的。

△ 圖片來(lái)自查查公積金

我們可以通過(guò)使用顏色、大小、形狀、增加標(biāo)注等常規(guī)方式來(lái)吸引用戶；可以使用動(dòng)態(tài)效果吸引用戶；也可以通過(guò)第一人稱對(duì)話或者直呼用戶姓名的方式獲取用戶注意。

引導(dǎo)注意力

注意力是可以通過(guò)設(shè)計(jì)引導(dǎo)的，箭頭，指向性的路徑和視覺引導(dǎo)可以在不經(jīng)意間引導(dǎo)用戶注意到設(shè)計(jì)者希望被注意到的內(nèi)容。

△ 圖片來(lái)自網(wǎng)絡(luò)

例如，有一個(gè)著名的紙尿褲廣告的實(shí)驗(yàn)，通過(guò)改變素材中嬰兒的視線，就可以把用戶的注意力引導(dǎo)到產(chǎn)品描述上，在設(shè)計(jì)中通過(guò)這樣巧妙的引導(dǎo)，很有可能帶來(lái)極大好處。

合理分配注意力

吸引和引導(dǎo)注意力是比較簡(jiǎn)單的，但是交互設(shè)計(jì)師要注意的不僅僅是吸引用戶注意力，人的注意力是有限的，而頁(yè)面是一個(gè)相對(duì)復(fù)雜的整體，吸引用戶注意有時(shí)候可能會(huì)帶來(lái)負(fù)面效果，例如下面的兩個(gè)案例。

△ 圖片來(lái)自網(wǎng)絡(luò)

圖一是一個(gè)電商平臺(tái)的產(chǎn)品列表頁(yè)，方案A通過(guò)視覺排版的修飾創(chuàng)造出節(jié)奏感和層次感使頁(yè)面更美觀，但是傳統(tǒng)列表的方案B購(gòu)買數(shù)據(jù)卻要比A高出17.1%。

圖二是一個(gè)表單填寫頁(yè)面，頁(yè)面的左側(cè)是文字介紹，右側(cè)是表單填寫區(qū)域，方案A在表單附近加入了一個(gè)微笑的女性以吸引用戶注意到表單填寫區(qū)域，然而實(shí)際情況是簡(jiǎn)單清晰的方案B轉(zhuǎn)化率比方案A高出24%。

因此，在產(chǎn)品列表頁(yè)、任務(wù)流程頁(yè)、訂單結(jié)算頁(yè)等類型的頁(yè)面，我們應(yīng)當(dāng)合理的分配用戶注意力，在嘗試新方案的時(shí)候需要謹(jǐn)慎，配合實(shí)際數(shù)據(jù)加以驗(yàn)證。

2. 傳達(dá)

清晰直觀

清晰直觀是傳達(dá)信息的第一層要求，我們應(yīng)當(dāng)做到文案精煉語(yǔ)言通俗，以最清晰直觀的傳達(dá)使用戶快速理解和記憶產(chǎn)品內(nèi)容，這對(duì)用戶的點(diǎn)擊決定和回訪都是有幫助的。

△ 圖片來(lái)自網(wǎng)絡(luò)

我們來(lái)看一個(gè)簡(jiǎn)單的例子，一個(gè)加入購(gòu)物車的按鈕，用符號(hào)組合文字的表達(dá)，點(diǎn)擊率比只用icon的形式提高了15%；而用純文字表達(dá)時(shí)，按鈕點(diǎn)擊率比僅用icon高出49%之多，可見清晰直觀的表達(dá)能帶來(lái)很大的影響。

契合需求、提煉用戶痛點(diǎn)

信息傳達(dá)的第二層要求是讓用戶產(chǎn)生興趣。在撰寫文案時(shí)，僅僅直觀去描述產(chǎn)品是不夠的，我們要比用戶想的更遠(yuǎn)一層，去提煉用戶的痛點(diǎn)，將用戶與產(chǎn)品建立聯(lián)系才能打動(dòng)用戶。

我們耳熟能詳?shù)耐趵霞獩霾鑿V告詞，如果僅僅是描述產(chǎn)品本身降火的功能，只要用戶此時(shí)不是在上火的現(xiàn)實(shí)狀況下，一般都難以產(chǎn)生共鳴。但廣告詞用「怕上火」描述的時(shí)候切中的卻是用戶的心理狀態(tài)，有怕上火心理的用戶就很容易與之產(chǎn)生共鳴了。

在產(chǎn)品中也是一樣，例如查查公積金中的貸款產(chǎn)品，我們使用產(chǎn)品的使用場(chǎng)景作為描述，希望用戶即便在當(dāng)下沒有直接貸款需求時(shí)，也能通過(guò)場(chǎng)景去記憶產(chǎn)品，當(dāng)生活中發(fā)生類似需求場(chǎng)景時(shí)可以聯(lián)想到產(chǎn)品。

△ 圖片來(lái)自查查公積金

3. 設(shè)置觸發(fā)點(diǎn)

直覺觸發(fā)

直覺出發(fā)顧名思義指的是通過(guò)圖標(biāo)、按鈕、文案等看似無(wú)關(guān)緊要的小內(nèi)容，給用戶帶來(lái)直覺上的觸發(fā)。

△ 圖片來(lái)自簡(jiǎn)書、豆瓣

強(qiáng)化緊迫性和稀有性

增加緊迫性和稀有性，可以非常有效的提升用戶點(diǎn)擊。由于賦予效應(yīng)，人往往對(duì)將要失去的事物估值過(guò)高，創(chuàng)造稀有或者即將失去的感覺，就是一個(gè)極佳的行為觸發(fā)點(diǎn)。

△ 圖片來(lái)自淘寶、餓了么

例如，淘寶上的手慢無(wú)，采用倒計(jì)時(shí)和即將售罄來(lái)給用戶制造稀有性和急迫感，觸發(fā)用戶進(jìn)行購(gòu)買行為。餓了么上的紅包會(huì)設(shè)置很短的有效期，觸發(fā)用戶的下單行為。

獎(jiǎng)勵(lì)設(shè)定

由于用戶的逐利心理，設(shè)置獎(jiǎng)勵(lì)是讓用戶發(fā)起行為很好的觸發(fā)點(diǎn)。這里講的獎(jiǎng)勵(lì)并不簡(jiǎn)單指的是加入獎(jiǎng)勵(lì)的運(yùn)營(yíng)活動(dòng)，而是使用在產(chǎn)品交互設(shè)計(jì)里，用來(lái)打破僵局，提升用戶點(diǎn)擊，觸發(fā)用戶連續(xù)行為的方法。

△ 圖片來(lái)自王者榮耀

拿現(xiàn)在炙手可熱的王者榮耀來(lái)舉個(gè)例子，比如銘文獲取這個(gè)模塊，這是一個(gè)讓用戶使用金幣和鉆石抽取銘文的一個(gè)功能區(qū)，在這個(gè)入口的層級(jí)相對(duì)較深的情況下，通過(guò)每天免費(fèi)一次的獎(jiǎng)勵(lì)設(shè)置，可以成功的將用戶引導(dǎo)到這里，提高這個(gè)功能的曝光，從而提高收益。再比如每日活躍度，設(shè)置了進(jìn)階式的獎(jiǎng)勵(lì)制度，使用戶為了得到獎(jiǎng)勵(lì)一步步按照產(chǎn)品的引導(dǎo)觸發(fā)行為。

結(jié)合場(chǎng)景

在特定場(chǎng)景下用戶會(huì)產(chǎn)生特定的需求，抓住用戶在特定場(chǎng)景下的需求，這本身就可以算是一個(gè)極佳的觸發(fā)點(diǎn)了，因?yàn)闀r(shí)機(jī)對(duì)了很多操作就會(huì)順理成章得多。

△ 圖片來(lái)自每日優(yōu)鮮、支付寶

舉一個(gè)最常見的例子，現(xiàn)在很多產(chǎn)品當(dāng)用戶截圖時(shí)，會(huì)根據(jù)產(chǎn)品本身的類型，彈出分享或提問(wèn)的快速入口，在用戶截圖的情景下需要使用分享或提問(wèn)的概率很高，因此在此時(shí)出現(xiàn)無(wú)疑是一個(gè)極好的觸發(fā)點(diǎn)。

最后總結(jié)來(lái)講，交互設(shè)計(jì)中通過(guò)設(shè)計(jì)引導(dǎo)用戶行為是貫穿于整個(gè)產(chǎn)品內(nèi)的，我們不應(yīng)當(dāng)局限于一個(gè)按鈕、一個(gè)頁(yè)面。當(dāng)我們想要引導(dǎo)和影響用戶行為時(shí)，交互設(shè)計(jì)師應(yīng)當(dāng)設(shè)身處地的把自己當(dāng)作用戶，思考用戶所處的環(huán)節(jié)，從我們希望用戶做的行為出發(fā)，在整個(gè)交互流程內(nèi)找到對(duì)用戶最合理有效的引導(dǎo)方式。