超全总结 ！C端交互设计的7种常见模式

前段时间有个产品童鞋，他刚加我微信就问了一大串问题。端的种

什么是交互模式（Pattern） ？什么是模版（Template） ？这两个概念有什么区别？作为一个热心好学 、乐于助人的设计产品仔，我当然和他畅聊了一个多小时，模式顺便总结下聊天内容
。超全常

你是总结不是也经常在生活工作中，碰到类似“行为模式 、端的种设计模式、交互语言模式
、设计文档模版、模式表格模版”等名词
。超全常但又搞不清它们有什么区别，总结搞懂了又有什么用 ？端的种别急 ，我们花几分钟 ，先来唠唠什么是模式。

一、什么是模式？

可预测、重复出现的现象或规律 ，通过归纳总结 ，就变成了某一种模式。

我们的生活中，就有许多模式的影子 。比如常见的商业模式
、营销模式、行为模式 、数学模式、语言模式等。

举个例子

简单说下行为模式，它分为了“习惯模式、消费模式 、学习模式”等等。苦逼打工仔普遍的消费模式，一般是工作日花钱少，到了周末都爱到商场逛街和购物 。但又有特例，我有个朋友就特别宅，他只喜欢在上班的时候，摸鱼逛淘宝下单 ，简直离谱~

二、掌握模式有什么用？

当你掌握了模式的概念，并尝试在生活中使用 ，相信你一定能感受到这 7 个好处。

1. 信息压缩
   ：把信息精简成特定的模式，记忆传播更容易了，教给别人更是轻轻松松；
2. 知识萃取 ：通过学习模式 ，掌握系统化的知识，就像搭乐高拼积木，简单易懂
   、一学就会 、举一反三；
3. 简化问题：用模式来解决问题 ，意味着它不再是一团乱麻，成为了可分割的部分，原来苦恼的事，现在轻松搞定；
4. 识别规律 ：当你摸清了模式的现象规律 ，就像旅游带着地图，走到哪里都不慌；
5. 提高效率 ：把模式进行泛化使用，可以大大提高你的工作产出 ，盖章可比画图快太多了；
6. 组合创新：试着把你学会的各种模式，打乱排序 、重新组合 ，说不定会拼出一些新玩意；
7. 预测未来：搞懂了特定领域的模式 ，意味着你熟知并能运用自如，自然而然学会了推演未来。

听了还是有点懵 ？那可能需要了解下抽象思维
。

三、C 端交互设计的 7 种常见模式

我们试着再举个例子，加深下对模式的理解，顺便学学交互设计。

什么是交互？我在之前有讲过 ，如何快速入门交互设计
？简单来说，交互指的是在互联网领域中，人、机之间的一系列互动过程。我还提炼了 3 种常见模式（简单反馈、数据操作、业务判断），比较粗糙凑合也能用 。

现在试着再系统总结下（MD 掏家底了，记得赞我。 。），我常用的 7 种 C 端交互模式 ，主要有 ：导航模式  、搜索模式、反馈模式、输入模式 、编辑模式 、分享模式、引导模式 。

学完就能用，赶紧卷起来~

有人就问了 ，还有更多交互模式吗
？确实可以有，等我有时间再编几个。。话说回来 ，如果是一些特别复杂的业务规则，可能会涉及到 N 个交互模式的任意组合
。

1. 导航模式

常见的导航模式有按钮组合 、标签菜单
、宫格布局
、列表视图等。

导航模式的主要作用是，告知用户当前在网站的位置，以及接下来到哪些页面，这有点像地图 APP 。

2. 搜索模式

搜索，是各大电商 APP 常见的交互模式 。搜索模式允许用户输入关键词，然后系统返回搜索结果
。

打个比方，这有点像在 Navicat 中写了一段 SQL 查询。

SELECT id, name, ageFROM usersWHERE age > 18

这段 SQL 的作用是，查询大于 18 岁的用户信息 ，包含序号、名称、年龄。

3. 反馈模式

常见的反馈模式组件，涉及了对话框、吐司提示、气泡提示等。

反馈模式用的比较多的场景是 ，告知用户一些信息或提示
，比如“输入密码错了
、展示订单取消的注意事项”等。

4. 输入模式

输入模式主要用于新数据创建
 ，例如淘宝下单时 ，你新增了一个收货地址 。

打开美团叫个外卖，整个订单创建流程 ，也是输入模式。

5. 编辑模式

有很多人可能会把输入模式和编辑模式搞混 。

区别它们的一个方法是，交互流程涉及新数据创建 ，还是改旧数据 。改数据的话，那就是编辑模式 。

6. 分享模式

我们在看到一些干货文章  ，或好用的小程序想要转发给朋友，那就要用到分享模式。

分享模式可以很简单 ，也可以往复杂了做 ，看产品阶段去实现 。

7. 引导模式

引导模式和反馈模式有点像
，都是展示特定的内容。

那怎么分辨它们呢？以设计师视角来看，反馈模式需要用户触发
，系统被动显示
。而要让用户特别关注的信息 ，那就是引导模式。

总结

模式 ，即抽象的规律。——好夕雷

说了这么多概念和例子，你是不是对模式的认知更清晰了呢  ？

模式运用在产品领域，就有了这 7 种交互模式，分别是“导航模式 、搜索模式 、反馈模式
、输入模式、编辑模式、分享模式 、引导模式”。如果学会了模式  ，那么无论生活还是工作
，相信你一定能轻松应对 、事半功倍
。

作者：产品之外