前言在设计系统中，大家最熟悉、最常用的应该就是设计组件了，它包括文字、图标、按钮、输入框、表单...等一系列构成界面的小元素，而这些小元素的结合体就是笔者要讲的组件库。合理使用组件库能保持界面视觉效果的一致性，让开发高度还原，还为业务带来一致的设计语言，大大提高了团队的工作效率。本文将从组件库的概念、重要性、构建...

前言

在设计系统中，大家最熟悉、最常用的应该就是设计组件了，它包括文字、图标、按钮、输入框、表单...等一系列构成界面的小元素，而这些小元素的结合体就是笔者要讲的组件库。合理使用组件库能保持界面视觉效果的一致性，让开发高度还原，还为业务带来一致的设计语言，大大提高了团队的工作效率。本文将从 组件库 的概念、重要性、构建思维及构建流程等多方面深度解析，希望能帮到大家。

一、组件库的基础知识 1. 为什么需要组件库

当我们在设计某个界面的表单时，确定好输入框的大小、描边、色值等属性后，并没有形成可复用的组件，那么在后续其他界面中需要再次用到表单，就只能重新画、或者找到之前已做好的界面拷贝，很容易疏忽数值、混淆属性，出错率极高。如果需要统一调整尺寸或色值，就要每个单独修改，对于稍大点（上百或几百个界面表单排查）的项目来说，重复无功的劳动简直是一场灾难。

不难看出，一次性设计会将设计师沦为只忙于画图的工具人。若事先将已有组件形成组件库直接调用，既能提高设计输出效率、也能确保整体视觉效果的统一性，将省出来的时间更多投入到业务需求思考中，提升设计价值。

2. 什么是组件库

组件库是将界面中具有通用性的元素组件/控件进行归纳整理，形成统一规范的组件集合，以此达到快速复用、批量修改的目的。

组件库是一个强大的工具库，方便设计师随时调用，对其中一个元素的修改都会将这个已调用过的组件同步更新，非常利于团队之间协作，它通过清晰、标准化的引导帮助 设计师 和研发高效一致的创建大量应用，确保了用户体验的一致性。

3. 结合原子方法论

在 2013 年，前端开发工程师 Brad Forst 在《Atomic Design》一书中提到：“化学世界中，所有的物质都是由原子构成，原子组合构成分子，分子组合构成有机物，最终形成宇宙万物”。Brad Forst 认为，设计组件应该由原子、分子、组织、模版、界面 5 个内容层面构成，最终构建成一张完整的产品界面。

原子：构成界面的最基础且不可再分的元素，可以是一种颜色、一种字体或一个图标等。 分子：由两个或两个以上的原子组合在一起、具有明确功能性的组件，如搜索框、表单、按钮等。 组织：将多个不同的分子组合在一起，形成一个完整的功能模块，例如不同的信息版块区域。 模版：通过原子、分子、组织的相互关联而得到的模版框架，如列表页、详情页等。 页面：在模版的基础上提供真实的内容并完善细节，最终形成完整的高保真界面。

关于原子方法论，这里只做简单了解，后续会单独出详细的文章。

也可以看这篇：

上万字干货！设计师必读的原子设计完整指南 「我们不设计页面，我们设计构成元素的系统。

阅读文章 >

二、组件库的作用 1. 保持一致性

在一个产品中，每个业务都要基于不同的场景去传达信息，多样化的场景在设计表现上会有所不同，有了组件库的约束，就能让团队在既定的框架内按照统一的规范做设计，确保了输出质量，给用户带来一致性的体验。

2. 新人低成本

当团队中有新成员加入时，不管是初入职场的设计新人、还是经验丰富的设计老手，正式工作之前都需要花费一定的时间成本去了解项目的设计语言，而后才能跟上工作节奏，但有了成熟的组件库作为设计参考，就能够以最低的沟通成本、试错成本实现快速上手。

3. 提升团队效率

对设计师，当产品中有多个页面使用到相同的元素或组件时，可从组件库直接调用，减少重复性设计。对于某个组件有统一修改的需求，只要在组件库单独修改，已共用的组件即可同步更新，实现效率的飞升。对开发，可以将一些常用的组件样式进行封装，在任何页面有需要时直接调用，减少冗余，优化性能，既能降低不必要的工作量以及软件包的体积，还能减少与设计之间的沟通，提升了开发效率，后期的维护也会更方便。

4. 稳固品牌形象

品牌基因的部分板块如颜色、字体、图标风格...等都属于组件库的一部分，一致性的视觉样式能保持设计风格的统一，给用户带来统一的品牌印象，让其更好的记住这个产品。

5. 遵守用户习惯

尽量不要违背用户的惯性思维，如绿色代表安全或通过、红色代表错误或警告、看到放大镜就想到搜索，除非合理的制造差异化或你的产品体量足以改变用户，否则就做好承担用户试错成本的损失。组件化设计能通过一致性的设计表现保持用户固有的使用习惯，减少不必要的思考。

三、元素组件的构成 1. 颜色

颜色作为产品设计风格的基本元素，它能建立符合产品调性的视觉形象，并将界面中各信息层级关系梳理清晰，做到视觉上的平衡。首先我们需要按照功能属性对需要用到的所有颜色进行定义，比如主体色、辅助色、中性色、功能色等，并以此提炼出渐变色和色阶，然后将其分组分类命名，方便随时调用。

如何为你的UI制定一套色彩系统？来看这个实战案例！ 色彩在UI设计中的作用：加深品牌印象与品牌感、引导用户视觉凹增加易读性、区分信息交互的状态、营造氛围传递热度...... 前言 不管是做 UI 设计还是画插画，有很多同学觉得自己是因为天赋不够所以对色彩的敏感度不够，其实不然。

阅读文章 >

2. 文字

文字样式中主要包括字体、字号、字重和行高，针对不同的使用场景分别创建相应的字号与字重，并给文字梯度和属性的使用方式予以描述，用表格整理归类，再加上对应的使用说明。

其他如段间距、字距、缩进、对齐方式等属性使用的较少，可根据实际情况而定，确定好使用频率后再决定是否纳入组件库。

5000字干货！写给新手设计师的UI字体使用指南 前言 文字是设计中的重要组成部分，就像我们平时看到的海报，里面各种被精心设计过的字体经常会成为视觉焦点，以醒目且个性化方式传达出内容的精髓，最后达到的效果事半功倍。

阅读文章 >

3. 图标

绘制图标时，需用 keyline 栅格来控制不同形状的图标大小，完成后并将其转曲（面性），再定义好常用的颜色，在后续的开发过程中，程序可根据高保真效果图随时切换颜色。

6大章节！图标设计基础知识全方位入门指南 前言 做好图标设计是一个入门级 UI 设计师的必备技能之一，图标是界面中非常重要的组成部分，在实际的工作中，即便是一些工作多年且有一定经验的设计师，也很难保证自己设计的图标有多么完美。

阅读文章 >

4. 基础组件

参考上述提到的原子方法论，将各个独立元素如原子、分子、组织形成各种组件，在将这些组件进行组合、逐层嵌套，精细化整理归类，最终形成基础组件的创建。例如按钮、弹窗、表单、选项控件...等。

按钮规范：

 

弹窗规范 ：

5000字干货！从5个方面帮你完整掌握弹窗设计方法！ 前言 产品经理：我觉得这里要加个弹窗，你去设计吧。

阅读文章 >

表单规范 ：

6000字干货！6个方面帮你循序渐进掌握表单设计 前言 表单是 UI 设计中很常见的元素，不管是 PC 端还是移动端，表单几乎是无法规避的 UI 控件，用户可以通过表单完成线上购物、信息交换、文章订阅等任务，使用范畴极为广泛且牵扯到方方面面。

阅读文章 >

底部Tab栏 ：

5000字干货！从5个方面帮你完整了解标签栏设计 前言 标签栏是用户进入 APP 的第一触点，绝大多数以固定在设备底部的形式、让用户在应用中的不同模块之间快速切换。

阅读文章 >

下拉菜单 ：

5000字干货！四大章节帮你全面了解「下拉菜单」 前言 下拉菜单是在界面设计中很常用的组件，它以下拉的方式同时展示多个标签并帮助用户缩小选择范围，快速满足用户的选择需求，尤其是一些导航，设计师会很依赖下拉菜单的使用。

阅读文章 >

筛选控件 ：

4000字干货！五个方面帮你完整掌握筛选功能设计 前言 “少即是多”是经常挂在嘴边的话题，在设计过程中，设计师们都会想尽一切办法去简化交互流程、组件元素及各种设计属性，让用户使用起来更简单。

阅读文章 >

选项控件 ：

5000字干货！单选/复选/拨动开关的使用技巧全在这！ 前言 在 UI 设计中，无论从效率角度、还是视觉角度来讲，组件元素始终在界面中扮演着极其重要的角色，其作用主要是提升应用的可用性、易用性，以帮助用户轻松完成任务。

阅读文章 >

标签规范 ：

5000字干货！从零开始帮你掌握标签设计 前言 在现实生活中，每个人都会不同程度的给别人、被别人贴标签，这是一种低门槛、高效率的记住一个人/物的有效方式。

阅读文章 >

头像规范 ：

全面系统！帮你快速掌握头像设计的基础知识 前言 最真实的例子，当我们在某社交软件将头像设置成帅哥/美女，搭讪与被搭讪的概率会成倍提升，这也是为什么行骗的人总是会先设置一个美女头像（背后抠脚大汉）总能提高成功率的原因，头像的魔力可见一斑。

阅读文章 >

小红点 ：

用6大章节，帮你完整掌握界面中的小红点设计 UI设计中最常见的小红点该如何设计？

阅读文章 >

顶部导航栏 ：

5000字干货！全方位掌握「导航栏设计」知识点！ 前言 APP 的顶部导航栏（以下简称“导航栏”）对我们来说再熟悉不过了，它是 UI 设计中必不可少的组成部分，几乎每一个页面都会使用到。

阅读文章 >

间距规范 ：

5000字干货！超详细的保姆级间距设计规范 编者注：UI设计中的间距到底是什么，有什么作用，如何合理有效地使用？

阅读文章 >

进度条 ：

从5个方面入手，帮你设计出优秀的进度条 编者按：本文从进度条基础、常见的进度条类型、进度条设计流程、进度条设计原则和常见问题5个方面帮你掌握进度条设计。

阅读文章 >

搜索框 ：

5000字干货！五大章节帮你掌握搜索设计 本文从搜索的基本属性与特征、搜索入口的样式及应用场景、常见的搜索方式、搜索流程状态解析和辅助模块/元素的妙用5个章节，帮你掌握搜索设计。

阅读文章 >

消息通知 ：

如何提升消息推送转化率？收下这篇超全指南！ 本文从消息通知的基本知识、消息通知渠道、让用户再开启通知权限的方法、提高消息触达率的小技巧等4个章节，帮你掌握消息推送设计。

阅读文章 >

卡片规范 ：

超全总结！5个章节帮你完整掌握卡片式设计 本文从卡片式设计的定义、设计价值、常见的设计样式、适用场景介绍、设计原则及小技巧五个方面，帮你掌握卡片式设计。

阅读文章 >

图片规范 ：

5000字干货！让界面设计更出彩的图片使用指南 前言 在 UI 设计中，配图的好坏将直接影响着界面的品质及用户的视觉体验。

阅读文章 >

四、组件库构建思维 1. 理解产品结构

理解产品结构可以帮助设计师快速构建组件库的基本框架，以此为基础对组件作出分类及权重排序。

其次不同的业务属性，对界面布局的影响也会很大，但相同业务的结构布局基本大同小异，其组件复用性极高，并非设计师不想做差异化，而是在同行业中，相同的业务属性对多数用户来说已经有了一个较为成熟的结构布局，较大的变化会违背用户常用习惯，从而导致用户反感，得不偿失，所以通过对产品结构的了解，会将更多的差异化放在组件细节上，用户接受程度会更高。

2. 组件整理归类

在 UI 层面上，可以将组件分为原生组件、扩展组件、自定义组件、封装组件四种，原生组件与扩展组件属于系统（Android & iOS & 小程序）自带，将其归类为基础组件，自定义组件和封装组件与产品功能有较强的关联性，因此成为属性组件。明确两种定义，能帮助我们合理规划构建组件库的前期工作，也有利于后期调用。

原生组件：系统本省自带的组件，例如按钮、弹窗、导航栏等。 扩展组件：基于原生组件进行扩展，例如toast弹窗中加入图标、导航栏中增加功能入口等。 自定义组件：忽略系统本身的组件，设计出具备产品特性的任何组件，如商品列表等。 封装组件：根据产品使用常见，进行组合封装的常用复杂组件，如日历组件等。 3. 结构细分

结构细分是将本身独立的组件打散，拆分至单一元素的最小颗粒（原子），充分提高细小组件的复用率，需要修改时，独立调整、全局响应，而后再次整合重组，让不同的模块都可以交替变化。多次使用拆分、重组的方式，使最终呈现出来的组件样式、数量成倍数增长。

4. 命名规则

合理的命名是整理和维护组件库的重要环节之一，一方面使后续的维护更加井井有条，另一方面能却确保已形成的组件便于设计索引与调用，如若没有一套所谓「正确」的命名规则，即便构建组件库的人能信手拈来，但并不符合团队中其他成员的使用习惯，无法快速调用，最终很难达成设计共识。

整理归类后，每一类都包含若干组件，每个组件又有若干状态，为了体现结构层次，会在组件名称中使用“/”（Sketch 能自动识别“/”）符号分隔场景类别，并以此作为标志逐级命名，如下：

按钮/主操作/大按钮/待激活 按钮/主操作/小按钮/可操作 表单/输入框/初始状态 ......

五、常见问题及注意事项 1. 先易用、再复用

不管是多么复杂的产品，呈现给用户的永远都是优秀的界面和体验设计，而背后则是逻辑复杂的的无数行代码。组件也是一样，不要因为有组件库的存在就萌生偷懒的想法，毫无节制、退而求其次的高度复用，针对特殊场景，在符合产品易用性的前提下，有必要将已复用的组件解除关联，适当的做加/减法，也不要盲目的求复杂度或简约性，合适最好。

2. 不要过于纠结命名

在构建组件库的过程中，不要将过多的时间花费在组件命名上，笔者的建议是用一些通俗易懂且常用的名称，怎么方便怎么来，类似按钮、表单、图标、弹窗等这些术语，基本一听就懂，没必要绞尽脑汁去想一些唬人、高大上的专业名词，毕竟组件库不是你一个人在用。

3. 组件与创意的冲突

部分设计师觉得，有了组件库的存在，感觉拼组件就能快速完成设计需求，不仅自己没有进步还影响设计创意。其实不然，组件是为解决设计中遇到复用性高的重复性设计需求，如字体、 配色 、表单等，但在一些图形、动效、背景及界面氛围方面可以做出亮点，这样既能保持常用组件的一致性，又能为用户制造意外的惊喜，所以组件库与设计创意并没有实质性的冲突。

4. 利用间歇维护和更新

众做周知，项目是按照一个一个版本逐渐更新迭代的，我们可以利用每个版本之间的间隔时间去复盘之前的设计组件，不断优化和完善组件细节，进行更新维护，避免过于陈旧影响设计效果。

六、结语 组件库是一个强大的提效工具，充分理解并合理运用能减少很多体力劳动，从设计规范到组件库，再到最终的开发还原，为设计与开发之间搭起了一座新的桥梁。组件库的建立让内部有了统一的标注，对团队来说，工作效率得到显著提升的同时，一致性也得到了保障，让设计和开发将更多时间放在打磨产品细节上，实现设计向产品赋能。从全局考虑，完成组件库只不过才刚刚开始，我们一定要学会整体思考，持续优化和完善组件，让组件库始终处于最佳状态，将作用发挥到最大。

组件/规范系列文章至此结束，后续将不再更新，全系列共 24 篇，内容较为基础，欢迎初/中级设计师随时预览。

欢迎关注作者微信公众号：「能量眼球」

前言在设计系统中，大家最熟悉、最常用的应该就是设计组件了，它包括文字、图标、按钮、输入框、表单...等一系列构成界面的小元素，而这些小元素的结合体就是笔者要讲的组件库。合理使用组件库能保持界面视觉效果的一致性，让开发高度还原，还为业务带来一致的设计语言，大大提高了团队的工作效率。本文将从组件库的概念、重要性、构建...

前言

在设计系统中，大家最熟悉、最常用的应该就是设计组件了，它包括文字、图标、按钮、输入框、表单...等一系列构成界面的小元素，而这些小元素的结合体就是笔者要讲的组件库。合理使用组件库能保持界面视觉效果的一致性，让开发高度还原，还为业务带来一致的设计语言，大大提高了团队的工作效率。本文将从 组件库 的概念、重要性、构建思维及构建流程等多方面深度解析，希望能帮到大家。

一、组件库的基础知识 1. 为什么需要组件库

当我们在设计某个界面的表单时，确定好输入框的大小、描边、色值等属性后，并没有形成可复用的组件，那么在后续其他界面中需要再次用到表单，就只能重新画、或者找到之前已做好的界面拷贝，很容易疏忽数值、混淆属性，出错率极高。如果需要统一调整尺寸或色值，就要每个单独修改，对于稍大点（上百或几百个界面表单排查）的项目来说，重复无功的劳动简直是一场灾难。

不难看出，一次性设计会将设计师沦为只忙于画图的工具人。若事先将已有组件形成组件库直接调用，既能提高设计输出效率、也能确保整体视觉效果的统一性，将省出来的时间更多投入到业务需求思考中，提升设计价值。

2. 什么是组件库

组件库是将界面中具有通用性的元素组件/控件进行归纳整理，形成统一规范的组件集合，以此达到快速复用、批量修改的目的。

组件库是一个强大的工具库，方便设计师随时调用，对其中一个元素的修改都会将这个已调用过的组件同步更新，非常利于团队之间协作，它通过清晰、标准化的引导帮助 设计师 和研发高效一致的创建大量应用，确保了用户体验的一致性。

3. 结合原子方法论

在 2013 年，前端开发工程师 Brad Forst 在《Atomic Design》一书中提到：“化学世界中，所有的物质都是由原子构成，原子组合构成分子，分子组合构成有机物，最终形成宇宙万物”。Brad Forst 认为，设计组件应该由原子、分子、组织、模版、界面 5 个内容层面构成，最终构建成一张完整的产品界面。

原子：构成界面的最基础且不可再分的元素，可以是一种颜色、一种字体或一个图标等。 分子：由两个或两个以上的原子组合在一起、具有明确功能性的组件，如搜索框、表单、按钮等。 组织：将多个不同的分子组合在一起，形成一个完整的功能模块，例如不同的信息版块区域。 模版：通过原子、分子、组织的相互关联而得到的模版框架，如列表页、详情页等。 页面：在模版的基础上提供真实的内容并完善细节，最终形成完整的高保真界面。

关于原子方法论，这里只做简单了解，后续会单独出详细的文章。

也可以看这篇：

上万字干货！设计师必读的原子设计完整指南 「我们不设计页面，我们设计构成元素的系统。

阅读文章 >

二、组件库的作用 1. 保持一致性

在一个产品中，每个业务都要基于不同的场景去传达信息，多样化的场景在设计表现上会有所不同，有了组件库的约束，就能让团队在既定的框架内按照统一的规范做设计，确保了输出质量，给用户带来一致性的体验。

2. 新人低成本

当团队中有新成员加入时，不管是初入职场的设计新人、还是经验丰富的设计老手，正式工作之前都需要花费一定的时间成本去了解项目的设计语言，而后才能跟上工作节奏，但有了成熟的组件库作为设计参考，就能够以最低的沟通成本、试错成本实现快速上手。

3. 提升团队效率

对设计师，当产品中有多个页面使用到相同的元素或组件时，可从组件库直接调用，减少重复性设计。对于某个组件有统一修改的需求，只要在组件库单独修改，已共用的组件即可同步更新，实现效率的飞升。对开发，可以将一些常用的组件样式进行封装，在任何页面有需要时直接调用，减少冗余，优化性能，既能降低不必要的工作量以及软件包的体积，还能减少与设计之间的沟通，提升了开发效率，后期的维护也会更方便。

4. 稳固品牌形象

品牌基因的部分板块如颜色、字体、图标风格...等都属于组件库的一部分，一致性的视觉样式能保持设计风格的统一，给用户带来统一的品牌印象，让其更好的记住这个产品。

5. 遵守用户习惯

尽量不要违背用户的惯性思维，如绿色代表安全或通过、红色代表错误或警告、看到放大镜就想到搜索，除非合理的制造差异化或你的产品体量足以改变用户，否则就做好承担用户试错成本的损失。组件化设计能通过一致性的设计表现保持用户固有的使用习惯，减少不必要的思考。

三、元素组件的构成 1. 颜色

颜色作为产品设计风格的基本元素，它能建立符合产品调性的视觉形象，并将界面中各信息层级关系梳理清晰，做到视觉上的平衡。首先我们需要按照功能属性对需要用到的所有颜色进行定义，比如主体色、辅助色、中性色、功能色等，并以此提炼出渐变色和色阶，然后将其分组分类命名，方便随时调用。

如何为你的UI制定一套色彩系统？来看这个实战案例！ 色彩在UI设计中的作用：加深品牌印象与品牌感、引导用户视觉凹增加易读性、区分信息交互的状态、营造氛围传递热度...... 前言 不管是做 UI 设计还是画插画，有很多同学觉得自己是因为天赋不够所以对色彩的敏感度不够，其实不然。

阅读文章 >

2. 文字

文字样式中主要包括字体、字号、字重和行高，针对不同的使用场景分别创建相应的字号与字重，并给文字梯度和属性的使用方式予以描述，用表格整理归类，再加上对应的使用说明。

其他如段间距、字距、缩进、对齐方式等属性使用的较少，可根据实际情况而定，确定好使用频率后再决定是否纳入组件库。

5000字干货！写给新手设计师的UI字体使用指南 前言 文字是设计中的重要组成部分，就像我们平时看到的海报，里面各种被精心设计过的字体经常会成为视觉焦点，以醒目且个性化方式传达出内容的精髓，最后达到的效果事半功倍。

阅读文章 >

3. 图标

绘制图标时，需用 keyline 栅格来控制不同形状的图标大小，完成后并将其转曲（面性），再定义好常用的颜色，在后续的开发过程中，程序可根据高保真效果图随时切换颜色。

6大章节！图标设计基础知识全方位入门指南 前言 做好图标设计是一个入门级 UI 设计师的必备技能之一，图标是界面中非常重要的组成部分，在实际的工作中，即便是一些工作多年且有一定经验的设计师，也很难保证自己设计的图标有多么完美。

阅读文章 >

4. 基础组件

参考上述提到的原子方法论，将各个独立元素如原子、分子、组织形成各种组件，在将这些组件进行组合、逐层嵌套，精细化整理归类，最终形成基础组件的创建。例如按钮、弹窗、表单、选项控件...等。

按钮规范：

 

弹窗规范 ：

5000字干货！从5个方面帮你完整掌握弹窗设计方法！ 前言 产品经理：我觉得这里要加个弹窗，你去设计吧。

阅读文章 >

表单规范 ：

6000字干货！6个方面帮你循序渐进掌握表单设计 前言 表单是 UI 设计中很常见的元素，不管是 PC 端还是移动端，表单几乎是无法规避的 UI 控件，用户可以通过表单完成线上购物、信息交换、文章订阅等任务，使用范畴极为广泛且牵扯到方方面面。

阅读文章 >

底部Tab栏 ：

5000字干货！从5个方面帮你完整了解标签栏设计 前言 标签栏是用户进入 APP 的第一触点，绝大多数以固定在设备底部的形式、让用户在应用中的不同模块之间快速切换。

阅读文章 >

下拉菜单 ：

5000字干货！四大章节帮你全面了解「下拉菜单」 前言 下拉菜单是在界面设计中很常用的组件，它以下拉的方式同时展示多个标签并帮助用户缩小选择范围，快速满足用户的选择需求，尤其是一些导航，设计师会很依赖下拉菜单的使用。

阅读文章 >

筛选控件 ：

4000字干货！五个方面帮你完整掌握筛选功能设计 前言 “少即是多”是经常挂在嘴边的话题，在设计过程中，设计师们都会想尽一切办法去简化交互流程、组件元素及各种设计属性，让用户使用起来更简单。

阅读文章 >

选项控件 ：

5000字干货！单选/复选/拨动开关的使用技巧全在这！ 前言 在 UI 设计中，无论从效率角度、还是视觉角度来讲，组件元素始终在界面中扮演着极其重要的角色，其作用主要是提升应用的可用性、易用性，以帮助用户轻松完成任务。

阅读文章 >

标签规范 ：

5000字干货！从零开始帮你掌握标签设计 前言 在现实生活中，每个人都会不同程度的给别人、被别人贴标签，这是一种低门槛、高效率的记住一个人/物的有效方式。

阅读文章 >

头像规范 ：

全面系统！帮你快速掌握头像设计的基础知识 前言 最真实的例子，当我们在某社交软件将头像设置成帅哥/美女，搭讪与被搭讪的概率会成倍提升，这也是为什么行骗的人总是会先设置一个美女头像（背后抠脚大汉）总能提高成功率的原因，头像的魔力可见一斑。

阅读文章 >

小红点 ：

用6大章节，帮你完整掌握界面中的小红点设计 UI设计中最常见的小红点该如何设计？

阅读文章 >

顶部导航栏 ：

5000字干货！全方位掌握「导航栏设计」知识点！ 前言 APP 的顶部导航栏（以下简称“导航栏”）对我们来说再熟悉不过了，它是 UI 设计中必不可少的组成部分，几乎每一个页面都会使用到。

阅读文章 >

间距规范 ：

5000字干货！超详细的保姆级间距设计规范 编者注：UI设计中的间距到底是什么，有什么作用，如何合理有效地使用？

阅读文章 >

进度条 ：

从5个方面入手，帮你设计出优秀的进度条 编者按：本文从进度条基础、常见的进度条类型、进度条设计流程、进度条设计原则和常见问题5个方面帮你掌握进度条设计。

阅读文章 >

搜索框 ：

5000字干货！五大章节帮你掌握搜索设计 本文从搜索的基本属性与特征、搜索入口的样式及应用场景、常见的搜索方式、搜索流程状态解析和辅助模块/元素的妙用5个章节，帮你掌握搜索设计。

阅读文章 >

消息通知 ：

如何提升消息推送转化率？收下这篇超全指南！ 本文从消息通知的基本知识、消息通知渠道、让用户再开启通知权限的方法、提高消息触达率的小技巧等4个章节，帮你掌握消息推送设计。

阅读文章 >

卡片规范 ：

超全总结！5个章节帮你完整掌握卡片式设计 本文从卡片式设计的定义、设计价值、常见的设计样式、适用场景介绍、设计原则及小技巧五个方面，帮你掌握卡片式设计。

阅读文章 >

图片规范 ：

5000字干货！让界面设计更出彩的图片使用指南 前言 在 UI 设计中，配图的好坏将直接影响着界面的品质及用户的视觉体验。

阅读文章 >

四、组件库构建思维 1. 理解产品结构

理解产品结构可以帮助设计师快速构建组件库的基本框架，以此为基础对组件作出分类及权重排序。

其次不同的业务属性，对界面布局的影响也会很大，但相同业务的结构布局基本大同小异，其组件复用性极高，并非设计师不想做差异化，而是在同行业中，相同的业务属性对多数用户来说已经有了一个较为成熟的结构布局，较大的变化会违背用户常用习惯，从而导致用户反感，得不偿失，所以通过对产品结构的了解，会将更多的差异化放在组件细节上，用户接受程度会更高。

2. 组件整理归类

在 UI 层面上，可以将组件分为原生组件、扩展组件、自定义组件、封装组件四种，原生组件与扩展组件属于系统（Android & iOS & 小程序）自带，将其归类为基础组件，自定义组件和封装组件与产品功能有较强的关联性，因此成为属性组件。明确两种定义，能帮助我们合理规划构建组件库的前期工作，也有利于后期调用。

原生组件：系统本省自带的组件，例如按钮、弹窗、导航栏等。 扩展组件：基于原生组件进行扩展，例如toast弹窗中加入图标、导航栏中增加功能入口等。 自定义组件：忽略系统本身的组件，设计出具备产品特性的任何组件，如商品列表等。 封装组件：根据产品使用常见，进行组合封装的常用复杂组件，如日历组件等。 3. 结构细分

结构细分是将本身独立的组件打散，拆分至单一元素的最小颗粒（原子），充分提高细小组件的复用率，需要修改时，独立调整、全局响应，而后再次整合重组，让不同的模块都可以交替变化。多次使用拆分、重组的方式，使最终呈现出来的组件样式、数量成倍数增长。

4. 命名规则

合理的命名是整理和维护组件库的重要环节之一，一方面使后续的维护更加井井有条，另一方面能却确保已形成的组件便于设计索引与调用，如若没有一套所谓「正确」的命名规则，即便构建组件库的人能信手拈来，但并不符合团队中其他成员的使用习惯，无法快速调用，最终很难达成设计共识。

整理归类后，每一类都包含若干组件，每个组件又有若干状态，为了体现结构层次，会在组件名称中使用“/”（Sketch 能自动识别“/”）符号分隔场景类别，并以此作为标志逐级命名，如下：

按钮/主操作/大按钮/待激活 按钮/主操作/小按钮/可操作 表单/输入框/初始状态 ......

五、常见问题及注意事项 1. 先易用、再复用

不管是多么复杂的产品，呈现给用户的永远都是优秀的界面和体验设计，而背后则是逻辑复杂的的无数行代码。组件也是一样，不要因为有组件库的存在就萌生偷懒的想法，毫无节制、退而求其次的高度复用，针对特殊场景，在符合产品易用性的前提下，有必要将已复用的组件解除关联，适当的做加/减法，也不要盲目的求复杂度或简约性，合适最好。

2. 不要过于纠结命名

在构建组件库的过程中，不要将过多的时间花费在组件命名上，笔者的建议是用一些通俗易懂且常用的名称，怎么方便怎么来，类似按钮、表单、图标、弹窗等这些术语，基本一听就懂，没必要绞尽脑汁去想一些唬人、高大上的专业名词，毕竟组件库不是你一个人在用。

3. 组件与创意的冲突

部分设计师觉得，有了组件库的存在，感觉拼组件就能快速完成设计需求，不仅自己没有进步还影响设计创意。其实不然，组件是为解决设计中遇到复用性高的重复性设计需求，如字体、 配色 、表单等，但在一些图形、动效、背景及界面氛围方面可以做出亮点，这样既能保持常用组件的一致性，又能为用户制造意外的惊喜，所以组件库与设计创意并没有实质性的冲突。

4. 利用间歇维护和更新

众做周知，项目是按照一个一个版本逐渐更新迭代的，我们可以利用每个版本之间的间隔时间去复盘之前的设计组件，不断优化和完善组件细节，进行更新维护，避免过于陈旧影响设计效果。

六、结语 组件库是一个强大的提效工具，充分理解并合理运用能减少很多体力劳动，从设计规范到组件库，再到最终的开发还原，为设计与开发之间搭起了一座新的桥梁。组件库的建立让内部有了统一的标注，对团队来说，工作效率得到显著提升的同时，一致性也得到了保障，让设计和开发将更多时间放在打磨产品细节上，实现设计向产品赋能。从全局考虑，完成组件库只不过才刚刚开始，我们一定要学会整体思考，持续优化和完善组件，让组件库始终处于最佳状态，将作用发挥到最大。

组件/规范系列文章至此结束，后续将不再更新，全系列共 24 篇，内容较为基础，欢迎初/中级设计师随时预览。

欢迎关注作者微信公众号：「能量眼球」

很多年前，当我还是一名计算机专业的大四学生时，整天上网浏览各类招聘信息，想找到一个合适的程序员实习岗位。除了实习岗位外，我偶尔也会点进一些“高级工程师”的招聘帖里。现在回想起那些帖子，抛开让人眼花缭乱的技术名词，我印象最深的就是常出现在第一行的岗位年限要求：“本职位要求 工作经验 5 年以上”。

很多年前，当我还是一名计算机专业的大四学生时，整天上网浏览各类招聘信息，想找到一个合适的程序员实习岗位。

除了实习岗位外，我偶尔也会点进一些“高级工程师”的招聘帖里。现在回想起那些帖子，抛开让人眼花缭乱的技术名词，我印象最深的就是常出现在第一行的岗位年限要求：“本职位要求 工作经验 5 年以上”。

作为一只一天班都没上过的小菜鸟，这些年限要求在我眼里简直长到夸张。不过，望洋兴叹之余，我有时也会在心中暗暗憧憬一下：“五年工作经验的程序员，那该多厉害啊？写代码对于他们来说，是不是像吃饭一样简单？”

时光荏苒，一晃十几年过去了。如今回头一望，自己也成了一名有着 14 年工作经验的光荣打工人。在软件开发行业摸爬滚打这些年后，我发现很多事情，与我在大四时所想象的大不相同，比方说：

随着经验增长，编程并不会变简单太多，“像吃饭一样简单”只出现在梦里 给许多“大项目”写代码不光没意思，还很危险，远不如在 LeetCode 上做一道算法题有趣 只从技术角度思考问题，成不了好程序员，有些东西远比技术更重要 细想起来，这类关于编程的感触还有许多。我整理了其中 8 条，写成了这篇文章。如果其中某些观点引起了你的共鸣，我会非常高兴。

更多 编程 干货：

学编程后，我做了这10个有毒的在线免费设计神器！（下） 上篇的5个神器大受欢迎，人气极高。

阅读文章 >

一、写代码很简单，但写好代码很难 编程曾经是一项门槛很高的专业技能。从前，一个普通人想学编程，最常见的做法就是通过教材和书本学习。不过大部分编程专业书，十分艰深晦涩，对于初学者来说很不友好。因此不少人在尝到编程的乐趣前，就早早地半途而废。

但如今，学编程正在变得越来越容易。学习不再像以前那样，只能硬啃书本，而是多了许多新途径。观看教学视频、参加 Codecademy[1] 的交互式课程，甚至直接在 CodeCombat[2] 通过玩游戏来学编程，每个人都能找到适合自己的学习方式。

“妈，我真没在玩游戏，我在学编程呢！你看屏幕右边！”

此外，编程语言也在变得越来越易用。经典的 C 和 Java 不再是大多数初学者的首选，许多更简单、更易上手的动态类型语言如今大受欢迎，与之相关的 IDE 等工具也变得越来越完善。这些因素进一步降低了编程的学习门槛。

总而言之，编程早已褪去了它的神秘面纱，从只有少数人才能掌握的神秘技能，变成了一门人人皆可学习的普通手艺。

但更低的学习门槛，更友好的编程语言，并不意味着人人都能写出一手好代码。如果你已经工作，参与过一些项目，那我很想问你一个问题：”你日常接触的这些项目的代码质量如何？是好代码多，还是烂代码多？”

不知你会怎么回答，我先来说说我的答案。

1. 好代码还是很少

2010 年，我跳槽到了一家总部位于北京五道口的大型互联网公司。

加入这家公司前，我只在十人规模的小公司待过，因此，我对新公司在各方面都有着很高的期待，尤其是软件质量方面。当时，我心里想的大概是这样：“这可是支撑了有着千万用户量的产品的大项目，代码质量跟之前那些比，肯定有质的飞跃吧！”

等到在新公司工作了一周后，我才发现自己实在是错得离谱。所谓“大”项目的代码质量同我的预期相去甚远。打开 IDE，数百行的函数和神秘的数字字面量比比皆是，开发任何一个小需求都难如登天。

后来，在待过更多公司，接触了更多软件项目后，我总结出一个道理：不论公司多大、项目多牛，在实际工作中遇见好代码，仍然是小概率事件。

2. 好代码有哪些要素？

话说回来，到底怎样的代码才算是好代码？在这方面，Martin Fowler 有一句话常被大家引用：

“Any fool can write code that a computer can understand. Good programmers write code that humans can understand.”

“任何傻瓜都能写出计算机能理解的代码。优秀程序员写人类能理解的代码。”

我认为它可以作为评价好代码的原点：好代码一定是可读、易读，且容易理解的。写出好代码的第一原则，就是把人类读者放在第一位。

除了可读性以外，评价代码好坏还有许多其他维度：

贴合编程语言：是否使用了当前编程语言的推荐写法？语言特性和语法糖，使用程度是否恰到好处？ 易于修改：代码设计是否考虑了未来的需求变更，当变化发生时，代码是否容易随之修改？ API 设计合理：API 设计是否合理，易于使用？好的 API 在简单场景下使用方便，在高级场景下又可以随需求扩展。 性能够用：代码性能是否满足当前业务需求，同时为未来保留了一定提升空间？ 避免过度设计：代码是否存在过度设计、过早优化的毛病？ … 总而言之，对于任何层级的程序员来说，好代码都不是什么唾手可得的东西。要写出好代码，需要在许多维度上反复权衡、精心设计，最后再加以持续打磨。

既然如此，假如想尽快掌握写代码这门手艺，有捷径吗？

3. 写好代码的捷径

在许多层面上，我认为编程和写作非常相似[3]。二者都是使用文本和符号来表达思想，只是方式略有不同。

谈到写作，我想问一个关于作家的问题：“你听说过不读书的作家吗？你有没有听到过某位作家说，他从来不读其他人的作品，只读自己的东西？”。我猜答案应该是否定的吧。

如果你去查阅相关资料，你会发现许多职业作家的日常生活，就是阅读和写作两件事在不断循环。他们每天会花大量时间阅读各类文字，然后再写作。

同样是“文字工作者”，程序员们就很少重视阅读。但要想快速提升编程能力，阅读正是不可或缺的重要一环。除了日常工作接触到的项目以外，我们应该更多地阅读那些经典软件项目，从中学习 API 设计、模块架构和代码编写的技巧。

不光代码和技术文档，最好再定期读一些计算机方面的专业书，保持阅读书籍的习惯。在这方面，我认为 Jeff Atwood 在 15 年前写的文章 "Programmers Don't Read Books -- But You Should（都说程序员不读书——但你应该读）"[4]，如今读来仍不过时。

提升编程能力的捷径，就藏在“阅读 <-> 编程”这个无尽循环里。

“一个好的程序员应该做什么？”

二、编程的精髓是“创造” 在程序员的日常工作中，有很多事情会让人充满成就感，甚至情不自禁地感叹“编程真美好”。比方说，修复了一个极难定位的 Bug，用新算法将代码性能提升了一倍，等等。但在所有的这类事情当中，没有任何一件，能和“亲手创造出一件东西”相比。

当你在编程时，创造新事物的机会实际上随处可见。因为并非只有发布一个新软件，才称得上是“创造”。写一个可复用的工具函数、设计一套清晰的数据模型，全都可以归入“创造”的范畴。

身为程序员，保持对“创造”的热情至关重要。因为它可以帮我们：

更高效地学习：学习一门新技术，最高效的方式就是用它开发一个真实项目，在创造的过程中学习，效果最好。 有机会邂逅了不起的东西： 许多改变世界的开源软件，最初都是作者纯粹出于兴趣所创造，比如 Linus Torvalds 和 Linux，Guido van Rossum 和 Python。

1989 年的圣诞假期，荷兰人 Guido van Rossum 敲下了 Python 语言的最初几行代码，Python 最初仅被期望作为 ABC 语言的继承者，但后来“吞噬”了全世界

虽然“创造”好处多多，程序员们也有大把机会去做，但许多人常常缺少一种身为“创造者”的觉悟。就像那个广为流传的小故事所说：一位哲学家询问正在砌砖的工人，有人清楚地知道自己是在建造一座大教堂，有人却认为自己只是在砌砖。很多程序员正是“只见砖块，不见教堂”。

将自己定位成创造者后，看待事物的方式就会发生天翻地覆的变化。举个例子，同样是给 API 增加报错提示文字，创造者们就能跳出“快速完成需求就好”的思维陷阱，向前一步，追问自己一些更重要的问题：“我想为用户创造什么样的产品体验？怎样的报错文字，更能帮助我达成该目标？”

就像任何一个有用的编程模式一样，“创造者思维”也能成为你的职业生涯的一道巨大推进力。因此，现在就试着问自己一个问题吧——“我的下一份创造会是什么？”

三、打造高效试错的环境至关重要 我曾参与开发过一个互联网产品，它设计精美，功能丰富，每天都有大量用户使用。

但就是这么一个从市场角度看颇为成功的产品，工程质量却非常糟糕。如果你打开它的后端项目，把所有目录翻个底朝天，都找不到任何一行单元测试代码，其他自动化测试流程也是无从谈起。而业务逻辑偏偏又十分复杂，最后，项目代码间的意料耦合多如牛毛，开发一个新特性，很容易把旧功能给搞挂。

“在忙啥呢？” “试着修复我之前修一个问题时搞出来的问题，那问题是我之前解决另一个问题搞出来的，而那个问题又是我……”

因此，项目每次发布时，开发和产品同学全都得严阵以待，氛围十分紧张。整个发布过程也很刺激，紧急回滚时有发生。一个人在这样的环境中工作，技术成长抛开不谈，心理素质肯定能得到极大锻炼。

编程原本是一件充满乐趣的工作，但为这样的项目编程，乐趣根本无从谈起。究竟是什么夺走了编程的乐趣？

1. 理想的编程体验≈“刷题”

LeetCode[5] 是一个著名的编程学习网站，上面提供了许多覆盖各个难度的编程题，大部分与算法相关。用户可以选择自己感兴趣的题目，直接在浏览器上编写代码（支持十几种编程语言）并执行。如果通过了全部的测试用例，则算作解答成功。

在 LeetCode 上做题

在 LeetCode 刷题很像在玩游戏，富有挑战性，同时也很有趣。整个做题过程，实际完美展现了一种理想化的编程体验：

关注点分离：每道题目都是一个独立个体，同一时间内，开发者可以完全沉浸在一道题目中； 快速获得精准反馈：开发者每次调整代码后，能通过自动化测试快速获得结果反馈； 零成本试错：写出的代码语法有错误、逻辑有问题，没有任何不良后果，心理负担小。 不过，屏幕前的你很可能觉得我在说些废话。

“不然呢？解算法题、写小脚本，不就是这样的体验吗？有啥特别值得说的？”你很可能会继续补充道，“你知道我们公司的项目有多复杂吗？规模超大，模块巨多，你懂我意思吗？每天服务 ××× 万人，光数据库就好几套，消息队列都有三种，开发起来当然要麻烦一点咯！”

确实，全世界的软件千差万别，开发起来不可能都像在 LeetCode 上刷题一样轻松愉快。但这并不意味着，我们不应该努力改善自己身处的编程环境，哪怕只有一点点。

要通过改善环境来提升编程体验，可用的理念和工具包括：

模块化思想：妥善设计项目中的每一个模块，降低耦合，提升正交性 设计原则：微观层面上，应用那些经典的设计原则和模式，比如“SOLID”原则 自动化测试：编写规范的单元测试，必要时使用 Mock 技术，用自动化测试覆盖业务关键路径 缩短反馈回路：切换编译速度更快的工具，优化单测性能，竭尽全力缩短从“改完代码”到“获得反馈”的等待时间 微服务架构：必要时，将大单体拆分为多个职责各异的微服务，分散复杂度 …… 关注编程环境，刻意创造出允许高效试错的“代码乐园”，让工作像刷题一样轻松愉快。是经验丰富的程序员能为自身团队做出的最好贡献之一。

四、避开代码完美主义陷阱 在代码质量上精益求精是好事，但也要注意别掉进完美主义的陷阱。因为编程不是艺术创作，不鼓励人们无限度地追求极致。作家大可花上数年打磨一本传世之作，但程序员在代码上钻牛角尖就很有问题。

世间没有完美的代码。大多数时候，你的代码只要能满足当前需求，又为未来扩展留了一些空间就够了。有那么几次，我在简历上看到候选人给自己打着“代码强迫症”标签。隔着屏幕，我虽能感受到 TA 对代码质量的那份重视，但在我心底，其实更期望 TA 早已将完美主义陷阱远远甩在了后头。

五、技术很重要，但“人”也许更重要 在软件开发领域，“单一职责原则”（全称为 Single responsibility principle，后简称为 SRP）是一条非常著名的设计原则。它的定义很简单，一句话就可以概括：“每个软件模块应该只有一个被修改的理由”。

单一职责原则：能做到，并不意味着你就该这么做

要掌握 SRP 原则，关键在于搞清楚“被修改的理由”为何物。很显然，程序是没有生命的，它自身不能也不需要主动去改变。任何修改程序的理由，都来自与之相关的人，人是导致修改的“罪魁祸首”。

举个简单的例子。看看下面这两个类，其中哪一个违反了 SRP 原则？

一个字典数据类，支持两类操作：存数据、取数据； 一个员工资料类，支持两类操作：更新个人信息、渲染一张用户资料卡片图。 在大多数人眼里，第一个例子没问题，但第二个例子却明显违反了 SRP 原则。要得出该结论，好像无需任何严格的分析和证明，运用一丁点直觉即可。但假如做一些正经分析，第二个例子的可疑之处，在于能为其轻松找出两个不同的修改理由：

管理员认为资料中的“个人电话”字段不能有非法号码，需增加简单的校验逻辑 某员工认为资料卡片图上的“名字”部分太小，希望加大字体 ”It is people who request changes. And you don’t want to confuse those people, or yourself, by mixing together the code that many different people care about for different reasons.” ——“The Single Responsibility Principle”

“是人在要求软件变更。你绝不想把那些不同人出于不同原因所关心的代码混在一起，这样只会把他们和你自己搞糊涂。”——“单一职责原则”

理解 SRP 原则的关键，在于先理解人以及人在软件开发中所扮演的角色。

再举一个例子。微服务架构是近些年很火的一个技术话题。但许多人在讨论它时，往往只关注技术本身，却忽视了微服务架构与人之间的关系。

将微服务架构风格与其他东西区分开的关键，在于将大单体拆分为独立的微服务后，不同模块间的边界可以变得更清晰。跟数百人的团队一同维护着一个大单体比起来，许多小组织各自维护着独立的微服务，明显拥有更高的运作效率。

如果缺少了特定的组织规模（也就是“人”）作为前提，空谈微服务的各种技术优势和那些花活，纯属本末倒置。

技术当然很重要。身为技术人员，那一张张瑰丽的架构图和独具匠心的代码细节，天然吸引着我们的注意力。但是，也请千万不要对软件开发里的另一个重要因素“人”视而不见。必要时，转换一下看事情的角度（从“技术”转向“人”），那样对你大有裨益。

六、求知若渴是好事，但也要注意方法 如今人人都在说“终身学习”，而程序员是一个尤其需要终身学习的职业。因为计算机技术的迭代更新非常快，某个三年前流行的框架或编程语言，很可能一个月前已经过时。

一分钟之内会发生什么事情？Netflix 观看时间增长 70,000 小时；Snapchat 上有三百万视频被观看；Google 新增两百四十万次搜索；一个 JS 新框架被发明（这条不是真的 ）

要在工作中表现得游刃有余，程序员们需要学习的东西非常多，涵盖各个层面。拿我比较熟悉的后端领域举例，一位合格的后端工程师至少需要掌握以下这些：

一种或多种后端编程语言 / MySQL 等关系数据库 / Redis 等常见存储组件 / 设计模式 / 用户体验 / 软件工程 / 编译原理 / 操作系统 / 网络基础 / 分布式系统 / …

虽然要学很多，但据我观察，大部分程序员其实都挺爱学习（至少不排斥），因此心态不是问题。不过有的时候，光有“求知若渴”的心态并不够，学习时，我们尤其需要关注“性价比”。

1. 关注学习性价比

下面这张图，展示了学习成效和投入之间的关系。

学习成效与投入关系图，横轴为学习投入，纵轴为学习成效

从图中可以看到，在学习的初级阶段，投入较少时，所获得成效增长飞快。但当成效超过某个阈值后，之后再想继续提升，所需要的学习投入就会呈指数级增长。

正因如此，我建议你在学习任何一项新事物时，先在脑海中想清楚一个问题：“我应该在上图中的哪个位置停下来？”，而不是闷头猛学。

知识的海洋浩瀚无边，有些东西需要我们成年累月的持续学习，不断精进。也有些东西，蜻蜓点水般学到一些皮毛已绰绰有余。准确判断并分配自己有限的学习精力，甚至比努力学习本身更重要。

2. 挑选合适的学习资料

有了学习目标后，下一步就是寻找合适的学习资料。在这方面，我想分享一次自己的失败经历。

有段时间，我突然对产品交互设计产生了浓厚的兴趣，认为自己应该在这方面有所精进。于是，我精心挑选了一本领域内非常经典的专业书：《About Face 4: 交互设计精髓》[6]，将其买回家中，满怀信心地认为自己的交互设计能力可以迅速获得提升。

但事与愿违，当我捧着那本经典著作时，发现自己连第一章都无法顺利读完——那句老话说的没错：“隔行如隔山”。

从这次失败中，我总结出了一点经验。那就是学习某项新东西时，我们最好挑选那些更易读，更适合“门外汉”的学习资料，不要“眼睛大，嘴巴小”，只知道奔着最经典、最权威的资料而去。

回顾之前的经历，我觉得以下几本书非常适合门外汉学习使用，性价比极高：

《写给大家看的设计书》[7]：设计相关 《点石成金》[8]：Web 用户体验相关 《鸟哥的 Linux 私房菜》[9]：Linux 系统相关 也许每个人的内心，都想成为一个博学的人，无所不知，无所不晓。但可供分配的时间的精力总是有限，我们不能，也不需要在所有领域都成为专家。

七、越早开始写单元测试越好 我非常非常喜欢单元测试，我认为写单测这件事，对我的编程生涯影响极大。夸张点说，如果以“开始写单元测试”作为分界线，把我的职业生涯分割成两段，后面那段远比前面那段精彩得多。

写单测的好处很多，比如单测可以驱动你改善代码的设计、可以作为代码的一种文档，等等。此外，完善的单元测试还是构建前面提到的“高效犯错的环境”的关键。

我已经写过几篇关于单测的文章，比如《有关单元测试的 5 个建议》[10]、《游戏“蔚蓝山”教我的编程道理》[11]。所以在这儿，我不打算再重复一遍。只说一句：如果到目前为止，你从未试过写单元测试，或从没重视过测试，我建议你从明天就开始写起来。

一般情况下我不测试我的代码，但假如测的话，我在生产环境测

八、程序员最大的敌人是什么？ 在大多数程序员段子里，产品经理经常作为反派角色出现。他们口中的项目需求总是变个不停，一天冒出一个新想法，搞得程序员苦不堪言。

客户每天都在不停修改需求，所以，我们决定在下次发布前，把这些需求“冻结”起来

在这些段子的烘托下，不断修改需求的产品经理，仿佛真成了程序员们最大的仇敌。似乎只要产品不乱改需求，大家的工作环境马上就会成为乌托邦。

虽然偶尔吐槽一两句产品经理很有意思，但我还是想一本正经的说一句：产品经理不是敌人。

因为从某种角度来说，软件生来就是准备被修改的（不然你猜，软件为什么叫“软”件？）。这样看来，开发软件和修建房子完全不同。因为没人会在建好一栋大楼后说：“让我们把它推倒重建一遍吧！一样的楼，但是用的钢筋和水泥比之前少 30%！”

所以，产品经理以及不稳定的需求不是程序员的敌人。并且，能否写出易于修改、适配变化的代码，是区分普通程序员和优秀程序员的重要标准之一。

那么，程序员们最大的敌人又是什么呢？

1. 复杂度是最大的敌人

就像《代码大全 2》中所说：软件开发的核心问题是管理复杂度。失控的复杂度就是程序员最大的敌人。

来看看那些导致项目复杂度不断增长的要素：

不断增加的新功能： 更多的功能等于更多的代码，更多的代码通常意味着更高的复杂度 对高可用的需求： 为了实现高可用，消息队列等额外的技术组件和代码被引入 对高性能的需求： 为了提升性能，缓存和相关模块代码被引入，部分模块被拆分后，换成高性能语言重写 一再被推迟的重构：因项目排期过于紧张，迫在眉睫的重构被一再推迟，技术债越积越多 忽视自动化测试： 没人写单元测试，也没人关心测试 … 终有一天，当项目的复杂度增长到一定程度后，空中会传来一声巨响。“咚！”，一个大家不愿改、不敢改的“大坑”凭空出现在了所有人的 IDE 中。

猜猜看，究竟是谁挖下了这个坑？

那些在降低复杂度上投入时间的团队，所负责的软件项目更容易成功

2. 减缓复杂度增长的过程

虽然复杂度总是会不可避免地持续增长，但有许多实践可以减缓该过程。如果每个人都能做到以下这些事，复杂度就有可能被长期控制在合理范围内：

精通当前编程语言与工具，写整洁的代码 使用合适的设计模式和编程模式 对重复代码零容忍，抽象库和框架 适当运用整洁架构、领域驱动设计思想 编写详尽的文档和注释 编写规范有效的单元测试 分离那些变动的与不变的 … 要求看上去很多，但总结起来，核心其实就是一句话：写更好的代码。

写在最后 2020 年，我在小组内做了一个分享，当时的 PPT 标题是《编程十年后的十个感触》。将资料分享在公司内网后，有位同事看到，评论说光看 PPT 不过瘾，希望我能将其扩展成一篇文章，我回复说没问题。如今 3 年过去了，我总算是兑现了自己的承诺。

当年准备分享材料时，我做完整个 PPT，最后一页实在不知道该放些啥。于是灵机一动，搞了个纯白色的背景，中间打了一行黑体大字：“十年很短，编程很难”。如今，第二个十年也已快行至中途，而这句话的后半部分好像对我仍然适用——长进不大，继续加油 。

欢迎关注作者微信公众号：「piglei」

第二次世界大战之后，美国经济获得更进一步发展，因为大战期间美国不但远离战场得以独善其身，还能卖武器发战争财。在此过程中进一步促进了自身的工业技术发展，在战后用于产品生产，因为综合实力强，美国战后主导了国际贸易，可以将各式各样的产品卖到世界诸国，形成良性循环。经济因此又进一步发展，其后的“国际主义风格”也是基于这样...

第二次世界大战之后，美国经济获得更进一步发展，因为大战期间美国不但远离战场得以独善其身，还能卖武器发战争财。

在此过程中进一步促进了自身的工业技术发展，在战后用于产品生产，因为综合实力强，美国战后主导了国际贸易，可以将各式各样的产品卖到世界诸国，形成良性循环。

经济因此又进一步发展，其后的“国际主义风格”也是基于这样的背景而产生。

堪称商业设计万金油的国际主义是如何发展至今的？ 国际主义（InternationalStyle）在当代是非常重要的风格，它属于商业设计中的“万金油”，放之四海而皆准，世界各国人民似乎都可以接受它，未必最好，但挺合适。

阅读文章 >

二战后的美国社会

除了产品风格方面的文化侵略，美国还有一些出色的市场运作模式被欧洲引用，比方 1932 年诞生，1950 年代被汽车行业广泛采用的“有计划的废止制度“。

主导人物是当时美国通用汽车集团总裁艾尔弗雷德·斯隆（Sloan，Alfred Pritchard Jr）。

艾尔弗雷德·斯隆

这种制度的“玩法”跟设计工作密切相关，以汽车为例，通过会预先设定好几年后将会更换的设计，一般一年一小变，三到五年一大变，通过不断的设计更新刺激消费者感觉自己的产品过时，继而产生新的购买行为。

通用汽车推出的产品

比方我们观察德国 BBA（奔驰、宝马、奥迪），基本也是遵循这样的时间周期升级产品设计。

更有甚者会在产品部件的使用性能上着手，比方五年内都用得挺好，但五年后空调不行了，音响坏了，底部有异响，顶棚脱落等。

宝马 3 系的历史演变

这些都是有意为之的设定，用意也是提醒消费者该换新的，因为维修费用并不低，这一套玩法基本成为世界通用的产品设计潜规则。

一、战后的世界设计格局 二战之后的欧洲陷入一片狼藉，比方英国在 1950 年初还在实行生活用品的配给制，而意大利那边连基本生活都难以保障，德国则被分裂为两个国家—民主德国与联邦德国。

随后因为全球资本主义国家阵营与社会主义国家阵营拉开冷战的关系，美国在 1947 年推行著名的“马歇尔计划“，从经济角度给西方盟国及日本提供一些援助。

马歇尔计划挽救了欧洲经济

因为这个利好政策，大致 1950 年代中期西方各国慢慢度过难关，进入了所谓的“丰裕社会“（Affluent Society）阶段。

这个阶段我们可以简单理解为“物质生活极为丰富”，此时大部分西方国家都意识到设计对经济发展的重要促进作用。

丰裕社会中的平民大众

比方英国其实在二战还没结束的时候就成立了“工业设计协会”，目的是希望通过各种可行方式提升英国工业设计水平，从而促进国际贸易发展，后来这个组织“进化”为“英国设计协会”。

丰裕社会中的精英阶层

协会的主要举措就是面向社会举办各种展览与比赛，大力奖励与资助商业的优秀设计。

比方二战刚刚结束，英国就在 1946 年举办一个叫“英国能做到”（The Britiain Can Make It）的展览以示决心，没想到足足吸引到国内 120 万观众，所以英国的举措也被欧洲各国借鉴与学习。

“英国能做到”设计展

对现代设计的发展态度方面美国显得非常个性化，两次大战之间美国设计在世界上异军突起，原因前面已经谈过，美国政府习惯将设计看作一种完全市场化的行为。

因此并不会从国家层面作出任何干预，他们做对了两件极为关键的事情，其一就是有严格的知识版权保护法规，其二是严格控制市场垄断行为。

美国当时的服装设计

这样一来给设计行业带来非常公平安全的发展环境，促进设计行业的良性发展。

二战后的美国虽然设计水平会跟随经济市场波动而波动， 但无论汽车、家庭用品，电器及办公用品等设计都位居当时全球最高水平。

美国 1940 年代的汽车设计

他们的产品风格与作业方式成为西方国家广泛学习的典范，这些影响辐射到了日本地区与东南亚。

美国文化与产品也大量输出世界各国，比如好莱坞电影、流行歌曲，可口可乐、口香糖、美国香烟与家用电器等，甚至美国杂志《生活》（life）与《时代》（Time）也风行全球。

美国《生活》杂志

因此日后称作“国际主义”的设计风格其实甚至可以狭隘的定义为“美国风格”，是一种基于现代主义形式而产生的商业风格。

这种风格是由商业市场与消费者主导，同时包含美国式的大众通俗文化。

美国随后产生了著名的战后“婴儿潮”，大约有三分之一的人口在 1950 年末出生，随着这批婴儿成长，慢慢成为主要消费阶层。

美国 1950 年代的婴儿潮

这个阶层从小就受美国式大众通俗文化的消费观念影响，教育水平更高，知识结构更完整，消费能力更强，审美更加多元化，为了适应他们的需求美国产品的设计样式也在不断发展与更新。

除了婴儿潮，战后还有一个“设计的富裕市场”产生于 1950 年代末期的“女权运动” 浪潮。

美国女权运动

这个运动在美国首先发起，然后波及西方各国，原因是第二次世界大战期间大部分男性参战，所以工厂与事业单位的工作只能由女性担任，这种情况在战后继续发展，彻底改变女性的社会地位。

更独立与开放的女性

女性不但可以经济独立，也可以是消费主力军，她们对服装、化妆品、个人护理产品等产生大量需求，这些需求都需要设计行业进行快速的响应。

二、世纪中叶的设计浪潮 到了 20 世纪中叶，设计行业在西方已经变得成熟，在企业及品牌运作当中其地位也进一步获得重视。

比方前面我们谈包豪斯篇章时提及的乌尔姆学院就活跃于这个时期，其对设计的教学研究及商业运用已趋向科学性。

看故事学设计！包豪斯是如何在美国德国发展起来的？ 1933 年包豪斯被纳粹政府正式关闭，但所谓“人在灯就在”，包豪斯培养出来的优秀学员并没有放弃对现代设计的探索。

阅读文章 >

乌尔姆学院的课堂

所以当设计在美国经历了职业化之后，也慢慢体系化与制度化。

比方在商业市场上，1960 年代-1970 年代“企业形象”（如今称作 CI，Corporate Identity）设计活动发展得迅速而广泛，企业也认同其对市场运作有良好作用。

随后更发展出“行为标志”（简称 BI，Behavior Identity）与“观念标志”（简称 MI，Mind Identity），这种体系直到如今仍旧是大部分设计服务公司的核心服务。

美国著名平面设计师保罗兰德

这类设计的雏形其实在 60 年前就出现，就是 1907 年时候德国设计师彼得贝伦斯为 AEG 电器设计的一系列品牌形象。

1907 年 AEG 电器的品牌形象设计

美国人将其完整规范化下来，这套做法直到 20 世纪 90 年代末才从日本传到中国，当时收费高昂，但其实真正能做好的设计师不多，能接受的客户也很少。

20 世纪 60 年代之后讨论“设计”的语境跟战前已经大为不同，设计专业变得越来越细分。

产品设计成为新兴的独立行业

设计师也不像第一代那样以“包打天下”的模式服务，公司可以业务形式多样，但主创设计师慢慢更加专注于一个领域。

比方工业设计在现代化进程中其专业性越发凸显，这个时期产品设计的美观、体验、功能、品位都被更综合的考虑起来，工业设计师需要懂的知识更多，比方工程学、消费心理学、品牌学等。

汽车设计的发展越来越完善

因此，诞生了一门新学问系统，这门学问跟产品设计密切相关，到了一种不得不考虑的程度，也就是—— 人体工程学 （Ergonomics）

三、人体工程学的诞生与发展 人体工程学其实并非一个全新学问，从定义上来说，这是一种：“研究人与人造产品之间协调关系的学问，通过研究人的行为，动机及反应，将其归纳为系统为产品设计过程提供依据，以求达到优化人与产品之间的互动关系，获得最佳表现”

所以有一些翻译也会译作” 人机工程学 “。

人机工程学测试

所以严格而言自从人类开始制造工具之后就产生这种人体工程学的考量了，比方尺寸大小，使用是否方便与安全等。

根据一些记载，古希腊时期的医生在设计手术工具及流程的时候就有这种人体工程的考虑，比方手术过程该站立还是坐下，如何布光更方便观察，手上工具的形状大小及重量该如何设计更适中，如何摆放更方便取用等等。

古希腊时期的医生

所以人体工程学只是因为工业化高速发展，产品与工具越来越多的情况下，才被更系统的研究，发展为一套完整学问。

发展过程有三个主要阶段：

1. 工业革命的成熟

前面说过，工业革命之后人类使用的工具越来越多，就产生了过去很多从未遇过的问题，于是需要更系统去考量彼此关系。

比方 1911 年时候美国一名管理学家在研究如何提升煤矿工人工作效率时候发现，假设将煤铲尺寸减小，同时提高铲煤频率居然可以让工人的效率提升三倍

工作中的煤矿工人

同样的实验还有将一些砌砖工人的工作方法进行改良，将其动作数量由 18 个减少到 4.5 个，居然将工人以往 1 小时砌砖的数量从 120 块提升到 350 块。

工作中的砌砖工人

所以第一个阶段的人体工程学主要集中在研究提升工业化生产效率问题。

2. 世界大战阶段

第一次到第二次世界大战期间是工体工程学获得长足进步与转变的阶段，因为战争过程中，如何让武器最大可能适应人的使用要求可以成为战争是否胜利的关键，需要就是发明之母完，因此参战各国都在努力往这方面研究。

战争期间美国的武器工场

比方当时一名美国陆军中尉通过调查发现，一些战斗机不同功能的操控按钮太相似，位置安排也不分类，极容易操作失误造成严重后果，所以开始进行针对性优化。

战斗机的机舱

比方将同类型操作的按钮分区组合，将一些重要操作位置加大，改变形态，通过手感也能区分，这些改进大大减少了战机失误，从而提升战斗力。

这个时候我们想一想，假设你日常需要驾车，就会恍然大悟为何一些按钮要放在特定位置，比方应急灯，为啥一些按钮的形状还有位置间距居然那么合理，你总是在需要的时候不用看也能按中，其实因为它们都融入了人体工程学的考虑。

人体工程学汽车内饰设计探索

3. 战后至今

二战之后人体工场学开始被独立出来专门研究，因此进入最高速的发展阶段，直到如今还在不断优化完善。

第一第二阶段的发展主要是针对拓展人的肌肉力量，而战后至今的研究就转而扩大到增强人的思维力量了，希望通过设计解放与拓展人的脑力劳动。

人体工程学的研究

人体工程研究首先在 1970 年代达到高潮，当时人体工程被认为是获得良好设计的唯一途径。

每当话说到这种份上就存在“神化”的嫌疑了，所以后来慢慢回归理性，至今而言，人体工程学主要研究区域集中在四个大类，分别是人的生理，人的心理，人与组织及人与环境，所以成为一个综合的专业学科。

人体工程学相关实验

希望做好设计的朋友们千万不要忽略这个学科的重用性，今天分享就到这里，感谢各位，我们下期再会。

欢迎关注作者的微信公众号「 设计史 太浓」：

一个 SaaS 产品的后台是如何设计的？作为知识付费行业的头部 SaaS 服务商，从 2016 年诞生不到 7 年时间，小鹅通注册客户数已经超过 160 万，终端访问用户人数超过 7.8 亿，毫无疑问成为了国内知识付费规模最大的 SaaS 产品。为什么拆解小鹅通的后台？

一个 SaaS 产品的后台是如何设计的？作为知识付费行业的头部 SaaS 服务商，从 2016 年诞生不到 7 年时间，小鹅通注册客户数已经超过 160 万，终端访问用户人数超过 7.8 亿，毫无疑问成为了国内知识付费规模最大的 SaaS 产品。

为什么拆解小鹅通的后台？这是因为后台设计往往被多数产品、开发甚至老板忽略，他们甚至认为后台不需要设计，更不需要考虑 用户体验 ，能把功能实现就可以交付。但我的观点恰巧相反，我认为一个 SaaS 产品设计 最大的挑战和关键正是后台。它决定了运营者的工作效率和操作体验，即便你的功能再强大，如果用户不会用、不愿意使用，那么用户也不会续费，而续费，正如《SaaS 创业路线图》作者吴昊在他书中的观点——SaaS的本质，就是续费。设计大侦探的第一个 B端产品 拆解，选择了工作量最大、最繁杂的后台，阅读时间长，非常乏味，但如果你认真啃完，你对SaaS产品、后台设计、B端设计不会再陌生。都说良药苦口，这碗药，廖尔摩斯先干为敬。

往期拆解：

万字拆解！12306产品设计全方位深度解析 有人说它是全世界最牛逼的 APP，因为它的算法难度和春运期间访问量几乎是全球之最；但有人说它是全世界最垃圾的 APP，因为在使用这个产品的过程中，遇见很多奇葩、愤怒的体验。

阅读文章 >

一、导读 1. 内容结构

小鹅通的后台拆解包含四个部分，分别为导读、产品画像、设计拆解和总结，内容篇幅超过 4 万字，阅读时间较长，所以拆分为 4 篇文章发布，建议收藏阅读。

2. 适读人群

第一类，产品经理/UI/交互设计师，通过对小鹅通后台产品的深度拆解，跳出执行层，培养后台设计的全局观，从功能价值、应用场景、业务流程和用户体验多维度去学习和思考一个头部 SaaS 产品的后台如何设计。

第二类，SaaS 产品及知识付费从业者，获取一份专业、完整、有深度价值的 SaaS 竞品设计参考。

3. 分析模型

第一，增长模型。由戴夫·麦克卢尔提出，包含用户获取、用户激活、用户留存、获取收入、用户推荐，分别对应用户生命周期中的 5 个重要环节，主要用于分析产品的功能价值。

用一篇文章，让你掌握能让用户快速增长的AARRR 模型 AARRR模型因其掠夺式的增长方式也被称为海盗模型，是Dave McClure 2007提出的，核心就是AARRR漏斗模型，对应客户生命周期帮助大家更好地理解获客和维护客户的原理。

阅读文章 >

第二，尼尔森十大原则。尼尔森十大可用性原则是界面设计中最基础、最重要的设计原则，任何产品的设计，都可以通过这十个原则进行指导设计，这个原则主要用于诊断后台设计的用户体验。

用超多案例，帮你掌握尼尔森十大可用性原则 尼尔森设计原则是人机交互学博士 Jakob Nielsen 于 1995 年发表的“十大可用性原则”。

阅读文章 >

第三，其他设计基础理论，包括费茨定律、格式塔原则、席克定律等，主要用于判断后台设计的易用性。

4. 拆解步骤

SaaS 产品的后台的设计不仅复杂，而且很多功能如果不亲自体验根本没法理解，所以针对小鹅通后台的拆解，我分为以下三个步骤进行

第一，亲自上手实操体验操作。对每一个功能版块进行了全面的实操体验，弄清楚了才开始拆解，绝非走马观花。

第二，结合官方帮助文档创作。在体验小鹅通产品的时候，有很多功能必须结合帮助文档才能理解，甚至由于权限和内容问题，部分功能没法体验，只能靠官网介绍来理解。针对每一个功能，严格按照「功能介绍-功能价值-使用场景-页面内容-核心功能-操作流程」的结构去描述，旨在让产品设计师看懂这个功能设计的价值和细节。

第三，深入思考产品设计细节。在拆解完每一个功能，我都会加入自己的思考，主要分为细节侦查（值得我们学习的细节）、迭代建议（个人认为可以优化的地方）、设计思考（某个功能带给我的启发）、体验陷阱（用户体验糟糕地方）和体验小结（针对某个功能版块进行全面总结）。

5. 阅读建议

由于内容篇幅太长，强烈建议你可以申请小鹅通免费试用账号一边阅读一边体验，这样对整个后台的设计才更深有体会。

二、产品画像 1. 产品简介

小鹅通是知识产品与用户服务的数字化工具，包含知识店铺、企业直播、企业培训、企微助手等多款产品，可以为有线上经营、商业变现、私域运营、用户服务等需求的企业，提供一站式技术服务，助力企业完成数字化升级。根据官方数据显示，截止到 2023 年 2 月，小鹅通注册客户数已经超过 160 万，终端访问用户人数超过 7.8 亿，是目前国内知识付费客户数量最多、规模最大的 SaaS 产品。

2. 用户角色

用户角色是指使用操作小鹅通后台的用户，主要分为运营者和店铺销售。

① 运营者

店铺的运营者主要负责店铺装修、商品管理、用户运营、数据分析、活动策划、拉新引流等工作内容，是小鹅通后台主要使用的用户群体。

② 店铺销售

店铺销售会通过企业微信和 CRM 工具使用小鹅通，不过他们主要通过企业微信的小鹅通应用进行工作，很少涉及后台操作。

3. 信息结构

从信息结构看，小鹅通后台主要包括店铺、圈子、直播、内容、商品、营销、交易、用户、CRM、企微、数据、应用、设置和服务 14 大版块（感谢探友@miki 对小鹅通后台信息结构的梳理）。

三、设计拆解 小鹅通的后台非常庞大，包括了店铺、圈子、直播、内容、商品、营销、交易、用户等 14 大版块，其中每一个版块又包含若干功能，体验起来非常繁杂，很容易陷入焦虑感。所以我按照一个知识店铺从 0 到 1 装修、添加内容、店铺推广和运营的步骤把小鹅通的后台拆分为 8 个服务，然后再对每个版块的内容进行详细拆解。

1. 初始设置 当我从官网开通小鹅通的知识店铺以后，进入到管理后台，面对如此繁杂的功能，我想做的第一件事，就是对我的店铺进行基础设置，我得让用户知道这个店铺叫什么名字。

① 店铺设置

「店铺设置」为商家提供了店铺的基本信息设置，比如店铺信息、品牌形象、用户账号设置等。

「店铺信息」提供店铺名称、店铺管理员和主营类目的设置，非常基础。 「用户账号设置」 提供在使用系统过程中的各种登录偏好设置，比如登录设备限制，可自定义学员使用同一账号在同一时间不同浏览器上同时登陆的情况 「引导设置」提供了引导用户关注公众号、加入社群、收藏店铺、添加客服和添加手机号等功能，对新用户的首次访问至关重要。 「功能配置」支持用户对商品销量、播放量/浏览量、评论审核、严禁词、视频播放器、商品评价、买家申请售后等功能进行设置，可以看出系统非常完整和灵活。

迭代建议

用户的短期记忆一般不会超过 5 秒，所以在体验「设置」这个栏目的时候，我就发现小鹅通的功能太过繁杂，这对新手商家的入门有很高的学习成本。这个栏目的内容其实可以拆分为基础设置、高级设置这样的阶梯式内容，有助于缓解新手用户的焦虑。

② 员工管理

「员工管理」是为商家提供新建员工、运营角色管理、员工权限设置的功能，这个栏目主要帮助商家管理自己的运营团队。

③ 角色管理

「角色管理」包含了系统默认的多个角色，比如高级管理员、普通管理员、财务、老师、课程顾问、教务专员、销售员等，并且可以对每个角色进行权限设置，另外系统也支持商家新增自定义角色，满足商家各种运营需求。

④ 操作日志

「操作日志」记录了整个系统管理员的登录和操作内容记录，日志系统作为一个后台系统必不可少的模块，它可以记录下系统所产生的所有行为，这有助于商家对系统运行监管，并且可实时监控员工在系统中的敏感操作，加强员工培训和管理。

⑤ 消息推送

「消息推送」是商家建立外部触发最好的方式，这个版块主要为商家提供各种场景的消息推送设置，小鹅通支持服务号代发、短信通知和 APP 推送通知三种类型。

⑥ 体验小结

在对「设置」模块的实操体验中，感受到小鹅通的功能非常强大，甚至功能多得有点让人透不过气，这对新手商家来说，会产生很多的焦虑和压力，我迫切需要一份最基础、最简洁的新手引导指南。这也突然让我想起了当我申请小鹅通体验账号时，客服专员向我多次提及给我做新手操作培训，但我都婉拒了，也许对于一个头部 SaaS 产品来说，客服专员的培训是客户体验过程中必不可少的一个环节，但是我认为好的设计，其实不需要太多的学习成本。

2. 添加内容 当我把店铺的基础信息设置好以后，接下来，就需要为我的知识店铺准备上架的内容了。我找到了「内容」这个模块，发现小鹅通支持的内容形式非常多，从视频、音频到图文专栏，把常见的内容形式都涵盖了。

① 内容

「内容」版块包含内容类型和互动工具两个部分，商家可以在「内容类型」选择自己要发布的形式发布内容，而「互动工具」则是帮助商家课程运营和学生管理的工具。

内容类型

小鹅通支持视频、音频、图文、电子书、AI 互动课、专栏、训练营和会员 7 种类型，几乎覆盖了常见的内容形式。

1）视频

「视频」是最常见的内容形式之一，商家可以把录制好的课程视频上传到这个栏目，就可以开始向学员销售。

新建视频

「视频」包含基本信息、课程内容、所属组合课、商品信息和状态设置五个部分。 在「基本信息」，商家需要填入商品名称等基本信息； 在「课程内容」，管理员可对视频的播放进行设置（比如课程未学完禁止拖动进度条和倍速播放等），还可以对内容设置保护（禁止文字防复制和开启防录屏跑马灯）。 「所属组合课」是提供商品和其他内容（专栏、会员和训练营）关联，比如新添加的商品属于某个付费专栏，那么就可以关联，提升效率。 在「商品信息」，可以设置商品的售卖方式，支持免费、付费、加密和指定学员。针对付费视频，还可以支持片段试看，提升付费转化。 「状态设置」是指在添加完商品后，商家可选择立即上架、定时上架或暂不上架，比如商家在准备某个促销活动的时候，可以提前编辑商品，设置定时发布即可。

视频管理

「视频」添加成功后，在「视频」栏目页，可以查看商品的详情，对商品进行编辑，分享、下架、复制和删除等。 「分享」是指商家可以把商品的链接、二维码等信息直接复制分享给好友，同时也起到了预览的作用，这是一个公用的组件，在其他商品和版块同样适用。

视频详情页

「视频详情页」主要分为课程设置、运营设置、学员列表和数据分析四块内容。

「课程设置」就是对课程的相关信息进行设置，相当于对内容进行二次编辑。

「运营设置」从四个解为一个通用的表单；「CRM分配」是指可以把浏览课程的学员自动分配给企业的CRM销售人员；「私域引流」是指可以引导用户扫码加群，提高课程服务质量和商家对学员的运营能力。

在「学员列表」，可以查看当前购买商品的所有学员信息，包括购买时间、学习进度等信息，系统也支持商家手动添加可学习课程的学员。

在「数据分析」栏目，可以查看商品的「学习效果」和「交易数据」，比如商品的订阅人数、学习人数、完课率、学习趋势图等，通过这个栏目，可以帮助商家对用户的学习进行深入的分析，提升运营效率。

设计思考

在初次添加店铺内容的时候，对很多功能板块都不熟悉，比如 CRM 分配、超级会员等，虽然能感受到小鹅通系统的强大，但对于刚入手的商家，则会产生很深的焦虑，不知道这些功能如何设置和使用，也无法感受到这些功能对店铺运营的帮助。

音频

「音频」也是一种常见的内容形式，可以设计讲书、广播等产品，用户可以在地铁、公交等场景收听。「音频」的新建流程、商品管理功能和「视频」相似，我们不再赘述。

图文

「图文」也是一种常见的内容形式，可以为学员提供付费阅读等类型产品，「图文」的新建流程、商品管理功能和「视频」相似，我们不再赘述。

迭代建议

付费阅读其实是知识创作者非常喜欢的方式，小鹅通虽然设计了这个功能，但前端的界面设计并没有根据图文内容传播的特点设计，所以用户体验并不理想，显得非常鸡肋。

电子书

「电子书」对于出版社等用户群体，是一个刚需功能。在上传电子书文件以后，系统可以自动解析书籍章节，轻松完成电子书在线管理和售卖。其次在店铺前端，用户可在手机端阅读，支持区域触摸翻页、章节试读、划线、书签、更换背景等功能，阅读体验非常友好。「电子书」的新建流程、商品管理功能和「视频」相似，我们不再赘述。

AI 互动课

随着近两年 AI 技术的发展，小鹅通也加入了 AI 互动课的内容形式。商家可以利用 AI 互动形式的课程内容，搭建具有沉浸式场景的课程学习形式，实现个性化、趣味性、强互动的授课形式，不过搭建成本相对较高，更适合于有特定需求的客户。

新建流程

「AI互动课」的新建流程分为三个步骤，分别是填写基本信息、制作课程内容和填写售卖信息。 在「基本信息」，商家需要输入课程名称和详情页等信息。 进入「课程内容」以后，左侧提供了内容组件（文字、图片、音频和视频）、题目组件（单选题、多选题、不定项、判断题和填空题）和其他组件（章节标题和附件），商家可以根据自己的需求加入组件进行设计。 商家在填写售卖信息以后，就可以进行上架销售。

专栏

专栏

「专栏」可以将多个单品课程打包成系列课销售，比如常见的付费专栏、连载小说、有声读物等。「专栏」建立后，进入详情页，可以在「目录管理」添加专栏商品，还可以对专栏的商品设置排序和设置试看。其他功能和「视频」相似，我们不再赘述。

大专栏

「大专栏」就是「专栏」的父级，可以将多个专栏进行打包，组合成专项学习专题，打造学员深度系统学习方案。

训练营

「训练营」相比「课程」，是一个动态的服务。商家根据某个学习主题，集中式、计划式、督学式地学习。「训练营」也是一种常见的引流手段，通过打卡、签到、学习，可以快速帮助商家进行传播拉新。

新建训练营

商家建立训练营以后，需要建立营期才能开始招生。

营期的建立分为营期基础信息、营期课程和售卖信息三个步骤。在「营期基础信息」，需要设置开课信息，包括招生时间和开课时间；其次支持设置三种目录解锁模式，自由模式（无门槛自由学习）、闯关模式（完成任务才能继续学习）和日期解锁（每天只能学习一定数量的课程）。

在「营期课程」，商家需要添加训练营的学习任务，可以加入店铺的课程内容，还可添加打卡、考试等助学工具，增强督学效果，提升用户活跃度。

会员

「会员」是商家可以打包特定商品内容（包括专栏和商品）进行销售，它的功能流程和「专栏」功能相似，在建立「会员」后，进入详情页的目录管理才能添加课程商品。这个功能可以帮助商家聚集一定量级的忠实粉丝，实现店铺的稳定收入。

设计讨论

不知道是不是语义的问题，我对「会员」这个功能有很多不理解，首先感觉和「专栏」很相似，其次和「超级会员」也有点傻傻分不清楚，所以在体验的过程中，花了很多时间去学习研究。

体验小结

从小鹅通支持的 7 种内容形式来看，它几乎覆盖了所有的知识付费内容，视频、音频、电子书、专栏，甚至还有 AI 互动课。这足以满足各种知识用户人群的内容要求，不管你是销售录播课、音频课还是文字专栏，小鹅通真正的实现了一分钟拥有自己的知识店铺。

② 互动工具

「互动工具」包含了打卡、考试、练习、作业本、题库、证书、表单、活动管理、随堂检测、测试活动和付费问答 11 种工具。

打卡

「打卡」是一个提升用户活跃度的运营工具，通过持续的打卡输出，不仅可以帮助学员养成一些比较好的行为习惯，还可以帮助商家提升用户付费转化。「打卡」分为日历打卡、作业打卡和闯关打卡三种形式。

日历打卡

「日历打卡」是以“天”为单位的打卡模式，学员需要每天在有效时段内提交打卡内容，比如每日英语学习打卡、早睡打卡等。

a. 新建流程

「日历打卡」的建立有两个步骤，分别是设置打卡信息和打卡介绍设置。在「设置打卡信息」，分为基本信息、打卡规则和其他设置三个内容。「基本信息」可以设置打卡的起止日期、打卡时段、提醒方式、每日打卡次数、可补打卡次数、参与条件和打卡规则等；「打卡规则」主要是设置用户打卡的内容类型和范本；「其他设置」可以帮助商家关联超级会员和指定商品文件。

在「打卡介绍设置」步骤，需要添加打卡的封面图和详情页介绍，完成后打卡建立添加成功。

细节侦查

如果不是亲自新建一次「打卡」，你根本无法理解一个小小的「打卡」功能竟然会如此复杂，包含的场景和功能竟然会有这么多。

b. 打卡详情页

「打卡」建立以后，可以进入打卡的详情页，主要分为日记管理、任务管理、学员管理、分组管理、助教管理、激励设置、运营设置和数据分析 8 块内容。

「日记管理」主要指用户在前端的日记打卡，老师可以根据学员的日记进行评论、置顶、加精和删除，还支持批量导出日记。

「任务管理」是指给学员布置学习任务，帮助学员更好地学习。

「学员管理」主要提供对打卡用户的管理，比如查看学生打卡详细资料和暂停打卡等。

「分组管理」支持老师对打卡的学员进行分组，提高管理效率。

「助教管理」支持老师添加助教，助教可以对学生打卡进行点评、删除和精选等操作。

「激励设置」是指为了鼓励学生坚持打卡，老师可以设置证书、返学费和积分这样的形式来吸引学生参与（证书和积分我们在下面会单独讲解）。「返学费」是一个打卡活动中常见的营销方式，学员完成指定的任务就可以拿到打卡费用的返现，这样不仅可以筛选精准用户，也可以提高用户的打卡积极性。

「运营配置」主要包含配置日签和邀请卡两个部分。「日签」是一种吸引用户传播的手段，通过个性化和精美的日签设计，不仅可以体现活动特色，还能激发学员的收藏欲望，最终吸引用户主动传播，拉新引流。「邀请卡」也主要是为了激发学生传播引流，不仅设计了精美的邀请卡片，还支持老师自定义设计，以及直接引流自私域社群。

「数据分析」是对整个打卡的数据进行全面的分析统计，包括当天打卡人数、打卡次数、新增学员、点赞数、评论数、加精数等等，通过精准的数据分析，可以为商家运营方案提供支撑。

作业打卡

「作业打卡」是以布置“作业”的形式打卡，这种打卡方式可以加强教学质量的检验，让学生产生完成作业的紧迫感，督促学生进行学习。

闯关打卡

「闯关打卡」是以“关卡”作为单位的打卡模式，这种打卡形式由于自身具备游戏的挑战性，所以能够有效刺激学生为了拿到更好的成绩而努力打卡，从而提升用户参与度和积极性。

考试

「考试」是用来检测用户学习效果的学习工具，商家可以通过考试情况得到学习效果反馈，可根据考试反馈进行后续课程优化。

新建考试

「考试」的建立分为三个步骤，分别是设置考试信息、选择试卷和发布。

「设置考试信息」又分为基本信息、信息采集、考试设置、题目分值和结果设置五个内容。「基本信息」需要填入考试的基本信息，选择需要关联的课程；在「考试设置」，老师可设置参考考试的时间、考试时长、考试次数等；在「结果设置」，可以选择考试完就展示成绩、题目和答案。

在「选择试卷」步骤，可以创建新试卷，也可以从试卷库中选择已设置好的试卷，其次还可以设置考试通过分数的成绩。

添加试卷以后，管理员可选择立即发布、定时发布以及开启微信服务号通知，帮助学生可及时获取考试的消息通知。

考试管理

在学生开始考试以后，后台会生成考试数据，商家可查看考试的详细情况，包括批阅、统计分析、老师管理、设置证书等。

练习

「练习」满足了商家售卖已有题库题目，为学员提供自主刷题练习工具的需求，而通过反复练习，可以提高学员学习效果，有助于提升用户的活跃度和留存率。

新建练习

「练习」的建立包含基本信息、练习设置、商品信息、私域引流和信息采集五个步骤。

在「练习设置」，管理员需要关联题库，设置答题的出题顺序（包含随机和按顺序），题目数量和考试难度；

「商品信息」可以设置「练习」是否付费，或需要参与关联课程才能学习；「私域引流」和「信息采集」是公共组件，我们在上文已经解读过，不再重复。

练习管理

学生开始练习以后，后台可查看学员的练习数据，包括练习参与人数、每道题目的正确率等，这些数据可以帮助商家及时调整运营方案，或针对性对学生进行讲解授课。

作业本

「作业本」主要帮助老师和学员在课程后续实现互动和答疑，不仅可以加强学生对知识的学习，帮助老师了解学员学习的状态，更能提升用户活跃度。

新建流程

管理员需要先建立一个「作业本」，这个流程比较简单，输入名称以后，选择关联课程，还支持关联「圈子」（一个用户运营的重要功能），老师布置的作业会在课堂互动和作业动态显示。

「作业本」建立以后，管理员可以布置「作业」。「作业」分为手动布置（新建）和题库布置（从现有的题库中直接选择）。「手动布置」需要输入作业名称和作业内容，支持上传图片和音频，填写完成后，作业创建成功。

题库

「题库」需要配合作业、考试和练习场景使用，为这些工具提供数据支撑。

题库

「题库」支持添加单选题、多选题、不定项选择题、判断题、填空题、问答题和材料题等多种类型。添加也非常简单，管理员选择好题目类型以后，填入内容就能新建成功。 「批量导入」是为管理员提供批量输入题目的工具，按照系统提供的输入范例格式，系统可以一键识别出题目，轻松录入。 「Excel导入」也是一种常见的导入形式，不过需要按照系统标准的批量导入模版，才能实现批量导入。

试卷库

「试卷库」是题库中题目的组合，可以看作是「题库」的父级。管理员可按照自己的需要把题目手动或自动组合成试卷，在考试、作业等场景中就能及时调用，提升工作效率。

「试卷库」的新建流程包括设置试卷信息和组卷两个步骤。在填写完试卷基础信息以后，在「组卷」步骤，可以选择「手动选题」和「系统抽题」。「手动选题」就是管理员从题库中逐一手动选择，准确率较高，而「系统抽题」则是系统根据管理员的题型设置随机抽题，具有随机性。

证书

「证书」可以为学生带来成就感，激励学生坚持完成任务，当学员通过考试、完成作业以后，管理员可以向学员颁发证书，最终提升用户活跃度。

「证书」的建立包含基本信息、发放规则、证书样式、证书信息、发证信息和证书分享六个内容。 在「基本信息」，管理员可选择证书类型，包括考试证书、打卡证书、圈子证书等，另外，证书需要关联对应的考试。 在「证书样式」，系统提供了数十种系统样式，管理员可根据自己的偏好和品牌VI选择，其次也支持自定义样式，上传设计好的背景图片即可生成。 在「证书信息」，管理员可以编辑证书标题、获奖文案等，还可以加入鼓励文案，吸引用户传播分享。 在「发证信息」，可加入发证日期、证书编号和发证印章等，突出真实性。 在「证书分享」，可以添加分享语和二维码，通过学生的分享，为商家拉新引流。

表单

「表单」是运营者用于发起问卷调研，自定义收集用户信息的社群功能。它可以帮助商家收集用户需求和反馈信息，通过对用户的调研分析，进一步设计和优化运营策略，从而为用户提供更精准的服务

新建流程

「表单」的建立分为三个步骤，分别是编辑表单、表单设置和表单发布。

「编辑表单」分为三块内容，左边是组件和外观，管理员需要从这里选择内容，比如单选、文本框等。「组件」包含基础组件（单选、多选、下拉菜单、文本框等）、描述分割（文本描述、图片、分隔栏）和个人信息（姓名、性别、年龄等），「外观」可以设置表单底色、标题、选项内容字体大小和颜色。选中内容以后，中间为表单编辑区域，可以实现可视化编辑，包括调整顺序、删除等。右侧可以设置表单的字段和逻辑，包含基础设置、选项设置、逻辑显示规则等。 在「表单设置」，可以设置用户提交的次数、回收方式（支持定量、定时回收）、微信分享信息和私域引流。 在最后一步「表单发布」，需要关联对应的内容，比如相关视频、课程、专栏、圈子、训练营等内容，关联成功后，表单就可以发布。

活动管理

在店铺的运营中，举办线下活动必不可少，「活动管理」就是为了解决这个场景而设计。管理员可以使用「活动管理」功能组织线下活动，一站式完成线上发布活动信息、用户报名、收集报名用户信息、管理报名情况、现场签到等流程。

发布活动

「活动」的发布包含基本信息、票务设置、座位设置、报名信息设置和私域引流六个部分。

在「基本信息」，管理员需要填入活动的名称、地点、时间、关联的课程等信息； 在「票务设置」，可以添加免费票和收费票，设置票种的展示规则等； 「座位设置」部分，还可以开启自动排座，活动座位由系统自行分配； 在「报名信息设置」，管理员可以根据自己的需求灵活配置用户报名的信息，非常方便； 「私域引流」可以帮助管理员在活动报名前后将潜在用户引流至商家的私域流量池。

名单管理

活动建立成功后，商家就可以发布活动，「名单管理」就是活动报名的详细数据，包含报名管理和签到管理。

a. 报名管理

「报名管理」主要包含了所有活动报名的数据管理，比如待审核、报名成功等，管理员可以在这个栏目查看报名用户的详细信息。

b. 签到管理

「签到管理」有两种形式，一种是用户自行扫码签到，系统会生成活动的二维码，管理员向用户展示扫码即可；另一种是商家主动扫码核销，工作人员进入票券核销页面以后，就可以对报名的用户进行扫码核销。

随堂检测

「随堂检测」是一个协助老师校验学生学习质量的辅助工具，它不仅可以提升学生对课堂知识的学习和巩固，还能有效防止学员挂机学习，提升学习效率。

测试互动

「测试互动」是一个通过设置轻量级的在线趣味测试，刺激用户活跃的社群玩法。运营者可根据用户特性设计测试题目，激发用户好奇心，活跃已沉淀的粉丝，增强学习过程的互动乐趣，同时可以设置根据测试结果给用户推荐课程。

新建流程

「测试互动」的新建包含了设置测试信息、添加题目和结果页设置三个步骤。

在「设置测试信息」，运营者输入测试名称、简介和设置有效时间； 在「添加题目」步骤，需要加入测试活动的题目，支持单选和多选； 在「结果页」设置，需要设置测评结果，并可以向用户推荐指定的课程，进行付费转化。

付费问答

「付费问答」是一个为商家增加变现的工具，学生付费向老师提问，获取一对一答疑。「付费问答」需要先创建一个问答专区才能开启，有点像建立一个问答专栏。当用户在前端购买问答服务以后，运营者可以在手动邀请答主进行答疑。其次这个功能也设计得很完善，还支持设置用户围观价格和围观分成。

体验小结

在体验完这 11 个互动工具以后，我开始感受到小鹅通这个工具的魅力。从引流到激活、从留存到传播，这 11 个工具几乎能满足一个知识店铺运营多维度的需求。而让我最惊叹的是小鹅通产品的设计细节，比如一个普通的打卡功能，如果只是从前端体验看，你根本无法想象这些小功能的后台设置其实有这么复杂。而小鹅通为了降低商家的运营成本，几乎支持每一个功能版块自定义，给我最大震撼的就是「证书」这个功能，不仅提供多种证书设计样式，连证书内容的每一个字段，都可以在后台自行输入，无需任何加工，实在是太方便了。

② 商品

「商品」主要指实物商品和服务类商品的发布和管理，如果商家有周边商品，可以通过实物商品来上架，服务类商品则是指虚拟服务，比如 1V1 咨询、设计指导这样的虚拟服务。「商品」栏目的功能比较简单，我们就不过多赘述，大家可以亲自体验。

欢迎关注作者微信公众号：「设计大侦探」

编者按：这篇文章出自资深 B 端 UI/UX 设计师 Taras Bakusevych ，他对于产品、视觉、体验设计上，都有深入的钻研，而这些钻研是实实在在的项目喂出来的实战经验。他之前的每篇文章都值得一读这10个设计原则，是确保金融类产品体验优秀的核心要义财务和金融相关的应用是一个相对专业的分支，在这个领域当中...

编者按： 这篇文章出自资深 B 端 UI/UX 设计师 Taras Bakusevych ，他对于产品、视觉、体验设计上，都有深入的钻研，而这些钻研是实实在在的项目喂出来的实战经验。他之前的每篇文章都值得一读

这10个设计原则，是确保金融类产品体验优秀的核心要义 财务和金融相关的应用是一个相对专业的分支，在这个领域当中创造体验优异的设计并不是一件简单的事情。

阅读文章 >

在资深设计师眼中，这 10 个设计原则更值得学习和了解 编者按：在做设计的时候，设计师到底要遵循哪些设计原则？

阅读文章 >

以下是今天的正文：

出色的新用户引导，能够缩短用户了解产品价值的路径，能够帮助用户迅速抵达令人惊艳的细节，获得成就感，完成任务，和产品产生情感连接。

1、第一印象至关重要 新用户引导通常是产品当中用户历程的起点，用户和产品的初次交互将会塑造产品对于用户的第一印象，如果做的足够好，则能够带来较强的用户忠诚度，将用户变成长期客户和产品拥护者。

在整个用户产品周期当中，新用户引导是起点，然后是用户使用和用户留存的阶段。

新用户引导阶段：初次使用产品，成为产品的用户。 产品使用阶段：用户能够熟练使用产品和功能，能够实现预期目标，获得预期收益。 用户留存阶段：用户不断提升参与度，开始使用产品所提供的更多功能，成为专家级用户和产品的拥簇。

2、新用户引导并不是简单的产品介绍 新用户引导时常和产品介绍界面混淆，很多产品在新用户引导界面介绍产品的功能和优势。

那么，在你设计新用户引导界面的时候，需要问问自己这几个问题：

这些界面是帮助用户获得他们想要的东西，还是在他们前进道路上带来不便的？ 我们的界面是在介绍显而易见的事情吗？ 这些信息在此时此刻是否可操作？是否有用？

要让用户在打开界面第一屏的时候就可以交互和使用。产品优势介绍应该是在 App Store 或者 Google Play 的 APP 预览页上展示的，那是用户试图了解产品的地方，也是更加合理的地方。

3、最好的新用户引导是沉浸式的 很多产品功能其实很简单，并不一定真的需要开头单独设置引导页。新用户引导是否需要，取决于多个因素：

用户的目标和需求 业务需求、行业标准、法规要求 产品所需要的经验和熟练程度 产品的熟悉度和开创性程度 有很多产品是简单到开箱即用的，而还有一些产品则需要经过漫长的引导培训，用户才能正常使用、达成目标，以避免出现错误付出高昂的代价。

4、新用户引导流程可以由多个元素组成 像注册、订阅服务、功能推荐、定制服务等，都可以应用到新用户引导当中。新用户引导的重要性，和你产品的收入模式有很大的关联。比如付费订阅类的产品，新用户初次上手的体验之后产生的评估，将会极大地影响后续的订阅付费意愿。关于这一点，NNGroup 有过非常专业的分析： https://www.nngroup.com/articles/mobile-app-onboarding/

5、介绍、小贴士和操作提示 APP 内的教程和介绍，主要是教育用户使用某些功能，并且引导用户在 APP 内抵达特定的页面和功能。而这种引导的呈现形式也不尽相同，比如卡片式说明、全自动产品导览、视频教程以及工具提示。

好的 产品设计 应该是不言自明的，所以设计的核心目标是设计清晰、独立不言自明的界面，而不是指令式的引导。

避免设计冗长的指令引导和教程 提供简短清晰的、和上下文环境高度相关、可操作的引导指令，并且用户可以禁用这些引导指令。

操作提示——关于特定操作、交互的请求或者建议，比如引导用户给 APP 评分，与朋友分享，或者启用消息推送。这些操作提示如果放置在新用户引导阶段，实在是太早了，很容易让用户感到抵触，导致转化率降低。

避免过早提出不当请求 为用户提供小贴士引导的时候，尽量给出符合上下文提示且有明显好处的，或者告知用户当前操作不当可能会导致哪些不好的后果

6、新用户引导时间越短越好 绝大多数的 设计师 可能都都没意识到这个问题。

其实这个设计背后的逻辑很简单，就是「成本收益」原则 —— 只有当收益等于或者大于成本的时候，用户才会跟进或者进行活动。

流媒体音乐 APP 的新用户引导流程通常是 5-10 步，银行金融相关的则 20到25步不等（因为许多金融服务平台有严格的监管和合规的要求）。所以，在设计的时候建议：

在允许的范畴内，尽量让你的新用户引导流程比竞品更短，让用户尽可能少点几次进入正式界面 而具有独特优势和功能的产品，可能会因为缺少竞品或者后续大量奖励，需要更苛刻的注册和引导流程 每个问题和引导功能需要有充分的理由

7、增量引导流程 新用户引导可以被切分为若干个不同阶段，这样用户可以先访问产品特定功能的引导，而其他的引导流程，则在用户触发的时候再进行，这种设计是提升用户引导流程有效度的好办法。这种增量引导方式有很多好处：

减少用户的认知负荷，让用户分阶段地完成任务并获得奖励回馈 确保用户可以分阶段完成任务，并且每次都能获得和当前状况相匹配的引导信息

比如 Wise 的客户端就使用增量引导流程，仅在用户需要的时候提供引导，快速注册之后，用户就能进入程序，访问页面，仅在用户需要开通帐号和服务的时候，再次提供针对性的引导。

8、保持透明，呈现进度 好的设计理应在对的时机给予对应的反馈，始终让用户了解正在发生的事情——可用性启发式：系统状态可见性

对于新用户引导流程，如果缺乏明确的目标，用户不知道什么时候会结束，则可能会产生强烈的焦虑感和失控感。在下面的案例当中，我们可以看到没有进度条指示和有明显进度条指示的差异，有着更清晰进度指示的 Moka 比 Revolut 更加透明和友好。

对于较长引导流程，可视化的进度条和进度指示器能够更好帮助用户了解当前状态。 努力设计好文案贴合用户期望，并且鼓励用户

9、了解阻碍用户的关键点 在 APP 中很多任务可能会让用户感到压力，如果这些任务是必须执行的，那么需要通过特殊的设计来缓解压力和阻碍。以下是阻碍用户抵触引导的主要原因：

潜在的安全和隐私的问题 超长的表单和漫长的流程 过于激进的广告和付费要求 在用户从应用中获得正反馈之前就敦促用户付费 缺乏逻辑和意料之外的问题 强制要求创建帐号 强制用户做出决定 缺乏本土化的设计

10、了解用户并优化用户体验 用户初次使用产品的 用户体验 ，是一个很好的契机，可以更加深入的了解的用户的偏好和目标，并且借此调整产品的体验。通过询问用户喜欢哪些艺术家，YouTube Music 可以为新用户创建一个独特的、负荷偏好的独特播放列表。

尽快了解用户的偏好，对于提升内容服务和用户粘度至关重要。

Duolingo 在新用户引导阶段，会先了解用户的学习目标，以及当前对于语言的掌握程度，在此基础上创建独特的学习路径。而 Duolingo 也证明了一件事情，就是用户自己设置的目标比系统设定的目标，有更高的达成率。

11、全力强化品牌气质 第一次和用户相遇，是展现独特品牌气质的好时机，你可以借助更好的品牌设计，让用户感知到品牌的独特之处。良好的品牌设计，结合游戏化设计和友好的吉祥物，能够帮助用户和产品产生情感连接。

HeadSpace 就是一个典型的案例，和很多其他的 APP 不同，HeadSpace 并没有急于让用户注册，而是以一组可爱的动画开始，引导用户「吸气」和「呼气」，简单而可爱的互动引导着用户，给用户留下独特的第一印象。

12、完善空状态 在引导用户进入应用之后，有的应用可以直接使用，而有的应用则可能因为缺少内容而显得无趣。所以，针对空状态的设计是非常有必要的，借助设计让空状态勾勒出用户路径，结合新用户引导，让用户快速适应产品的功能。Mailchimp 就是这么做的，它借助一个简单的新用户任务清单，引导用户完成一个又一个任务。

编者按：这篇文章出自资深 B 端 UI/UX 设计师 Taras Bakusevych ，他对于产品、视觉、体验设计上，都有深入的钻研，而这些钻研是实实在在的项目喂出来的实战经验。他之前的每篇文章都值得一读这10个设计原则，是确保金融类产品体验优秀的核心要义财务和金融相关的应用是一个相对专业的分支，在这个领域当中...

编者按： 这篇文章出自资深 B 端 UI/UX 设计师 Taras Bakusevych ，他对于产品、视觉、体验设计上，都有深入的钻研，而这些钻研是实实在在的项目喂出来的实战经验。他之前的每篇文章都值得一读

这10个设计原则，是确保金融类产品体验优秀的核心要义 财务和金融相关的应用是一个相对专业的分支，在这个领域当中创造体验优异的设计并不是一件简单的事情。

阅读文章 >

在资深设计师眼中，这 10 个设计原则更值得学习和了解 编者按：在做设计的时候，设计师到底要遵循哪些设计原则？

阅读文章 >

以下是今天的正文：

出色的新用户引导，能够缩短用户了解产品价值的路径，能够帮助用户迅速抵达令人惊艳的细节，获得成就感，完成任务，和产品产生情感连接。

1、第一印象至关重要 新用户引导通常是产品当中用户历程的起点，用户和产品的初次交互将会塑造产品对于用户的第一印象，如果做的足够好，则能够带来较强的用户忠诚度，将用户变成长期客户和产品拥护者。

在整个用户产品周期当中，新用户引导是起点，然后是用户使用和用户留存的阶段。

新用户引导阶段：初次使用产品，成为产品的用户。 产品使用阶段：用户能够熟练使用产品和功能，能够实现预期目标，获得预期收益。 用户留存阶段：用户不断提升参与度，开始使用产品所提供的更多功能，成为专家级用户和产品的拥簇。

2、新用户引导并不是简单的产品介绍 新用户引导时常和产品介绍界面混淆，很多产品在新用户引导界面介绍产品的功能和优势。

那么，在你设计新用户引导界面的时候，需要问问自己这几个问题：

这些界面是帮助用户获得他们想要的东西，还是在他们前进道路上带来不便的？ 我们的界面是在介绍显而易见的事情吗？ 这些信息在此时此刻是否可操作？是否有用？

要让用户在打开界面第一屏的时候就可以交互和使用。产品优势介绍应该是在 App Store 或者 Google Play 的 APP 预览页上展示的，那是用户试图了解产品的地方，也是更加合理的地方。

3、最好的新用户引导是沉浸式的 很多产品功能其实很简单，并不一定真的需要开头单独设置引导页。新用户引导是否需要，取决于多个因素：

用户的目标和需求 业务需求、行业标准、法规要求 产品所需要的经验和熟练程度 产品的熟悉度和开创性程度 有很多产品是简单到开箱即用的，而还有一些产品则需要经过漫长的引导培训，用户才能正常使用、达成目标，以避免出现错误付出高昂的代价。

4、新用户引导流程可以由多个元素组成 像注册、订阅服务、功能推荐、定制服务等，都可以应用到新用户引导当中。新用户引导的重要性，和你产品的收入模式有很大的关联。比如付费订阅类的产品，新用户初次上手的体验之后产生的评估，将会极大地影响后续的订阅付费意愿。关于这一点，NNGroup 有过非常专业的分析： https://www.nngroup.com/articles/mobile-app-onboarding/

5、介绍、小贴士和操作提示 APP 内的教程和介绍，主要是教育用户使用某些功能，并且引导用户在 APP 内抵达特定的页面和功能。而这种引导的呈现形式也不尽相同，比如卡片式说明、全自动产品导览、视频教程以及工具提示。

好的 产品设计 应该是不言自明的，所以设计的核心目标是设计清晰、独立不言自明的界面，而不是指令式的引导。

避免设计冗长的指令引导和教程 提供简短清晰的、和上下文环境高度相关、可操作的引导指令，并且用户可以禁用这些引导指令。

操作提示——关于特定操作、交互的请求或者建议，比如引导用户给 APP 评分，与朋友分享，或者启用消息推送。这些操作提示如果放置在新用户引导阶段，实在是太早了，很容易让用户感到抵触，导致转化率降低。

避免过早提出不当请求 为用户提供小贴士引导的时候，尽量给出符合上下文提示且有明显好处的，或者告知用户当前操作不当可能会导致哪些不好的后果

6、新用户引导时间越短越好 绝大多数的 设计师 可能都都没意识到这个问题。

其实这个设计背后的逻辑很简单，就是「成本收益」原则 —— 只有当收益等于或者大于成本的时候，用户才会跟进或者进行活动。

流媒体音乐 APP 的新用户引导流程通常是 5-10 步，银行金融相关的则 20到25步不等（因为许多金融服务平台有严格的监管和合规的要求）。所以，在设计的时候建议：

在允许的范畴内，尽量让你的新用户引导流程比竞品更短，让用户尽可能少点几次进入正式界面 而具有独特优势和功能的产品，可能会因为缺少竞品或者后续大量奖励，需要更苛刻的注册和引导流程 每个问题和引导功能需要有充分的理由

7、增量引导流程 新用户引导可以被切分为若干个不同阶段，这样用户可以先访问产品特定功能的引导，而其他的引导流程，则在用户触发的时候再进行，这种设计是提升用户引导流程有效度的好办法。这种增量引导方式有很多好处：

减少用户的认知负荷，让用户分阶段地完成任务并获得奖励回馈 确保用户可以分阶段完成任务，并且每次都能获得和当前状况相匹配的引导信息

比如 Wise 的客户端就使用增量引导流程，仅在用户需要的时候提供引导，快速注册之后，用户就能进入程序，访问页面，仅在用户需要开通帐号和服务的时候，再次提供针对性的引导。

8、保持透明，呈现进度 好的设计理应在对的时机给予对应的反馈，始终让用户了解正在发生的事情——可用性启发式：系统状态可见性

对于新用户引导流程，如果缺乏明确的目标，用户不知道什么时候会结束，则可能会产生强烈的焦虑感和失控感。在下面的案例当中，我们可以看到没有进度条指示和有明显进度条指示的差异，有着更清晰进度指示的 Moka 比 Revolut 更加透明和友好。

对于较长引导流程，可视化的进度条和进度指示器能够更好帮助用户了解当前状态。 努力设计好文案贴合用户期望，并且鼓励用户

9、了解阻碍用户的关键点 在 APP 中很多任务可能会让用户感到压力，如果这些任务是必须执行的，那么需要通过特殊的设计来缓解压力和阻碍。以下是阻碍用户抵触引导的主要原因：

潜在的安全和隐私的问题 超长的表单和漫长的流程 过于激进的广告和付费要求 在用户从应用中获得正反馈之前就敦促用户付费 缺乏逻辑和意料之外的问题 强制要求创建帐号 强制用户做出决定 缺乏本土化的设计

10、了解用户并优化用户体验 用户初次使用产品的 用户体验 ，是一个很好的契机，可以更加深入的了解的用户的偏好和目标，并且借此调整产品的体验。通过询问用户喜欢哪些艺术家，YouTube Music 可以为新用户创建一个独特的、负荷偏好的独特播放列表。

尽快了解用户的偏好，对于提升内容服务和用户粘度至关重要。

Duolingo 在新用户引导阶段，会先了解用户的学习目标，以及当前对于语言的掌握程度，在此基础上创建独特的学习路径。而 Duolingo 也证明了一件事情，就是用户自己设置的目标比系统设定的目标，有更高的达成率。

11、全力强化品牌气质 第一次和用户相遇，是展现独特品牌气质的好时机，你可以借助更好的品牌设计，让用户感知到品牌的独特之处。良好的品牌设计，结合游戏化设计和友好的吉祥物，能够帮助用户和产品产生情感连接。

HeadSpace 就是一个典型的案例，和很多其他的 APP 不同，HeadSpace 并没有急于让用户注册，而是以一组可爱的动画开始，引导用户「吸气」和「呼气」，简单而可爱的互动引导着用户，给用户留下独特的第一印象。

12、完善空状态 在引导用户进入应用之后，有的应用可以直接使用，而有的应用则可能因为缺少内容而显得无趣。所以，针对空状态的设计是非常有必要的，借助设计让空状态勾勒出用户路径，结合新用户引导，让用户快速适应产品的功能。Mailchimp 就是这么做的，它借助一个简单的新用户任务清单，引导用户完成一个又一个任务。

很多年前，当我还是一名计算机专业的大四学生时，整天上网浏览各类招聘信息，想找到一个合适的程序员实习岗位。除了实习岗位外，我偶尔也会点进一些“高级工程师”的招聘帖里。现在回想起那些帖子，抛开让人眼花缭乱的技术名词，我印象最深的就是常出现在第一行的岗位年限要求：“本职位要求 工作经验 5 年以上”。

很多年前，当我还是一名计算机专业的大四学生时，整天上网浏览各类招聘信息，想找到一个合适的程序员实习岗位。

除了实习岗位外，我偶尔也会点进一些“高级工程师”的招聘帖里。现在回想起那些帖子，抛开让人眼花缭乱的技术名词，我印象最深的就是常出现在第一行的岗位年限要求：“本职位要求 工作经验 5 年以上”。

作为一只一天班都没上过的小菜鸟，这些年限要求在我眼里简直长到夸张。不过，望洋兴叹之余，我有时也会在心中暗暗憧憬一下：“五年工作经验的程序员，那该多厉害啊？写代码对于他们来说，是不是像吃饭一样简单？”

时光荏苒，一晃十几年过去了。如今回头一望，自己也成了一名有着 14 年工作经验的光荣打工人。在软件开发行业摸爬滚打这些年后，我发现很多事情，与我在大四时所想象的大不相同，比方说：

随着经验增长，编程并不会变简单太多，“像吃饭一样简单”只出现在梦里 给许多“大项目”写代码不光没意思，还很危险，远不如在 LeetCode 上做一道算法题有趣 只从技术角度思考问题，成不了好程序员，有些东西远比技术更重要 细想起来，这类关于编程的感触还有许多。我整理了其中 8 条，写成了这篇文章。如果其中某些观点引起了你的共鸣，我会非常高兴。

更多 编程 干货：

学编程后，我做了这10个有毒的在线免费设计神器！（下） 上篇的5个神器大受欢迎，人气极高。

阅读文章 >

一、写代码很简单，但写好代码很难 编程曾经是一项门槛很高的专业技能。从前，一个普通人想学编程，最常见的做法就是通过教材和书本学习。不过大部分编程专业书，十分艰深晦涩，对于初学者来说很不友好。因此不少人在尝到编程的乐趣前，就早早地半途而废。

但如今，学编程正在变得越来越容易。学习不再像以前那样，只能硬啃书本，而是多了许多新途径。观看教学视频、参加 Codecademy[1] 的交互式课程，甚至直接在 CodeCombat[2] 通过玩游戏来学编程，每个人都能找到适合自己的学习方式。

“妈，我真没在玩游戏，我在学编程呢！你看屏幕右边！”

此外，编程语言也在变得越来越易用。经典的 C 和 Java 不再是大多数初学者的首选，许多更简单、更易上手的动态类型语言如今大受欢迎，与之相关的 IDE 等工具也变得越来越完善。这些因素进一步降低了编程的学习门槛。

总而言之，编程早已褪去了它的神秘面纱，从只有少数人才能掌握的神秘技能，变成了一门人人皆可学习的普通手艺。

但更低的学习门槛，更友好的编程语言，并不意味着人人都能写出一手好代码。如果你已经工作，参与过一些项目，那我很想问你一个问题：”你日常接触的这些项目的代码质量如何？是好代码多，还是烂代码多？”

不知你会怎么回答，我先来说说我的答案。

1. 好代码还是很少

2010 年，我跳槽到了一家总部位于北京五道口的大型互联网公司。

加入这家公司前，我只在十人规模的小公司待过，因此，我对新公司在各方面都有着很高的期待，尤其是软件质量方面。当时，我心里想的大概是这样：“这可是支撑了有着千万用户量的产品的大项目，代码质量跟之前那些比，肯定有质的飞跃吧！”

等到在新公司工作了一周后，我才发现自己实在是错得离谱。所谓“大”项目的代码质量同我的预期相去甚远。打开 IDE，数百行的函数和神秘的数字字面量比比皆是，开发任何一个小需求都难如登天。

后来，在待过更多公司，接触了更多软件项目后，我总结出一个道理：不论公司多大、项目多牛，在实际工作中遇见好代码，仍然是小概率事件。

2. 好代码有哪些要素？

话说回来，到底怎样的代码才算是好代码？在这方面，Martin Fowler 有一句话常被大家引用：

“Any fool can write code that a computer can understand. Good programmers write code that humans can understand.”

“任何傻瓜都能写出计算机能理解的代码。优秀程序员写人类能理解的代码。”

我认为它可以作为评价好代码的原点：好代码一定是可读、易读，且容易理解的。写出好代码的第一原则，就是把人类读者放在第一位。

除了可读性以外，评价代码好坏还有许多其他维度：

贴合编程语言：是否使用了当前编程语言的推荐写法？语言特性和语法糖，使用程度是否恰到好处？ 易于修改：代码设计是否考虑了未来的需求变更，当变化发生时，代码是否容易随之修改？ API 设计合理：API 设计是否合理，易于使用？好的 API 在简单场景下使用方便，在高级场景下又可以随需求扩展。 性能够用：代码性能是否满足当前业务需求，同时为未来保留了一定提升空间？ 避免过度设计：代码是否存在过度设计、过早优化的毛病？ … 总而言之，对于任何层级的程序员来说，好代码都不是什么唾手可得的东西。要写出好代码，需要在许多维度上反复权衡、精心设计，最后再加以持续打磨。

既然如此，假如想尽快掌握写代码这门手艺，有捷径吗？

3. 写好代码的捷径

在许多层面上，我认为编程和写作非常相似[3]。二者都是使用文本和符号来表达思想，只是方式略有不同。

谈到写作，我想问一个关于作家的问题：“你听说过不读书的作家吗？你有没有听到过某位作家说，他从来不读其他人的作品，只读自己的东西？”。我猜答案应该是否定的吧。

如果你去查阅相关资料，你会发现许多职业作家的日常生活，就是阅读和写作两件事在不断循环。他们每天会花大量时间阅读各类文字，然后再写作。

同样是“文字工作者”，程序员们就很少重视阅读。但要想快速提升编程能力，阅读正是不可或缺的重要一环。除了日常工作接触到的项目以外，我们应该更多地阅读那些经典软件项目，从中学习 API 设计、模块架构和代码编写的技巧。

不光代码和技术文档，最好再定期读一些计算机方面的专业书，保持阅读书籍的习惯。在这方面，我认为 Jeff Atwood 在 15 年前写的文章 "Programmers Don't Read Books -- But You Should（都说程序员不读书——但你应该读）"[4]，如今读来仍不过时。

提升编程能力的捷径，就藏在“阅读 <-> 编程”这个无尽循环里。

“一个好的程序员应该做什么？”

二、编程的精髓是“创造” 在程序员的日常工作中，有很多事情会让人充满成就感，甚至情不自禁地感叹“编程真美好”。比方说，修复了一个极难定位的 Bug，用新算法将代码性能提升了一倍，等等。但在所有的这类事情当中，没有任何一件，能和“亲手创造出一件东西”相比。

当你在编程时，创造新事物的机会实际上随处可见。因为并非只有发布一个新软件，才称得上是“创造”。写一个可复用的工具函数、设计一套清晰的数据模型，全都可以归入“创造”的范畴。

身为程序员，保持对“创造”的热情至关重要。因为它可以帮我们：

更高效地学习：学习一门新技术，最高效的方式就是用它开发一个真实项目，在创造的过程中学习，效果最好。 有机会邂逅了不起的东西： 许多改变世界的开源软件，最初都是作者纯粹出于兴趣所创造，比如 Linus Torvalds 和 Linux，Guido van Rossum 和 Python。

1989 年的圣诞假期，荷兰人 Guido van Rossum 敲下了 Python 语言的最初几行代码，Python 最初仅被期望作为 ABC 语言的继承者，但后来“吞噬”了全世界

虽然“创造”好处多多，程序员们也有大把机会去做，但许多人常常缺少一种身为“创造者”的觉悟。就像那个广为流传的小故事所说：一位哲学家询问正在砌砖的工人，有人清楚地知道自己是在建造一座大教堂，有人却认为自己只是在砌砖。很多程序员正是“只见砖块，不见教堂”。

将自己定位成创造者后，看待事物的方式就会发生天翻地覆的变化。举个例子，同样是给 API 增加报错提示文字，创造者们就能跳出“快速完成需求就好”的思维陷阱，向前一步，追问自己一些更重要的问题：“我想为用户创造什么样的产品体验？怎样的报错文字，更能帮助我达成该目标？”

就像任何一个有用的编程模式一样，“创造者思维”也能成为你的职业生涯的一道巨大推进力。因此，现在就试着问自己一个问题吧——“我的下一份创造会是什么？”

三、打造高效试错的环境至关重要 我曾参与开发过一个互联网产品，它设计精美，功能丰富，每天都有大量用户使用。

但就是这么一个从市场角度看颇为成功的产品，工程质量却非常糟糕。如果你打开它的后端项目，把所有目录翻个底朝天，都找不到任何一行单元测试代码，其他自动化测试流程也是无从谈起。而业务逻辑偏偏又十分复杂，最后，项目代码间的意料耦合多如牛毛，开发一个新特性，很容易把旧功能给搞挂。

“在忙啥呢？” “试着修复我之前修一个问题时搞出来的问题，那问题是我之前解决另一个问题搞出来的，而那个问题又是我……”

因此，项目每次发布时，开发和产品同学全都得严阵以待，氛围十分紧张。整个发布过程也很刺激，紧急回滚时有发生。一个人在这样的环境中工作，技术成长抛开不谈，心理素质肯定能得到极大锻炼。

编程原本是一件充满乐趣的工作，但为这样的项目编程，乐趣根本无从谈起。究竟是什么夺走了编程的乐趣？

1. 理想的编程体验≈“刷题”

LeetCode[5] 是一个著名的编程学习网站，上面提供了许多覆盖各个难度的编程题，大部分与算法相关。用户可以选择自己感兴趣的题目，直接在浏览器上编写代码（支持十几种编程语言）并执行。如果通过了全部的测试用例，则算作解答成功。

在 LeetCode 上做题

在 LeetCode 刷题很像在玩游戏，富有挑战性，同时也很有趣。整个做题过程，实际完美展现了一种理想化的编程体验：

关注点分离：每道题目都是一个独立个体，同一时间内，开发者可以完全沉浸在一道题目中； 快速获得精准反馈：开发者每次调整代码后，能通过自动化测试快速获得结果反馈； 零成本试错：写出的代码语法有错误、逻辑有问题，没有任何不良后果，心理负担小。 不过，屏幕前的你很可能觉得我在说些废话。

“不然呢？解算法题、写小脚本，不就是这样的体验吗？有啥特别值得说的？”你很可能会继续补充道，“你知道我们公司的项目有多复杂吗？规模超大，模块巨多，你懂我意思吗？每天服务 ××× 万人，光数据库就好几套，消息队列都有三种，开发起来当然要麻烦一点咯！”

确实，全世界的软件千差万别，开发起来不可能都像在 LeetCode 上刷题一样轻松愉快。但这并不意味着，我们不应该努力改善自己身处的编程环境，哪怕只有一点点。

要通过改善环境来提升编程体验，可用的理念和工具包括：

模块化思想：妥善设计项目中的每一个模块，降低耦合，提升正交性 设计原则：微观层面上，应用那些经典的设计原则和模式，比如“SOLID”原则 自动化测试：编写规范的单元测试，必要时使用 Mock 技术，用自动化测试覆盖业务关键路径 缩短反馈回路：切换编译速度更快的工具，优化单测性能，竭尽全力缩短从“改完代码”到“获得反馈”的等待时间 微服务架构：必要时，将大单体拆分为多个职责各异的微服务，分散复杂度 …… 关注编程环境，刻意创造出允许高效试错的“代码乐园”，让工作像刷题一样轻松愉快。是经验丰富的程序员能为自身团队做出的最好贡献之一。

四、避开代码完美主义陷阱 在代码质量上精益求精是好事，但也要注意别掉进完美主义的陷阱。因为编程不是艺术创作，不鼓励人们无限度地追求极致。作家大可花上数年打磨一本传世之作，但程序员在代码上钻牛角尖就很有问题。

世间没有完美的代码。大多数时候，你的代码只要能满足当前需求，又为未来扩展留了一些空间就够了。有那么几次，我在简历上看到候选人给自己打着“代码强迫症”标签。隔着屏幕，我虽能感受到 TA 对代码质量的那份重视，但在我心底，其实更期望 TA 早已将完美主义陷阱远远甩在了后头。

五、技术很重要，但“人”也许更重要 在软件开发领域，“单一职责原则”（全称为 Single responsibility principle，后简称为 SRP）是一条非常著名的设计原则。它的定义很简单，一句话就可以概括：“每个软件模块应该只有一个被修改的理由”。

单一职责原则：能做到，并不意味着你就该这么做

要掌握 SRP 原则，关键在于搞清楚“被修改的理由”为何物。很显然，程序是没有生命的，它自身不能也不需要主动去改变。任何修改程序的理由，都来自与之相关的人，人是导致修改的“罪魁祸首”。

举个简单的例子。看看下面这两个类，其中哪一个违反了 SRP 原则？

一个字典数据类，支持两类操作：存数据、取数据； 一个员工资料类，支持两类操作：更新个人信息、渲染一张用户资料卡片图。 在大多数人眼里，第一个例子没问题，但第二个例子却明显违反了 SRP 原则。要得出该结论，好像无需任何严格的分析和证明，运用一丁点直觉即可。但假如做一些正经分析，第二个例子的可疑之处，在于能为其轻松找出两个不同的修改理由：

管理员认为资料中的“个人电话”字段不能有非法号码，需增加简单的校验逻辑 某员工认为资料卡片图上的“名字”部分太小，希望加大字体 ”It is people who request changes. And you don’t want to confuse those people, or yourself, by mixing together the code that many different people care about for different reasons.” ——“The Single Responsibility Principle”

“是人在要求软件变更。你绝不想把那些不同人出于不同原因所关心的代码混在一起，这样只会把他们和你自己搞糊涂。”——“单一职责原则”

理解 SRP 原则的关键，在于先理解人以及人在软件开发中所扮演的角色。

再举一个例子。微服务架构是近些年很火的一个技术话题。但许多人在讨论它时，往往只关注技术本身，却忽视了微服务架构与人之间的关系。

将微服务架构风格与其他东西区分开的关键，在于将大单体拆分为独立的微服务后，不同模块间的边界可以变得更清晰。跟数百人的团队一同维护着一个大单体比起来，许多小组织各自维护着独立的微服务，明显拥有更高的运作效率。

如果缺少了特定的组织规模（也就是“人”）作为前提，空谈微服务的各种技术优势和那些花活，纯属本末倒置。

技术当然很重要。身为技术人员，那一张张瑰丽的架构图和独具匠心的代码细节，天然吸引着我们的注意力。但是，也请千万不要对软件开发里的另一个重要因素“人”视而不见。必要时，转换一下看事情的角度（从“技术”转向“人”），那样对你大有裨益。

六、求知若渴是好事，但也要注意方法 如今人人都在说“终身学习”，而程序员是一个尤其需要终身学习的职业。因为计算机技术的迭代更新非常快，某个三年前流行的框架或编程语言，很可能一个月前已经过时。

一分钟之内会发生什么事情？Netflix 观看时间增长 70,000 小时；Snapchat 上有三百万视频被观看；Google 新增两百四十万次搜索；一个 JS 新框架被发明（这条不是真的 ）

要在工作中表现得游刃有余，程序员们需要学习的东西非常多，涵盖各个层面。拿我比较熟悉的后端领域举例，一位合格的后端工程师至少需要掌握以下这些：

一种或多种后端编程语言 / MySQL 等关系数据库 / Redis 等常见存储组件 / 设计模式 / 用户体验 / 软件工程 / 编译原理 / 操作系统 / 网络基础 / 分布式系统 / …

虽然要学很多，但据我观察，大部分程序员其实都挺爱学习（至少不排斥），因此心态不是问题。不过有的时候，光有“求知若渴”的心态并不够，学习时，我们尤其需要关注“性价比”。

1. 关注学习性价比

下面这张图，展示了学习成效和投入之间的关系。

学习成效与投入关系图，横轴为学习投入，纵轴为学习成效

从图中可以看到，在学习的初级阶段，投入较少时，所获得成效增长飞快。但当成效超过某个阈值后，之后再想继续提升，所需要的学习投入就会呈指数级增长。

正因如此，我建议你在学习任何一项新事物时，先在脑海中想清楚一个问题：“我应该在上图中的哪个位置停下来？”，而不是闷头猛学。

知识的海洋浩瀚无边，有些东西需要我们成年累月的持续学习，不断精进。也有些东西，蜻蜓点水般学到一些皮毛已绰绰有余。准确判断并分配自己有限的学习精力，甚至比努力学习本身更重要。

2. 挑选合适的学习资料

有了学习目标后，下一步就是寻找合适的学习资料。在这方面，我想分享一次自己的失败经历。

有段时间，我突然对产品交互设计产生了浓厚的兴趣，认为自己应该在这方面有所精进。于是，我精心挑选了一本领域内非常经典的专业书：《About Face 4: 交互设计精髓》[6]，将其买回家中，满怀信心地认为自己的交互设计能力可以迅速获得提升。

但事与愿违，当我捧着那本经典著作时，发现自己连第一章都无法顺利读完——那句老话说的没错：“隔行如隔山”。

从这次失败中，我总结出了一点经验。那就是学习某项新东西时，我们最好挑选那些更易读，更适合“门外汉”的学习资料，不要“眼睛大，嘴巴小”，只知道奔着最经典、最权威的资料而去。

回顾之前的经历，我觉得以下几本书非常适合门外汉学习使用，性价比极高：

《写给大家看的设计书》[7]：设计相关 《点石成金》[8]：Web 用户体验相关 《鸟哥的 Linux 私房菜》[9]：Linux 系统相关 也许每个人的内心，都想成为一个博学的人，无所不知，无所不晓。但可供分配的时间的精力总是有限，我们不能，也不需要在所有领域都成为专家。

七、越早开始写单元测试越好 我非常非常喜欢单元测试，我认为写单测这件事，对我的编程生涯影响极大。夸张点说，如果以“开始写单元测试”作为分界线，把我的职业生涯分割成两段，后面那段远比前面那段精彩得多。

写单测的好处很多，比如单测可以驱动你改善代码的设计、可以作为代码的一种文档，等等。此外，完善的单元测试还是构建前面提到的“高效犯错的环境”的关键。

我已经写过几篇关于单测的文章，比如《有关单元测试的 5 个建议》[10]、《游戏“蔚蓝山”教我的编程道理》[11]。所以在这儿，我不打算再重复一遍。只说一句：如果到目前为止，你从未试过写单元测试，或从没重视过测试，我建议你从明天就开始写起来。

一般情况下我不测试我的代码，但假如测的话，我在生产环境测

八、程序员最大的敌人是什么？ 在大多数程序员段子里，产品经理经常作为反派角色出现。他们口中的项目需求总是变个不停，一天冒出一个新想法，搞得程序员苦不堪言。

客户每天都在不停修改需求，所以，我们决定在下次发布前，把这些需求“冻结”起来

在这些段子的烘托下，不断修改需求的产品经理，仿佛真成了程序员们最大的仇敌。似乎只要产品不乱改需求，大家的工作环境马上就会成为乌托邦。

虽然偶尔吐槽一两句产品经理很有意思，但我还是想一本正经的说一句：产品经理不是敌人。

因为从某种角度来说，软件生来就是准备被修改的（不然你猜，软件为什么叫“软”件？）。这样看来，开发软件和修建房子完全不同。因为没人会在建好一栋大楼后说：“让我们把它推倒重建一遍吧！一样的楼，但是用的钢筋和水泥比之前少 30%！”

所以，产品经理以及不稳定的需求不是程序员的敌人。并且，能否写出易于修改、适配变化的代码，是区分普通程序员和优秀程序员的重要标准之一。

那么，程序员们最大的敌人又是什么呢？

1. 复杂度是最大的敌人

就像《代码大全 2》中所说：软件开发的核心问题是管理复杂度。失控的复杂度就是程序员最大的敌人。

来看看那些导致项目复杂度不断增长的要素：

不断增加的新功能： 更多的功能等于更多的代码，更多的代码通常意味着更高的复杂度 对高可用的需求： 为了实现高可用，消息队列等额外的技术组件和代码被引入 对高性能的需求： 为了提升性能，缓存和相关模块代码被引入，部分模块被拆分后，换成高性能语言重写 一再被推迟的重构：因项目排期过于紧张，迫在眉睫的重构被一再推迟，技术债越积越多 忽视自动化测试： 没人写单元测试，也没人关心测试 … 终有一天，当项目的复杂度增长到一定程度后，空中会传来一声巨响。“咚！”，一个大家不愿改、不敢改的“大坑”凭空出现在了所有人的 IDE 中。

猜猜看，究竟是谁挖下了这个坑？

那些在降低复杂度上投入时间的团队，所负责的软件项目更容易成功

2. 减缓复杂度增长的过程

虽然复杂度总是会不可避免地持续增长，但有许多实践可以减缓该过程。如果每个人都能做到以下这些事，复杂度就有可能被长期控制在合理范围内：

精通当前编程语言与工具，写整洁的代码 使用合适的设计模式和编程模式 对重复代码零容忍，抽象库和框架 适当运用整洁架构、领域驱动设计思想 编写详尽的文档和注释 编写规范有效的单元测试 分离那些变动的与不变的 … 要求看上去很多，但总结起来，核心其实就是一句话：写更好的代码。

写在最后 2020 年，我在小组内做了一个分享，当时的 PPT 标题是《编程十年后的十个感触》。将资料分享在公司内网后，有位同事看到，评论说光看 PPT 不过瘾，希望我能将其扩展成一篇文章，我回复说没问题。如今 3 年过去了，我总算是兑现了自己的承诺。

当年准备分享材料时，我做完整个 PPT，最后一页实在不知道该放些啥。于是灵机一动，搞了个纯白色的背景，中间打了一行黑体大字：“十年很短，编程很难”。如今，第二个十年也已快行至中途，而这句话的后半部分好像对我仍然适用——长进不大，继续加油 。

欢迎关注作者微信公众号：「piglei」

第二次世界大战之后，美国经济获得更进一步发展，因为大战期间美国不但远离战场得以独善其身，还能卖武器发战争财。在此过程中进一步促进了自身的工业技术发展，在战后用于产品生产，因为综合实力强，美国战后主导了国际贸易，可以将各式各样的产品卖到世界诸国，形成良性循环。经济因此又进一步发展，其后的“国际主义风格”也是基于这样...

第二次世界大战之后，美国经济获得更进一步发展，因为大战期间美国不但远离战场得以独善其身，还能卖武器发战争财。

在此过程中进一步促进了自身的工业技术发展，在战后用于产品生产，因为综合实力强，美国战后主导了国际贸易，可以将各式各样的产品卖到世界诸国，形成良性循环。

经济因此又进一步发展，其后的“国际主义风格”也是基于这样的背景而产生。

堪称商业设计万金油的国际主义是如何发展至今的？ 国际主义（InternationalStyle）在当代是非常重要的风格，它属于商业设计中的“万金油”，放之四海而皆准，世界各国人民似乎都可以接受它，未必最好，但挺合适。

阅读文章 >

二战后的美国社会

除了产品风格方面的文化侵略，美国还有一些出色的市场运作模式被欧洲引用，比方 1932 年诞生，1950 年代被汽车行业广泛采用的“有计划的废止制度“。

主导人物是当时美国通用汽车集团总裁艾尔弗雷德·斯隆（Sloan，Alfred Pritchard Jr）。

艾尔弗雷德·斯隆

这种制度的“玩法”跟设计工作密切相关，以汽车为例，通过会预先设定好几年后将会更换的设计，一般一年一小变，三到五年一大变，通过不断的设计更新刺激消费者感觉自己的产品过时，继而产生新的购买行为。

通用汽车推出的产品

比方我们观察德国 BBA（奔驰、宝马、奥迪），基本也是遵循这样的时间周期升级产品设计。

更有甚者会在产品部件的使用性能上着手，比方五年内都用得挺好，但五年后空调不行了，音响坏了，底部有异响，顶棚脱落等。

宝马 3 系的历史演变

这些都是有意为之的设定，用意也是提醒消费者该换新的，因为维修费用并不低，这一套玩法基本成为世界通用的产品设计潜规则。

一、战后的世界设计格局 二战之后的欧洲陷入一片狼藉，比方英国在 1950 年初还在实行生活用品的配给制，而意大利那边连基本生活都难以保障，德国则被分裂为两个国家—民主德国与联邦德国。

随后因为全球资本主义国家阵营与社会主义国家阵营拉开冷战的关系，美国在 1947 年推行著名的“马歇尔计划“，从经济角度给西方盟国及日本提供一些援助。

马歇尔计划挽救了欧洲经济

因为这个利好政策，大致 1950 年代中期西方各国慢慢度过难关，进入了所谓的“丰裕社会“（Affluent Society）阶段。

这个阶段我们可以简单理解为“物质生活极为丰富”，此时大部分西方国家都意识到设计对经济发展的重要促进作用。

丰裕社会中的平民大众

比方英国其实在二战还没结束的时候就成立了“工业设计协会”，目的是希望通过各种可行方式提升英国工业设计水平，从而促进国际贸易发展，后来这个组织“进化”为“英国设计协会”。

丰裕社会中的精英阶层

协会的主要举措就是面向社会举办各种展览与比赛，大力奖励与资助商业的优秀设计。

比方二战刚刚结束，英国就在 1946 年举办一个叫“英国能做到”（The Britiain Can Make It）的展览以示决心，没想到足足吸引到国内 120 万观众，所以英国的举措也被欧洲各国借鉴与学习。

“英国能做到”设计展

对现代设计的发展态度方面美国显得非常个性化，两次大战之间美国设计在世界上异军突起，原因前面已经谈过，美国政府习惯将设计看作一种完全市场化的行为。

因此并不会从国家层面作出任何干预，他们做对了两件极为关键的事情，其一就是有严格的知识版权保护法规，其二是严格控制市场垄断行为。

美国当时的服装设计

这样一来给设计行业带来非常公平安全的发展环境，促进设计行业的良性发展。

二战后的美国虽然设计水平会跟随经济市场波动而波动， 但无论汽车、家庭用品，电器及办公用品等设计都位居当时全球最高水平。

美国 1940 年代的汽车设计

他们的产品风格与作业方式成为西方国家广泛学习的典范，这些影响辐射到了日本地区与东南亚。

美国文化与产品也大量输出世界各国，比如好莱坞电影、流行歌曲，可口可乐、口香糖、美国香烟与家用电器等，甚至美国杂志《生活》（life）与《时代》（Time）也风行全球。

美国《生活》杂志

因此日后称作“国际主义”的设计风格其实甚至可以狭隘的定义为“美国风格”，是一种基于现代主义形式而产生的商业风格。

这种风格是由商业市场与消费者主导，同时包含美国式的大众通俗文化。

美国随后产生了著名的战后“婴儿潮”，大约有三分之一的人口在 1950 年末出生，随着这批婴儿成长，慢慢成为主要消费阶层。

美国 1950 年代的婴儿潮

这个阶层从小就受美国式大众通俗文化的消费观念影响，教育水平更高，知识结构更完整，消费能力更强，审美更加多元化，为了适应他们的需求美国产品的设计样式也在不断发展与更新。

除了婴儿潮，战后还有一个“设计的富裕市场”产生于 1950 年代末期的“女权运动” 浪潮。

美国女权运动

这个运动在美国首先发起，然后波及西方各国，原因是第二次世界大战期间大部分男性参战，所以工厂与事业单位的工作只能由女性担任，这种情况在战后继续发展，彻底改变女性的社会地位。

更独立与开放的女性

女性不但可以经济独立，也可以是消费主力军，她们对服装、化妆品、个人护理产品等产生大量需求，这些需求都需要设计行业进行快速的响应。

二、世纪中叶的设计浪潮 到了 20 世纪中叶，设计行业在西方已经变得成熟，在企业及品牌运作当中其地位也进一步获得重视。

比方前面我们谈包豪斯篇章时提及的乌尔姆学院就活跃于这个时期，其对设计的教学研究及商业运用已趋向科学性。

看故事学设计！包豪斯是如何在美国德国发展起来的？ 1933 年包豪斯被纳粹政府正式关闭，但所谓“人在灯就在”，包豪斯培养出来的优秀学员并没有放弃对现代设计的探索。

阅读文章 >

乌尔姆学院的课堂

所以当设计在美国经历了职业化之后，也慢慢体系化与制度化。

比方在商业市场上，1960 年代-1970 年代“企业形象”（如今称作 CI，Corporate Identity）设计活动发展得迅速而广泛，企业也认同其对市场运作有良好作用。

随后更发展出“行为标志”（简称 BI，Behavior Identity）与“观念标志”（简称 MI，Mind Identity），这种体系直到如今仍旧是大部分设计服务公司的核心服务。

美国著名平面设计师保罗兰德

这类设计的雏形其实在 60 年前就出现，就是 1907 年时候德国设计师彼得贝伦斯为 AEG 电器设计的一系列品牌形象。

1907 年 AEG 电器的品牌形象设计

美国人将其完整规范化下来，这套做法直到 20 世纪 90 年代末才从日本传到中国，当时收费高昂，但其实真正能做好的设计师不多，能接受的客户也很少。

20 世纪 60 年代之后讨论“设计”的语境跟战前已经大为不同，设计专业变得越来越细分。

产品设计成为新兴的独立行业

设计师也不像第一代那样以“包打天下”的模式服务，公司可以业务形式多样，但主创设计师慢慢更加专注于一个领域。

比方工业设计在现代化进程中其专业性越发凸显，这个时期产品设计的美观、体验、功能、品位都被更综合的考虑起来，工业设计师需要懂的知识更多，比方工程学、消费心理学、品牌学等。

汽车设计的发展越来越完善

因此，诞生了一门新学问系统，这门学问跟产品设计密切相关，到了一种不得不考虑的程度，也就是—— 人体工程学 （Ergonomics）

三、人体工程学的诞生与发展 人体工程学其实并非一个全新学问，从定义上来说，这是一种：“研究人与人造产品之间协调关系的学问，通过研究人的行为，动机及反应，将其归纳为系统为产品设计过程提供依据，以求达到优化人与产品之间的互动关系，获得最佳表现”

所以有一些翻译也会译作” 人机工程学 “。

人机工程学测试

所以严格而言自从人类开始制造工具之后就产生这种人体工程学的考量了，比方尺寸大小，使用是否方便与安全等。

根据一些记载，古希腊时期的医生在设计手术工具及流程的时候就有这种人体工程的考虑，比方手术过程该站立还是坐下，如何布光更方便观察，手上工具的形状大小及重量该如何设计更适中，如何摆放更方便取用等等。

古希腊时期的医生

所以人体工程学只是因为工业化高速发展，产品与工具越来越多的情况下，才被更系统的研究，发展为一套完整学问。

发展过程有三个主要阶段：

1. 工业革命的成熟

前面说过，工业革命之后人类使用的工具越来越多，就产生了过去很多从未遇过的问题，于是需要更系统去考量彼此关系。

比方 1911 年时候美国一名管理学家在研究如何提升煤矿工人工作效率时候发现，假设将煤铲尺寸减小，同时提高铲煤频率居然可以让工人的效率提升三倍

工作中的煤矿工人

同样的实验还有将一些砌砖工人的工作方法进行改良，将其动作数量由 18 个减少到 4.5 个，居然将工人以往 1 小时砌砖的数量从 120 块提升到 350 块。

工作中的砌砖工人

所以第一个阶段的人体工程学主要集中在研究提升工业化生产效率问题。

2. 世界大战阶段

第一次到第二次世界大战期间是工体工程学获得长足进步与转变的阶段，因为战争过程中，如何让武器最大可能适应人的使用要求可以成为战争是否胜利的关键，需要就是发明之母完，因此参战各国都在努力往这方面研究。

战争期间美国的武器工场

比方当时一名美国陆军中尉通过调查发现，一些战斗机不同功能的操控按钮太相似，位置安排也不分类，极容易操作失误造成严重后果，所以开始进行针对性优化。

战斗机的机舱

比方将同类型操作的按钮分区组合，将一些重要操作位置加大，改变形态，通过手感也能区分，这些改进大大减少了战机失误，从而提升战斗力。

这个时候我们想一想，假设你日常需要驾车，就会恍然大悟为何一些按钮要放在特定位置，比方应急灯，为啥一些按钮的形状还有位置间距居然那么合理，你总是在需要的时候不用看也能按中，其实因为它们都融入了人体工程学的考虑。

人体工程学汽车内饰设计探索

3. 战后至今

二战之后人体工场学开始被独立出来专门研究，因此进入最高速的发展阶段，直到如今还在不断优化完善。

第一第二阶段的发展主要是针对拓展人的肌肉力量，而战后至今的研究就转而扩大到增强人的思维力量了，希望通过设计解放与拓展人的脑力劳动。

人体工程学的研究

人体工程研究首先在 1970 年代达到高潮，当时人体工程被认为是获得良好设计的唯一途径。

每当话说到这种份上就存在“神化”的嫌疑了，所以后来慢慢回归理性，至今而言，人体工程学主要研究区域集中在四个大类，分别是人的生理，人的心理，人与组织及人与环境，所以成为一个综合的专业学科。

人体工程学相关实验

希望做好设计的朋友们千万不要忽略这个学科的重用性，今天分享就到这里，感谢各位，我们下期再会。

欢迎关注作者的微信公众号「 设计史 太浓」：