在我們?nèi)粘５?a href="http://76r.com.cn/tag/%e4%ba%a7%e5%93%81%e8%ae%be%e8%ae%a1" class="tag_a" target="_blank">產(chǎn)品設(shè)計(jì)中，交互上的表達(dá)（反饋、動(dòng)效）能將信息很好地展示給用戶，而無論什么樣的交互表現(xiàn)，都是對(duì)用戶的操作效率、業(yè)務(wù)目標(biāo)的提升有很大幫助的。

所以本文集合了淘寶、支付寶、QQ瀏覽器、百度瀏覽器、抖音、高德地圖、馬蜂窩等眾多一線產(chǎn)品，為你整理了 8 個(gè)可以提升交互表現(xiàn)的方式和技巧，讓你在平時(shí)的設(shè)計(jì)工作中，可以盡量地提升用戶的操作效率和業(yè)務(wù)目標(biāo)的轉(zhuǎn)化。

實(shí)時(shí)更換效果

在需要用戶進(jìn)行多項(xiàng)內(nèi)容的選擇時(shí)，可結(jié)合具體場(chǎng)景，向用戶展示選擇后的效果預(yù)覽。將用戶的選擇內(nèi)容「可視化」，幫助用戶進(jìn)行決策與配對(duì)內(nèi)容。

如首次進(jìn)入 UC 瀏覽器，用戶在選擇不同的興趣類型時(shí)，會(huì)同步展示對(duì)應(yīng)的標(biāo)簽形象。這種優(yōu)化方式，極大提升了用戶對(duì)資訊類型的篩選，方便產(chǎn)品推送對(duì)應(yīng)的資訊信息。

跟隨用戶的操作

大部分產(chǎn)品的功能都是「固定好位置」的，但用戶的手指操作區(qū)域卻是靈活多變的，為了進(jìn)一步提升用戶操作效率，有些產(chǎn)品會(huì)把功能設(shè)置跟隨用戶的操作而展示。

如夸克瀏覽器，在觀看視頻時(shí)點(diǎn)擊屏幕右側(cè)，就會(huì)出現(xiàn)操作圖標(biāo)；而點(diǎn)擊屏幕左側(cè)，操作圖標(biāo)則在左邊出現(xiàn)。

還有抖音，會(huì)根據(jù)用戶手指的點(diǎn)擊/長(zhǎng)按位置，來實(shí)時(shí)展示操作信息和入口。

更直接的引導(dǎo)

很多 APP 會(huì)在用戶首次使用功能時(shí)，用一張蒙層或 GIF 圖引導(dǎo)用戶操作，如向上/向下滑動(dòng)屏幕、點(diǎn)擊某入口等等。但這種「靜態(tài)」展示無法直觀、易懂地向用戶說明：操作后會(huì)有什么？

因此，為了減少用戶思考、更準(zhǔn)確地傳達(dá)信息，可以將「操作后」的效果直接展示給用戶。這種交互方式比單放一張 gif 圖來說，引導(dǎo)性更強(qiáng)。

如抖音，首次進(jìn)入時(shí)會(huì)自動(dòng)地下拉屏幕，向用戶明確說明可以下拉切換視頻。

入口收縮

指提示的信息（廣告彈窗、浮層）展示完后，不再以透明度為 0 的方式進(jìn)行消失，而是通過縮小、位移等方式將特定內(nèi)容「收縮」到入口中去。

該方式好處在于：可以增加、強(qiáng)化用戶對(duì)于功能入口的認(rèn)知，很適合各種需要做「用戶教育」的入口。如QQ瀏覽器的「花草卡」、荔枝音樂的快捷菜單就采用該方式進(jìn)行信息引導(dǎo)。

前置展示用戶目標(biāo)

根據(jù)用戶的操作行為，推導(dǎo)/預(yù)判出用戶下一步即將要執(zhí)行的目標(biāo)，提前將用戶的操作目標(biāo)展示出來?？梢赃M(jìn)一步地減少用戶的操作路徑。

比如淘寶，當(dāng)復(fù)制完商品口令后，打開 app 時(shí)就立即彈出商品信息，免去發(fā)起搜索的操作成本。還有支付寶，在與好友聊天時(shí)若觸發(fā)到數(shù)字信息，則預(yù)判用戶有轉(zhuǎn)賬訴求，提前將金額和操作入口展示出來，方便用戶操作。

特定的彩蛋效果

在展示一些特定的功能模塊、業(yè)務(wù)價(jià)值更重的內(nèi)容時(shí)，可用一些驚喜的彩蛋吸引用戶。一方面能渲染氛圍、吸引用戶注意力。另一方面又能對(duì)產(chǎn)品的 PV、UV 等業(yè)務(wù)指標(biāo)起到一個(gè)促進(jìn)效果。

如愛奇藝，在切換到近期熱播的節(jié)目時(shí)，會(huì)飄落與之相關(guān)的視覺元素，能對(duì)用戶的當(dāng)前操作起很好的「止步」效果。

更擬物化的表現(xiàn)

產(chǎn)品的內(nèi)容與功能展示，可以盡量貼近「現(xiàn)實(shí)生活」來設(shè)計(jì)，給用戶一種更強(qiáng)的代入感（親民、有趣、真實(shí)），突出該功能/內(nèi)容的品質(zhì)感。

如高德地圖，根據(jù)當(dāng)前天氣情況展示真實(shí)效果，給用戶的出行決策進(jìn)行「提醒」。還有飛豬的「會(huì)員卡」，會(huì)用一層「反光」來突顯出卡的質(zhì)感，同時(shí)能起到吸引用戶注意力的作用。

利用好手機(jī)陀螺儀

陀螺儀是手機(jī)系統(tǒng)里的功能之一，能給手機(jī)提供準(zhǔn)確的位置、速度、水平等信號(hào)。如玩賽車游戲時(shí)，翻動(dòng)屏幕就能實(shí)現(xiàn)車輛的轉(zhuǎn)彎。而利用陀螺儀，也能對(duì)頁面元素的交互進(jìn)行優(yōu)化。

比如「好好住」，當(dāng)把手機(jī)往屏幕左邊/右邊翻動(dòng)時(shí)，視覺元素也跟著往左/右旋轉(zhuǎn)、滾動(dòng)，能很好地增加產(chǎn)品的趣味性。

當(dāng)然優(yōu)化交互反饋的方式不止上面幾種，對(duì)于用戶使用頻率較高的、業(yè)務(wù)價(jià)值更重的信息，我們也可以適當(dāng)做一些交互優(yōu)化。比如馬蜂窩的 tab 滑動(dòng)效果、百度瀏覽器的點(diǎn)贊反饋等，都能提升用戶操作過程中的趣味性。

歡迎關(guān)注作者的微信公眾號(hào)：「和出此嚴(yán)」