上篇文章主要說了“微交互和交互設(shè)計(jì)的區(qū)別”“微交互的適用場景”以及“微交互的實(shí)現(xiàn)和組成”的上半部分，這篇文章主要說“微交互的實(shí)現(xiàn)和組成”中的規(guī)則這一部分，反饋、循環(huán)與模式放到下篇文章說，附上篇的鏈接《「微交互：不被用戶察覺的小細(xì)節(jié)提升用戶體驗(yàn)」》。

什么是規(guī)則？

在社會(huì)生活中，規(guī)則就是運(yùn)行、運(yùn)作規(guī)律、規(guī)范人們行動(dòng)所遵循的準(zhǔn)則。它是有定式的、有規(guī)律的。內(nèi)容基本是圍繞人們應(yīng)該做的事情的范圍和執(zhí)行方法來設(shè)定，規(guī)則的目的就是維持社會(huì)生活的秩序、合理、圓滿；協(xié)助人們?cè)谏鐣?huì)活動(dòng)中作出正確判斷。

沒有正確的規(guī)則，社會(huì)生活就不能良好順利進(jìn)行，人們就不能在社會(huì)中，滿足自己的需求和更好的生活。且不同的規(guī)則，也會(huì)形成不同的社會(huì)活動(dòng)，當(dāng)社會(huì)活動(dòng)順利進(jìn)行時(shí)，參與活動(dòng)者幾乎感受不到規(guī)則的存在。

同樣地，微交互的規(guī)則決定了微交互如何使用。設(shè)計(jì)微交互規(guī)則的最終目標(biāo)不是整個(gè)交互過程中的某一個(gè)步驟，而是最終的一個(gè)狀態(tài)。

比如用來檢索信息的微交互“搜索”，最終的目的不是輸入信息，也不是點(diǎn)擊“搜索”按鈕，而是得到用戶想要查詢的信息。那微交互越接近目標(biāo)，成功率就越高，這個(gè)微交互就越高效，一切規(guī)則都是圍繞目標(biāo)來設(shè)計(jì)的，這個(gè)目標(biāo)一定是容易理解和完成的。

實(shí)時(shí)搜索改變了傳統(tǒng)意義上的靜態(tài)搜索模式，不需要點(diǎn)擊“搜索”按鈕，結(jié)果會(huì)根據(jù)輸入的信息而實(shí)時(shí)變化的。

滴滴金融

比如滴滴金融的“登錄”微交互，最終目的不是讓用戶輸入密碼等信息，而是進(jìn)入應(yīng)用程序，可以看到輸完驗(yàn)證碼，后臺(tái)驗(yàn)證，如果正確便自動(dòng)進(jìn)入下一步，不需要額外點(diǎn)擊“下一步”的操作，也體現(xiàn)了微交互越接近目標(biāo)，成功率越高。

微交互的規(guī)則應(yīng)該是在用戶使用應(yīng)用的過程中，潛移默化地引導(dǎo)用戶完成“交互”的流程，整個(gè)過程很流暢，而不是讓用戶覺得又卡殼了，哪里都是要遵循，需要?jiǎng)幽X子記憶的感覺。

就像社會(huì)活動(dòng)中的規(guī)則一樣——我雖然是用來限制你的，但是好的微交互規(guī)則，會(huì)讓用戶幾乎感覺不到規(guī)則的存在，一切都是自然而然到達(dá)目的的。

規(guī)則的作用

1. 微交互如何響應(yīng)被激活的觸發(fā)器

（用戶點(diǎn)擊按鈕時(shí)，會(huì)發(fā)生什么？）

2.?用戶可以進(jìn)行什么操作

（比如正在緩存視頻時(shí)，可以暫停緩存）

3.?動(dòng)作發(fā)生的時(shí)間及順序

（比如填寫表單時(shí)，必須填寫完必填項(xiàng)，提交按鈕的狀態(tài)才會(huì)轉(zhuǎn)變）

4. 什么時(shí)候提供反饋

（比如蘋果手機(jī)的鬧鐘，故意把“稍后提醒”的按鈕放大，讓用戶容易點(diǎn)到，大部分人的心理都會(huì)有賴床一會(huì)的習(xí)慣，點(diǎn)擊“稍后提醒”，第一次提醒會(huì)在9分鐘之后，時(shí)間長短的選擇也很恰當(dāng)，避免賴床的時(shí)間太長而耽誤事情…那這個(gè)微交互提供的反饋是在9分鐘之后）

5. 微交互結(jié)束時(shí)會(huì)發(fā)生什么

（一個(gè)微交互結(jié)束時(shí)是切換到另一個(gè)微交互？循環(huán)重復(fù)？還是自動(dòng)結(jié)束？）

規(guī)則設(shè)置時(shí)要考慮到規(guī)則是否符合用戶在其他應(yīng)用上，使用類似微交互已經(jīng)養(yǎng)成的習(xí)慣，或者更改的新規(guī)則和舊規(guī)則之間的沖突。如果徹底顛覆了用戶習(xí)以為常的思維模式，那新規(guī)則一定要確確實(shí)實(shí)很新穎的，新的微交互一定要比舊的明顯好很多，最好能夠有立竿見影的效果，否則用戶總會(huì)帶著某種心理預(yù)期去使用它。

微交互如何生成規(guī)則

可以進(jìn)行頭腦風(fēng)暴，集思廣益，把能想到的規(guī)則大體上都記錄下來，再一步步去順序排列，依次展開，拆分細(xì)化；如果能使用“泳道圖”之類的可視化的邏輯關(guān)系圖，微交互之間的規(guī)則就更能夠一目了然了。

泳道圖

動(dòng)詞與名詞

在微交互中，動(dòng)詞代表用戶為實(shí)現(xiàn)目標(biāo)采取的動(dòng)作，名詞代表輔助實(shí)現(xiàn)該動(dòng)作的對(duì)象。

比如：音樂播放器中調(diào)節(jié)音量大小的滑動(dòng)條，動(dòng)詞就是用戶可以做什么（調(diào)節(jié)音量大?。~就是通過什么來調(diào)節(jié)（滑動(dòng)條）。

微交互規(guī)則還定義這些名詞的特征和狀態(tài)，用最多的動(dòng)詞和最少的名詞是微交互的最高境界。當(dāng)兩個(gè)看起來類似的按鈕，執(zhí)行的行為應(yīng)該也差不多，這既是交互中每個(gè)名詞的獨(dú)一性也是規(guī)則的統(tǒng)一性。

屏幕與狀態(tài)

微交互采用獨(dú)立的屏幕不如利用狀態(tài)的變化，狀態(tài)可以分為默認(rèn)狀態(tài)、活動(dòng)狀態(tài)、更新后的狀態(tài)等。

微交互使用太多獨(dú)立的屏幕容易造成流程的割裂感，倒不如為每個(gè)對(duì)象定義狀態(tài)，使用狀態(tài)的變化來向用戶傳達(dá)消息，告訴用戶發(fā)生了什么。

約束條件

設(shè)計(jì)規(guī)則時(shí)需要考慮業(yè)務(wù)性、環(huán)境性以及技術(shù)實(shí)現(xiàn)的約束。

1. 可用的輸入、輸出（比如輸入手機(jī)號(hào)碼時(shí)，自動(dòng)彈出數(shù)字鍵盤）
2. 輸入內(nèi)容的類型與范圍（比如輸入手機(jī)號(hào)碼，允許輸入多少字符，除數(shù)字以外的字符是否允許輸入）
3. 資源消耗
4. 可以搜集哪些數(shù)據(jù)

細(xì)節(jié)性的規(guī)則

1. 設(shè)置一個(gè)聰明的默認(rèn)項(xiàng)和有限的選項(xiàng)（有限的選項(xiàng)分為把不需要的隱藏和只提供需要的這兩種）

比如貸款類產(chǎn)品需要選擇是否有公積金，可以根據(jù)已知的用戶信息來默認(rèn)選擇一個(gè)，選項(xiàng)也要越少越好，因?yàn)檫x項(xiàng)越多，規(guī)則越多，默認(rèn)的選項(xiàng)應(yīng)該是大多數(shù)時(shí)候會(huì)用到的。選擇使用什么樣的控件？如何展示？要根據(jù)易操作和易辨識(shí)來選擇，比如不斷重復(fù)的一定要易辨識(shí)；不常用或者只需要一步操作的，易操作更好。

即使是類似屬性的內(nèi)容，選擇了不同的控件，也會(huì)使得產(chǎn)品完全不同。

比如新聞?lì)惖捻敳繉?dǎo)航欄（交互手勢(shì)更多的是左右滑動(dòng)去切換導(dǎo)航中的目標(biāo)位置）和電商類的分類導(dǎo)航（交互手勢(shì)一般是點(diǎn)擊選中左側(cè)導(dǎo)航中的目標(biāo)）。

一種偏重于為了讓用戶更沉浸式的閱讀觀看體驗(yàn)，往往一個(gè)tab里面會(huì)有很多內(nèi)容，并且希望用戶可以停留的時(shí)間越長越好。根據(jù)人眼在移動(dòng)端的“Z”形瀏覽規(guī)律，左側(cè)放tab就很影響用戶的沉浸式體驗(yàn)，而且人們使用新聞娛樂類的app 時(shí)，更多的是無目的閑逛消遣。

另一種偏重于可以讓用戶在繁多的商品里，快速方便定位內(nèi)容，更重視效率。

微信的截屏默認(rèn)快速發(fā)圖選項(xiàng)，就是聰明的默認(rèn)項(xiàng)的表現(xiàn)，在微信中進(jìn)行截屏操作，然后在聊天界面點(diǎn)擊“+”號(hào)，會(huì)默認(rèn)彈出剛剛截屏的圖片，點(diǎn)擊圖片就可以快速發(fā)送，不需要再進(jìn)入相冊(cè)選擇圖片。也是結(jié)合了上下文情景，預(yù)測(cè)用戶的行為，添加了一個(gè)微交互的選擇，縮短了用戶行為路徑，高效又方便。

2. 利用情景和之前的行為預(yù)測(cè)（例如微信的快速發(fā)送截屏的選項(xiàng)）來增強(qiáng)微交互，在對(duì)你的用戶、平臺(tái)或者環(huán)境有了解的基礎(chǔ)上，再去優(yōu)化、設(shè)計(jì)微交互。

舉個(gè)手機(jī)來電的例子，已鎖屏和未鎖屏采用不同視圖，左圖是手機(jī)未鎖屏?xí)r的顯示方式，右圖是手機(jī)已鎖屏的顯示方式。

手機(jī)鎖屏的很多情況可能是手機(jī)在褲兜里沒有使用時(shí)，那右圖的滑動(dòng)接聽的微交互方式就有效的避免了誤觸的問題。

3. 即使要讓系統(tǒng)處理大多數(shù)的復(fù)雜性，減少用戶的操作，但有些時(shí)候也要適時(shí)的將控制權(quán)交給用戶，所有的活動(dòng)都有內(nèi)在的復(fù)雜性，超過了某個(gè)臨界點(diǎn)，就會(huì)不可能再簡化了。找出最核心復(fù)雜的地方，再判斷什么時(shí)候系統(tǒng)處理復(fù)雜性，什么時(shí)候用戶自己手動(dòng)處理。

4. 為了預(yù)防錯(cuò)誤，可以做某些限制、提供建議、對(duì)用戶寬容一些、靈活處理各種情況等，讓用戶沒有機(jī)會(huì)犯錯(cuò)，如果不得已給出警告或者錯(cuò)誤提示，一定要給出解決方案。

錯(cuò)誤一般分為兩種：“失誤”和“錯(cuò)誤”。

失誤就是想做某個(gè)操作，不小心或無意做了另一個(gè)操作。錯(cuò)誤就是用戶的目標(biāo)不能解決用戶的問題或者滿足需求，想做的事情不能解決問題，如果繼續(xù)走下去就是一個(gè)錯(cuò)誤。錯(cuò)誤是有意識(shí)的，通常是因?yàn)橛脩舻恼J(rèn)知和獲取信息的不完整有關(guān)系。

例如輸入銀行卡號(hào)，輸入的卡號(hào)格式如下：

• 可以是6123 4321 8000 5233 453，
• 也可以是6123432180005233453，
• 或者是6123-4321-8000-5233-453。

如果數(shù)據(jù)庫不允許出現(xiàn)非數(shù)字符號(hào)，是否可以智能刪除非數(shù)字符號(hào)，或者直接可以掃描銀行卡，自動(dòng)識(shí)別卡號(hào)，就能有效的避免用戶犯錯(cuò)。

規(guī)則是微交互模型的非技術(shù)層面，規(guī)定了什么可以做，怎么做，什么不可以做，合理完善的規(guī)則才能夠讓用戶在應(yīng)用內(nèi)流暢愉快的達(dá)到目的。

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

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