接觸點(diǎn)設(shè)計(jì)是一種設(shè)計(jì)方法，通過(guò)它你能梳理整個(gè)用戶路徑，具備全局掌握感。而且能從整個(gè)項(xiàng)目找到最為關(guān)鍵的節(jié)點(diǎn)進(jìn)行核心設(shè)計(jì)，把精力用在刀刃上。

JP幾天前請(qǐng)教了前輩，已經(jīng)充分理解業(yè)務(wù)需求是多么重要的一件事。他找到了自己的PM，溝通了一下心得。聽(tīng)了一會(huì)，PM忽然停下了碼PRD的手，說(shuō)：

其實(shí)這些業(yè)務(wù)背景，我有時(shí)間都會(huì)跟你說(shuō)。但是產(chǎn)品的工作實(shí)在太碎，我有時(shí)只能先把東西丟給你，然后去處理其他任務(wù)。

理解需求作為前提，我看法和你們一樣，不過(guò)我還會(huì)考慮這么幾點(diǎn)：

1. 需求需要達(dá)成什么商業(yè)目標(biāo)？有的需求純粹為產(chǎn)品本身的，比如內(nèi)容承載，這個(gè)時(shí)候你跟我扯什么用戶體驗(yàn)，其實(shí)我不會(huì)很care。
2. 需求會(huì)受到哪些技術(shù)和商務(wù)限制？比如最新的人臉識(shí)別，咱們根本就做不起，一沒(méi)那個(gè)實(shí)力，二沒(méi)對(duì)應(yīng)的經(jīng)驗(yàn)，你提出這樣的交互，是要被我打的。
3. 如果是跨部門合作的需求，其他部門訴求和指標(biāo)是怎樣的？你別看大家都說(shuō)部門齊心，其實(shí)很多bu都有自己的小99，如果無(wú)法在需求上達(dá)成共贏，這事兒準(zhǔn)會(huì)成為一個(gè)燙手山芋。

JP這才明白，原來(lái)自己接到東西就開(kāi)始做也有一部分環(huán)境原因。如果不是大廠，很少有工作環(huán)境能讓設(shè)計(jì)師把一個(gè)需求的上下游都理清楚。

現(xiàn)在對(duì)于自己來(lái)說(shuō)，最好的策略就是增加自己的效率。

設(shè)計(jì)專業(yè)上是有跡可循的，而需求都有其獨(dú)立性。JP打算打造自己的設(shè)計(jì)工具箱（sku），以便日后快速應(yīng)用。

他開(kāi)始了自己的學(xué)習(xí)之路。

設(shè)計(jì)工具箱之接觸點(diǎn)設(shè)計(jì)

在設(shè)計(jì)執(zhí)行中，設(shè)計(jì)師需要交互設(shè)計(jì)、布局設(shè)計(jì)、Icon設(shè)計(jì)、字體設(shè)計(jì)、動(dòng)效設(shè)計(jì)、質(zhì)感細(xì)節(jié)等。所以設(shè)計(jì)師一定要抓大放小，先從交互設(shè)計(jì)入手。

在流程設(shè)計(jì)中，可以用到的一個(gè)方法是：接觸點(diǎn)設(shè)計(jì)。接觸點(diǎn)的定義是指用戶在完成一項(xiàng)任務(wù)的過(guò)程中，與產(chǎn)品發(fā)生交互的關(guān)鍵點(diǎn)。

比如：

• 支付寶，知托付——一個(gè)沁人心脾的產(chǎn)品solgan。
• 點(diǎn)擊下載——一個(gè)顯著的btn。
• 馬上就能領(lǐng)！——一個(gè)banner位。

這里引用菜心設(shè)計(jì)鋪（騰訊高級(jí)設(shè)計(jì)師）的分類，接觸點(diǎn)可以分為兩類：

1. 信息觸點(diǎn)，通過(guò)看、理解等方式理解產(chǎn)品信息的關(guān)鍵點(diǎn)，核心是信息確認(rèn)的過(guò)程。
2. 操作觸點(diǎn)，通過(guò)點(diǎn)擊、手勢(shì)等觸發(fā)產(chǎn)品操作的關(guān)鍵點(diǎn)，核心是進(jìn)入下一個(gè)流程。

在流程設(shè)計(jì)時(shí)，盡可能考慮多個(gè)用戶場(chǎng)景，并且合并同類項(xiàng)。最好在用戶開(kāi)始任務(wù)之前和完成任務(wù)之后設(shè)定激勵(lì)或者引導(dǎo)接觸點(diǎn)，給予用戶友好的體驗(yàn)。

梳理接觸點(diǎn)

我在設(shè)計(jì)之初，總是以為頁(yè)面跳轉(zhuǎn)路徑=用戶路徑。但從信息架構(gòu)就可以很好理解，頁(yè)面屬于「層」的關(guān)系，而用戶路徑多個(gè)操作可能在一個(gè)頁(yè)面上完成。這兩者是兩回事，從產(chǎn)品那邊獲取的prd也更多是關(guān)于頁(yè)面邏輯，建議每個(gè)設(shè)計(jì)師都冷靜下來(lái)仔細(xì)畫(huà)畫(huà)用戶的路徑流程圖再進(jìn)行設(shè)計(jì)。

舉個(gè)不恰當(dāng)?shù)睦釉缟腺I早餐。

如果是一家新店，你得先在臺(tái)前仔細(xì)看看這家早餐店提供什么產(chǎn)品：包子、豆?jié){還是油條大餅之類。

不巧店家把商品菜單寫(xiě)的非常小，難以琢磨，你可能就直接不看了。這就是信息觸點(diǎn)，這家店與你發(fā)生的交互。

終于，你選好了，你會(huì)對(duì)老板說(shuō)，我要這個(gè)、這個(gè)和那個(gè)。

然后老板就會(huì)問(wèn)你付錢，你掏出手機(jī)打開(kāi)某個(gè)支付軟件，找到掃一掃，掃碼支付彈出一個(gè)訂單，你點(diǎn)擊確認(rèn)，完成支付。

然后從老板的手里，領(lǐng)走了屬于自己那份早餐。

來(lái)到新店，用戶接觸點(diǎn)行為模式是「信息接觸-操作接觸」，通過(guò)信息排布，對(duì)服務(wù)的確認(rèn)過(guò)程。

打開(kāi)手機(jī)支付，用戶接觸點(diǎn)行為模式是「操作接觸-操作接觸」，因?yàn)閷?duì)掃碼支付已經(jīng)非常熟悉，所以無(wú)需更多查看更多訂單信息，直接確認(rèn)訂單付款即可。

處理異常流程

你會(huì)不會(huì)因?yàn)榻?jīng)驗(yàn)不足而面臨這樣的尷尬處境：設(shè)計(jì)前感覺(jué)自己全知全能，開(kāi)發(fā)時(shí)這個(gè)要補(bǔ)狀態(tài)、那個(gè)要補(bǔ)頁(yè)面。這是因?yàn)樵谠O(shè)計(jì)的時(shí)候，沒(méi)有把異常流程考慮清楚。

比如用戶弱網(wǎng)環(huán)境該如何處理？是直接拋一個(gè)空狀態(tài)，還是給本地的數(shù)據(jù)提供其打發(fā)時(shí)間？或者說(shuō)做一個(gè)愉悅的動(dòng)畫(huà)降低焦慮感？無(wú)論哪種，后面的2個(gè)策略會(huì)比直接給個(gè)空狀態(tài)來(lái)得友好得多。

又比如服務(wù)器資源不足，出現(xiàn)了各種錯(cuò)誤提示。

對(duì)于我們來(lái)說(shuō)，產(chǎn)品存在謬誤很正常。但是對(duì)于用戶來(lái)說(shuō)，一次錯(cuò)誤就可能引發(fā)一個(gè)用戶的流失。

接觸點(diǎn)設(shè)計(jì)實(shí)戰(zhàn)案例，便于舉一反三，我收集了以下幾個(gè)類型供大家參考和交流：

1. 開(kāi)始與結(jié)束接觸點(diǎn)設(shè)計(jì)；
2. 關(guān)鍵核心流程的接觸點(diǎn)設(shè)計(jì)；
3. 關(guān)于反饋的接觸點(diǎn)設(shè)計(jì)；
4. 異常流程的接觸點(diǎn)設(shè)計(jì)。

1. 開(kāi)始與結(jié)束

常見(jiàn)的方法如知乎一樣，會(huì)在圖標(biāo)、tab附近添上一個(gè)小紅點(diǎn)、小徽章以方便用戶注意到入口。點(diǎn)擊以后便消失，提前告知用戶這里出現(xiàn)了新的功能，可以探索或者查看。

2. 核心關(guān)鍵流程完成時(shí)

當(dāng)用戶完成操作流程里程碑時(shí)，給予重反饋（Alert），激活了用戶的參與感，同時(shí)也給到用戶激勵(lì)，方便用戶進(jìn)行下一個(gè)流程。

3. 反饋文案

添加成功和已添加至購(gòu)物袋，后者能對(duì)功能模塊認(rèn)知，明確感知到購(gòu)物袋，但是前者只是很淺的提示。

4. 異常流程&空狀態(tài)

用戶暫無(wú)網(wǎng)絡(luò)，流程就發(fā)生了斷點(diǎn)。后者則給出另一條路徑，刷新點(diǎn)擊嘗試，打通斷頭路。

最后說(shuō)下

接觸點(diǎn)設(shè)計(jì)是一種設(shè)計(jì)方法，通過(guò)它你能梳理整個(gè)用戶路徑，具備全局掌握感。而且能從整個(gè)項(xiàng)目找到最為關(guān)鍵的節(jié)點(diǎn)進(jìn)行核心設(shè)計(jì)，把精力用在刀刃上。

項(xiàng)目不僅擁有亮點(diǎn)，你也對(duì)項(xiàng)目也從做圖思維轉(zhuǎn)為「當(dāng)我遇到這些問(wèn)題，我希望有怎么樣的反饋」，深度地從用戶視角體驗(yàn)整條路徑。

然后就可以在設(shè)計(jì)上花一些功夫：譬如路徑可以再短一點(diǎn)嗎？詳情可以再清晰一點(diǎn)嗎？操作區(qū)域可以再明顯一點(diǎn)嗎？

理清思路，把握全局，發(fā)現(xiàn)更多機(jī)會(huì)點(diǎn)，做出屬于自己理解的設(shè)計(jì)。

End.

作者：瓦解Pen；公眾號(hào)：否定設(shè)計(jì)師，歡迎關(guān)注，一起成長(zhǎng)！

本文由 @瓦解Pen 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議