在互聯網領域中，人機之間的互動過程就是交互。交互也有一些可預測的、重復出現的規律，作者總結了其中常見的七種C端交互模式，可以提高大家的工作效率，分享給大家。

前段時間有個產品童鞋，他剛加我就問了一大串問題。

什么是模式（Pattern）？什么是模版（Template）？這兩個概念有什么區別？

作為一個熱心好學、樂于助人的產品仔，我當然和他暢聊了一個多小時，順便總結下聊天內容。

你是不是也經常在生活工作中，碰到類似“行為模式、設計模式、語言模式、文檔模版、表格模版”等名詞。

但又搞不清它們有什么區別，搞懂了又有什么用？

別急，我們花幾分鐘，先來嘮嘮什么是模式。

一、什么是模式？

可預測、重復出現的現象或規律，通過歸納總結，就變成了某一種模式。

我們的生活中，就有許多模式的影子。

比如常見的商業模式、營銷模式、行為模式、數學模式、語言模式等。

舉個例子：

簡單說下行為模式，它分為了“習慣模式、消費模式、學習模式”等等。

苦逼打工仔普遍的消費模式，一般是工作日花錢少，到了周末都愛到商場逛街和購物。

但又有特例，我有個朋友就特別宅，他只喜歡在上班的時候，摸魚逛淘寶下單，簡直離譜~

掌握模式，有什么用？

當你掌握了模式的概念，并嘗試在生活中使用，相信你一定能感受到這 7 個好處。

1. 信息壓縮：把信息精簡成特定的模式，記憶傳播更容易了，教給別人更是輕輕松松；
2. 知識萃?。和ㄟ^學習模式，掌握系統化的知識，就像搭樂高拼積木，簡單易懂、一學就會、舉一反三；
3. 簡化問題：用模式來解決問題，意味著它不再是一團亂麻，成為了可分割的部分，原來苦惱的事，現在輕松搞定；
4. 識別規律：當你摸清了模式的現象規律，就像旅游帶著地圖，走到哪里都不慌；
5. 提高效率：把模式進行泛化使用，可以大大提高你的工作產出，蓋章可比畫圖快太多了；
6. 組合創新：試著把你學會的各種模式，打亂排序、重新組合，說不定會拼出一些新玩意；
7. 預測未來：搞懂了特定領域的模式，意味著你熟知并能運用自如，自然而然學會了推演未來。

二、C 端交互設計的 7 種常見模式

我們試著再舉個例子，加深下對模式的理解，順便學學交互設計。

什么是交互？

簡單來說，交互指的是在互聯網領域中，人、機之間的一系列互動過程。

我還提煉了 3 種常見模式（簡單反饋、數據操作、業務判斷），比較粗糙湊合也能用。

現在試著再系統總結下，我常用的 7 種 C 端交互模式，主要有：導航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導模式。

學完就能用，趕緊卷起來~

有人就問了，還有更多交互模式嗎？

確實可以有，等我有時間再編幾個。。

話說回來，如果是一些特別復雜的業務規則，可能會涉及到 N 個交互模式的任意組合。

1. 導航模式

常見的導航模式有按鈕組合、標簽菜單、宮格布局、列表視圖等。

導航模式的主要作用是，告知用戶當前在網站的位置，以及接下來到哪些頁面，這有點像地圖 APP。

上面這張圖中，包含了幾種導航組件呢？

2. 搜索模式

搜索，是各大電商 APP 常見的交互模式。

搜索模式允許用戶輸入關鍵詞，然后系統返回搜索結果。

打個比方，這有點像在 Navicat 中寫了一段 SQL 查詢。

SELECT id, name, age
FROM users
WHERE age > 18

這段 SQL 的作用是，查詢大于 18 歲的用戶信息，包含序號、名稱、年齡。

3. 反饋模式

常見的反饋模式組件，涉及了對話框、吐司提示、氣泡提示等。

反饋模式用的比較多的場景是，告知用戶一些信息或提示，比如“輸入密碼錯了、展示訂單取消的注意事項”等。

4. 輸入模式

輸入模式主要用于新數據創建，例如淘寶下單時，你新增了一個收貨地址。

打開美團叫個外賣，整個訂單創建流程，也是輸入模式。

5. 編輯模式

有很多人可能會把輸入模式和編輯模式搞混。

區別它們的一個方法是，交互流程涉及新數據創建，還是改舊數據。

改數據的話，那就是編輯模式。

6. 分享模式

我們在看到一些干貨文章，或好用的小程序想要轉發給朋友，那就要用到分享模式。

分享模式可以很簡單，也可以往復雜了做，看產品階段去實現。

7. 引導模式

引導模式和反饋模式有點像，都是展示特定的內容。

那怎么分辨它們呢？

以設計師視角來看，反饋模式需要用戶觸發，系統被動顯示。

而要讓用戶特別關注的信息，那就是引導模式。

三、總結

模式，即抽象的規律?！孟?/p>

說了這么多概念和例子，你是不是對模式的認知更清晰了呢？

模式運用在產品領域，就有了這 7 種交互模式，分別是“導航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導模式”。

如果學會了模式，那么無論生活還是工作，相信你一定能輕松應對、事半功倍。