大家新年好！ 提前给大家拜个早年！这是 2023 年 1月的第三波干货，对于依然忙于工作、或者寻找素材的同学而言，希望这一波干货能够给你提供帮助！

大家新年好！ 提前给大家拜个早年！这是 2023 年 1月的第三波干货，对于依然忙于工作、或者寻找素材的同学而言，希望这一波干货能够给你提供帮助！

这一次合集中，包含了2个基于人工智能的设计工具，一个是照片生成服务，另一个则是一件生成视频的工具，都相当实用；对于需要做平面设计和视觉设计的同学而言，基于情绪的渐变生成工具、开源 SVG 图标系统和 平面设计 素材大合集应该能在你日常工作中，帮你节省不少时间精力。

当然，在此之前记得看看往期干货中有没有你感兴趣的素材：

第二波！2023年1月精选实用设计干货合集 大家好，这是 2023 年第二期干货素材合集！

阅读文章 >

下面我们具体看看这一期的干货：

1、根据心情和情绪生成的渐变色 https://gradienmood.posandu.me/

色彩是拥有情绪的，但是有情绪的色彩有不一定仅仅只有一种颜色。这个名为 Gradien Mood 的渐变色网站会将不同感觉和渐变色搜集起来，其中有的渐变色甚至拥有极为复杂的情绪，而你需要做的，就是输入你想传递的情绪，然后就能搜到相关的情绪和色彩，包括渐变的 CSS 代码和具体的颜色代码，值得收藏哦。

2、250+ 超多平面设计素材合集 https://theveller.gumroad.com/l/GraphicDesignResources-byTheVeller/PHLAUNCH

这是给平面 设计师 的终极创意工具包，其中涵盖大量日常平面设计能用得上的素材，包括编辑能用得上的文案模板，图库素材和营销资料，提升展示性的样机和模板，常见的图案和渐变素材，以及深色系设计素材，目前处于限时免费的阶段，立刻下载就对了 ！

3、针对人物和情侣的 AI 绘图服务 https://aiphotos.ai/

生成式 AI 正在进行领域细分我是知道的，但是照片和图片生成服务里面居然还细分出针对人物肖像甚至情侣肖像生成的服务，是我没想到的事情。这个名为 AI Photos 服务就是这么顶，它需要获取你（们）的个人照片作为基础，越多越好，然后在此基础上为你生成150张各种风格各种题材的个人/情侣艺术照片。算算日子，距离情人节已经不足一个月了。

4、实用性超强的俄罗斯方块设计系统 https://new.tetrisly.com/

Tetrisly 设计系统是一个精心设计的 UI 库，他们的团队竭尽全力地让每个 UI 控件都是高度可用和易用的，避免存在垃圾组件，并且这些都可以直接输出 React 组件，让开发更加便捷。在设计上，他们创造了一套对比度合理、配色丰富易用的色彩系统，一套像素完美的图标合集，并且带有一套专门的 Figma 插件。

5、高质量开源 SVG 矢量图标素材库 https://www.svgrepo.com/

这套名为 SVG Repo 的素材库包含有超过 46 万个高素质矢量 SVG 矢量图标素材，这些图标的素质过硬，都是成套使用，基本无需修改就可以直接诶用在设计上，而具体的矢量素材文件也都是经过 SVG Repo 压缩优化过。SVG Repo 上的图标素材永远免费，且可以用于商业项目。

6、移动端照片光影优化工具 Relight https://www.pixerylabs.com/relight

如果你想在移动端上拥有堪比摄影工作室级别光影效果照片的话，那么使用 Relight 可能是最好的选择。它可以快速地为你的照片重新打光，而且在预设的光照强度、配色和效果的基础上，进行更加细致的调整，可以弥补很多其他的修图 APP 在这方面的缺陷。

7、基于 AI 的智能视频制作工具 https://boolvideoinvite.carrd.co/

人工智能在视频领域的运用也越来越多了，有从输入命令完成操作，到一键自动完成的工具，AI 的使用方法各不相同。这个名为 Boolv 的智能视频制作工具属于是那种最为简单的，你只需要提供基本的产品图以及产品链接之类的基础内容，他们的 AI 能够在此基础上自动搜集整理信息，并且自动生成漂亮且素质过硬的视频内容。感兴趣的同学可以试试看。

大家新年好！ 提前给大家拜个早年！这是 2023 年 1月的第三波干货，对于依然忙于工作、或者寻找素材的同学而言，希望这一波干货能够给你提供帮助！

大家新年好！ 提前给大家拜个早年！这是 2023 年 1月的第三波干货，对于依然忙于工作、或者寻找素材的同学而言，希望这一波干货能够给你提供帮助！

这一次合集中，包含了2个基于人工智能的设计工具，一个是照片生成服务，另一个则是一件生成视频的工具，都相当实用；对于需要做平面设计和视觉设计的同学而言，基于情绪的渐变生成工具、开源 SVG 图标系统和 平面设计 素材大合集应该能在你日常工作中，帮你节省不少时间精力。

当然，在此之前记得看看往期干货中有没有你感兴趣的素材：

第二波！2023年1月精选实用设计干货合集 大家好，这是 2023 年第二期干货素材合集！

阅读文章 >

下面我们具体看看这一期的干货：

1、根据心情和情绪生成的渐变色 https://gradienmood.posandu.me/

色彩是拥有情绪的，但是有情绪的色彩有不一定仅仅只有一种颜色。这个名为 Gradien Mood 的渐变色网站会将不同感觉和渐变色搜集起来，其中有的渐变色甚至拥有极为复杂的情绪，而你需要做的，就是输入你想传递的情绪，然后就能搜到相关的情绪和色彩，包括渐变的 CSS 代码和具体的颜色代码，值得收藏哦。

2、250+ 超多平面设计素材合集 https://theveller.gumroad.com/l/GraphicDesignResources-byTheVeller/PHLAUNCH

这是给平面 设计师 的终极创意工具包，其中涵盖大量日常平面设计能用得上的素材，包括编辑能用得上的文案模板，图库素材和营销资料，提升展示性的样机和模板，常见的图案和渐变素材，以及深色系设计素材，目前处于限时免费的阶段，立刻下载就对了 ！

3、针对人物和情侣的 AI 绘图服务 https://aiphotos.ai/

生成式 AI 正在进行领域细分我是知道的，但是照片和图片生成服务里面居然还细分出针对人物肖像甚至情侣肖像生成的服务，是我没想到的事情。这个名为 AI Photos 服务就是这么顶，它需要获取你（们）的个人照片作为基础，越多越好，然后在此基础上为你生成150张各种风格各种题材的个人/情侣艺术照片。算算日子，距离情人节已经不足一个月了。

4、实用性超强的俄罗斯方块设计系统 https://new.tetrisly.com/

Tetrisly 设计系统是一个精心设计的 UI 库，他们的团队竭尽全力地让每个 UI 控件都是高度可用和易用的，避免存在垃圾组件，并且这些都可以直接输出 React 组件，让开发更加便捷。在设计上，他们创造了一套对比度合理、配色丰富易用的色彩系统，一套像素完美的图标合集，并且带有一套专门的 Figma 插件。

5、高质量开源 SVG 矢量图标素材库 https://www.svgrepo.com/

这套名为 SVG Repo 的素材库包含有超过 46 万个高素质矢量 SVG 矢量图标素材，这些图标的素质过硬，都是成套使用，基本无需修改就可以直接诶用在设计上，而具体的矢量素材文件也都是经过 SVG Repo 压缩优化过。SVG Repo 上的图标素材永远免费，且可以用于商业项目。

6、移动端照片光影优化工具 Relight https://www.pixerylabs.com/relight

如果你想在移动端上拥有堪比摄影工作室级别光影效果照片的话，那么使用 Relight 可能是最好的选择。它可以快速地为你的照片重新打光，而且在预设的光照强度、配色和效果的基础上，进行更加细致的调整，可以弥补很多其他的修图 APP 在这方面的缺陷。

7、基于 AI 的智能视频制作工具 https://boolvideoinvite.carrd.co/

人工智能在视频领域的运用也越来越多了，有从输入命令完成操作，到一键自动完成的工具，AI 的使用方法各不相同。这个名为 Boolv 的智能视频制作工具属于是那种最为简单的，你只需要提供基本的产品图以及产品链接之类的基础内容，他们的 AI 能够在此基础上自动搜集整理信息，并且自动生成漂亮且素质过硬的视频内容。感兴趣的同学可以试试看。

大家好，我是插画师小光Sir~又是一年收红包的好时节，今年微信红包新增了异形红包封面样式，让封面设计有了更广的发挥空间。我也尝试了下，成功上架了3款异形红包。下面就以优设小鸡的兔年红包封面为例，详细地给大家介绍下今年的新规范和制作方法，也帮想做异形微信红包封面的萌新们避坑。

大家好，我是插画师小光Sir~

又是一年收红包的好时节，今年 微信红包 新增了异形红包封面样式，让封面设计有了更广的发挥空间。我也尝试了下，成功上架了3款异形红包。下面就以优设小鸡的兔年红包封面为例，详细地给大家介绍下今年的新规范和制作方法，也帮想做异形 微信红包封面 的萌新们避坑。

关于我：优设百万人气插画师，知名IP商业画师 ，擅长IP形象、潮流插画、分镜设计、爆款漫画，服务过国家体育局、中国体彩、人民日报等知名品牌，曾入选《插画师·宴》中国top100插画师。

想看我更多作品可以关注我的小红书@插画师小光sir，微博@插画师小光sir，约稿商务合作加微信：guangsir6666

往期回顾：

虎年“hú”利！资深插画师手把手教你100%成功上架微信表情包 农历虎年越来越近，家中挂起的条条腊肉，街边装饰的串串红灯笼，都让过年的氛围越来越浓，大家想放假的心情是不是也越来越迫不及待了呢？

阅读文章 >

一、新版红包封面制作教程 新版封面需要我们同时上传封面图、封面挂件及气泡挂件，其中封面图会同时展示在发红包页、红包消息气泡、拆红包页、红包详情页中，气泡挂件、封面挂件会分别展示在红包消息气泡和拆红包页上。

可以看出新版比旧版多了“封面挂件”和“气泡挂件”两个版块，也是异形红包的特殊所在。大家做之前一定注意先看下官方的规范标准，尤其需要注意图片的规格要求，不符合的话很容易就审核不通过。

点击查看官方的规范标准： https://cover.weixin.qq.com/cgi-bin/mmcover-bin/readtemplate （在左侧目录栏里定位“新版封面”）

虽然官方有提供新版红包封面的模板（下载入口在官网“新版封面”小标题旁），但是用PS打开后，发现没有标出官方规范中的明确尺寸数值，双击挂件也只是跳转到了矢量ai文件（吐槽下这次官方给的模板文件有些敷衍），因此下面会详细给大家介绍如何自己设置准确的画面尺寸。

“封面挂件”、 "封面图"和“气泡挂件”制作教程

① 先新建个1053*1746的画布大小，并按照规格要求做好辅助线：左右两边96px，上342px，下96px（参考线插件GuideGuide下载链接见文末）。

② 下载官方模板并打开，将其中的“红包封面”图层组（包含封面挂件、红包遮罩、封面图三个图层）拖进上一步新建的文件中，放大合适比例180%（这是我不断试错得出的大小比例），然后以这个为底版，在相似的范围内绘制设计我们自己的红包内容。我附上了自己创作优设小鸡的加速剪辑视频，同学们可以作为一个参考。

当视频无法加载时请刷新页面， 或前往PC获得最佳体验。

第③步：绘制好内容后，需要对画面按“挂件”和“封面图”做拆分。动图里显示的是自己画好的内容，包含多个图层，所有图层放在了一个组里。我们先用选框工具选中参考线围起来的中心区域，反选，然后为整个组添加一个蒙版，加上蒙版后的效果图保存为透明底图片，就是我们的「封面挂件」。

第④步：双击“封面图素材”智能对象跳转至新窗口，把优设小鸡画面组放进来，替换原有图层做剪切蒙版，Ctrl+S 保存，再回到源文件就可以看到新的“封面图”效果。这种过程需要不断微调保存对位，因为要确保“挂件”和“封面图”2个图层边缘能无缝吻合，不能出现错位。调整好之后，把“封面图”也导出一份图片。（我制作的这份“挂件”和“封面图”的模板文件我打包好放在文末了）

第⑤步：“气泡挂件”的制作过程和第①步相似。打开官方的模板里有“聊天气泡”文件组，双击“气泡挂件”智能对象进去就是标准尺寸，我们只需要做好参考线和调整小红包比例（也是180%）就OK啦。我同样也做好了一个模板，大家可以导入自己的文件再导出就是争取的尺寸了，下载链接见文末。

二、文件打包上传 做好全部素材后，就可以导出并上传查看预览效果了，注意挂件图可能需要压缩。上传证明文件时候如果没有登记版权，就准备好源文件，有条件的提前做一个创作过程的录屏，更容易通过哟！

三、个性化设计 具体的画面绘制及红包样式大家可以根据自己的喜好调整编辑。在这版优设小鸡兔年红包中，我为气泡红包做了一个特殊的背景，让背景图和气泡挂件完美融合一个整体。制作方法是只需要把做好的气泡背景图转为智能对象，并拖入我制作的气泡挂件的模板文件中即可，然后再微调对位并上传查看效果。

今天为大家演示了一个标准的新版封面文件准备流程，希望对想做异形红包的同学们有帮助，文内的提到的自制模板及插件下载链接在文末都有，有需要的小伙伴可以下载，比官方制作模板更加方便哦~

如果你也喜欢我的插画风格并想学习更多的插画知识，欢迎关注了解我的微博、小红书及优设大课堂课程，我会经常分享一些插画基础教程。

微博： @插画师小光sir 我的超人气手绘课程： https://xue.uisdc.com

（温馨提示：微信红包新版封面制作模板为@插画师小光sir制作分享，仅供个人学习使用；内含的“优设鸡兔年装扮”仅做教学参考，严禁商业用途的使用及出售。）

推荐阅读：

如何设计微信红包封面？从零开始教你定制微信红包封面 关于我：优设百万人气插画师 / 知名IP商业画师 / Wacom大赛评委 / 擅长IP形象、潮流插画、分镜设计、爆款漫画等。

阅读文章 >

优设专访数字艺术家Sixone：AI辅助创作的IP形象是如何登上春晚舞台的？ 大家好，这里适合你们聊设计的花生~ 春节将近，前不久 2023 年央视春晚公布了兔年的吉祥物“兔圆圆”，它是春晚 40 年历史上首个通过互联网大数据分析完成初始配方原创的总台春晚吉祥物 IP，形象乖巧可爱，一经发布就受到了很多网友的称赞和喜爱。

阅读文章 >

大家好，我是插画师小光Sir~又是一年收红包的好时节，今年微信红包新增了异形红包封面样式，让封面设计有了更广的发挥空间。我也尝试了下，成功上架了3款异形红包。下面就以优设小鸡的兔年红包封面为例，详细地给大家介绍下今年的新规范和制作方法，也帮想做异形微信红包封面的萌新们避坑。

大家好，我是插画师小光Sir~

又是一年收红包的好时节，今年 微信红包 新增了异形红包封面样式，让封面设计有了更广的发挥空间。我也尝试了下，成功上架了3款异形红包。下面就以优设小鸡的兔年红包封面为例，详细地给大家介绍下今年的新规范和制作方法，也帮想做异形 微信红包封面 的萌新们避坑。

关于我：优设百万人气插画师，知名IP商业画师 ，擅长IP形象、潮流插画、分镜设计、爆款漫画，服务过国家体育局、中国体彩、人民日报等知名品牌，曾入选《插画师·宴》中国top100插画师。

想看我更多作品可以关注我的小红书@插画师小光sir，微博@插画师小光sir，约稿商务合作加微信：guangsir6666

往期回顾：

虎年“hú”利！资深插画师手把手教你100%成功上架微信表情包 农历虎年越来越近，家中挂起的条条腊肉，街边装饰的串串红灯笼，都让过年的氛围越来越浓，大家想放假的心情是不是也越来越迫不及待了呢？

阅读文章 >

一、新版红包封面制作教程 新版封面需要我们同时上传封面图、封面挂件及气泡挂件，其中封面图会同时展示在发红包页、红包消息气泡、拆红包页、红包详情页中，气泡挂件、封面挂件会分别展示在红包消息气泡和拆红包页上。

可以看出新版比旧版多了“封面挂件”和“气泡挂件”两个版块，也是异形红包的特殊所在。大家做之前一定注意先看下官方的规范标准，尤其需要注意图片的规格要求，不符合的话很容易就审核不通过。

点击查看官方的规范标准： https://cover.weixin.qq.com/cgi-bin/mmcover-bin/readtemplate （在左侧目录栏里定位“新版封面”）

虽然官方有提供新版红包封面的模板（下载入口在官网“新版封面”小标题旁），但是用PS打开后，发现没有标出官方规范中的明确尺寸数值，双击挂件也只是跳转到了矢量ai文件（吐槽下这次官方给的模板文件有些敷衍），因此下面会详细给大家介绍如何自己设置准确的画面尺寸。

“封面挂件”、 "封面图"和“气泡挂件”制作教程

① 先新建个1053*1746的画布大小，并按照规格要求做好辅助线：左右两边96px，上342px，下96px（参考线插件GuideGuide下载链接见文末）。

② 下载官方模板并打开，将其中的“红包封面”图层组（包含封面挂件、红包遮罩、封面图三个图层）拖进上一步新建的文件中，放大合适比例180%（这是我不断试错得出的大小比例），然后以这个为底版，在相似的范围内绘制设计我们自己的红包内容。我附上了自己创作优设小鸡的加速剪辑视频，同学们可以作为一个参考。

当视频无法加载时请刷新页面， 或前往PC获得最佳体验。

第③步：绘制好内容后，需要对画面按“挂件”和“封面图”做拆分。动图里显示的是自己画好的内容，包含多个图层，所有图层放在了一个组里。我们先用选框工具选中参考线围起来的中心区域，反选，然后为整个组添加一个蒙版，加上蒙版后的效果图保存为透明底图片，就是我们的「封面挂件」。

第④步：双击“封面图素材”智能对象跳转至新窗口，把优设小鸡画面组放进来，替换原有图层做剪切蒙版，Ctrl+S 保存，再回到源文件就可以看到新的“封面图”效果。这种过程需要不断微调保存对位，因为要确保“挂件”和“封面图”2个图层边缘能无缝吻合，不能出现错位。调整好之后，把“封面图”也导出一份图片。（我制作的这份“挂件”和“封面图”的模板文件我打包好放在文末了）

第⑤步：“气泡挂件”的制作过程和第①步相似。打开官方的模板里有“聊天气泡”文件组，双击“气泡挂件”智能对象进去就是标准尺寸，我们只需要做好参考线和调整小红包比例（也是180%）就OK啦。我同样也做好了一个模板，大家可以导入自己的文件再导出就是争取的尺寸了，下载链接见文末。

二、文件打包上传 做好全部素材后，就可以导出并上传查看预览效果了，注意挂件图可能需要压缩。上传证明文件时候如果没有登记版权，就准备好源文件，有条件的提前做一个创作过程的录屏，更容易通过哟！

三、个性化设计 具体的画面绘制及红包样式大家可以根据自己的喜好调整编辑。在这版优设小鸡兔年红包中，我为气泡红包做了一个特殊的背景，让背景图和气泡挂件完美融合一个整体。制作方法是只需要把做好的气泡背景图转为智能对象，并拖入我制作的气泡挂件的模板文件中即可，然后再微调对位并上传查看效果。

今天为大家演示了一个标准的新版封面文件准备流程，希望对想做异形红包的同学们有帮助，文内的提到的自制模板及插件下载链接在文末都有，有需要的小伙伴可以下载，比官方制作模板更加方便哦~

如果你也喜欢我的插画风格并想学习更多的插画知识，欢迎关注了解我的微博、小红书及优设大课堂课程，我会经常分享一些插画基础教程。

微博： @插画师小光sir 我的超人气手绘课程： https://xue.uisdc.com

（温馨提示：微信红包新版封面制作模板为@插画师小光sir制作分享，仅供个人学习使用；内含的“优设鸡兔年装扮”仅做教学参考，严禁商业用途的使用及出售。）

推荐阅读：

如何设计微信红包封面？从零开始教你定制微信红包封面 关于我：优设百万人气插画师 / 知名IP商业画师 / Wacom大赛评委 / 擅长IP形象、潮流插画、分镜设计、爆款漫画等。

阅读文章 >

优设专访数字艺术家Sixone：AI辅助创作的IP形象是如何登上春晚舞台的？ 大家好，这里适合你们聊设计的花生~ 春节将近，前不久 2023 年央视春晚公布了兔年的吉祥物“兔圆圆”，它是春晚 40 年历史上首个通过互联网大数据分析完成初始配方原创的总台春晚吉祥物 IP，形象乖巧可爱，一经发布就受到了很多网友的称赞和喜爱。

阅读文章 >

十年前，设计师可能都得会写几行HTML代码，而今前端与设计师分工明确，盒子模型作为前端技术中的概念对设计是否有可借鉴的意义？往期干货：平面干货！3个章节学会运营设计中的视觉动线我们的作品信息的传递效率高吗？

十年前，设计师可能都得会写几行HTML代码，而今前端与设计师分工明确， 盒子模型 作为前端技术中的概念对设计是否有可借鉴的意义？

往期干货：

平面干货！3个章节学会运营设计中的视觉动线 我们的作品信息的传递效率高吗？

阅读文章 >

在设计职场中，我们肯定被否定过，委婉一点就是建议再多出几个版本。要是遇到直白一点的，直接说你的设计做得太丑啦！在职场中遇到被否定实属正常，没有打压就没有痛下决心的驱动和反思。

在 设计职场 中，我们肯定被否定过，委婉一点就是建议再多出几个版本。要是遇到直白一点的，直接说你的设计做得太丑啦！

在职场中遇到被否定实属正常，没有打压就没有痛下决心的驱动和反思。记得初入职场的时候，一次设计提案就直接被老板说：“这都画的啥玩意儿，这么丑”，当我成长起来之后再回想起当初的场景，我很庆幸老板的直白批评，让我清醒起来了，自己不努力就只能被淘汰。

最近黑马哥也回忆了一下自己初入职场时的经历，当我们被否定的时候，如何走出困境至关重要。今天也针对这个话题和大家聊一下自己的想法，希望对大家有所启发。

往期黑马哥干货：

职场遇到这10种要求，设计师请学会拒绝！ 职场中总有这样一群人，总喜欢麻烦别人，把自己的事情交给别人来完成；也有这么一群人，不好意思拒绝别人的事情，导致自己的工作做不到极致。

阅读文章 >

一、真丑假丑自我判断 初入行业工作中作品被否定实属正常，虽然我们要按照需求方的想法做设计，但是被否定并不一定是我们设计得丑。需求方也是分专业和非专业，针对一些不专业的需求方，我们也要坚守自己的判断，真丑还是假丑自己心中要有数。

要是自己不够专业被别人质疑，可能是真的丑，这种情况只能虚心接受了。如果只是需求方审美不行，我们可以为了工作妥协自己的想法，但是我们对于设计的判断依然要坚守在更高的标准中。

如果是在设计平台发布作品被说丑，我们就要思考别人的这个评价是否是“杠精”。我们输出作品都有自己的目的，不能因为别人觉得丑就放弃，要有自己的正确判断。别人评价作品丑没关系，明确自己做这个作品的目的更重要，坚守自己的目标规划，让“杠精”们和你的差距越来越大。

二、正视问题调整心态 虽然真丑假丑我们自己要判断，但是如果是真的能力不足，也要正视这个问题。不要被别人影响，也不要自我感觉过于良好，正视自己调整心态至关重要。

不要被别人的评价干扰自己的心情，作品丑不是什么大过错，只是我们还在进步中而已。调整自己的心态切勿玻璃心，整理那些有效的建议，当局者迷旁观者清，别人的建议也是我们增长经验的一部分。

三、反复磨练由丑变美 知道自己的不足是好事，懂得调整心态更是值得点赞，就怕能力不足而不自省，更怕玻璃心一蹶不振。黑马哥刚毕业的时候也经常被骂，设计方案被退回来和被说丑那是常有的事儿。这都是职场经历的一个过程，没啥大不了的，跌倒了爬起来继续撸图。

我们要明白只有反复磨练才能由丑变美，想要改变别人的看法不是靠空想，也不是靠时间的积累。工作年限长了不代表你的能力就强了，工龄和能力不是一定会成正比的。我们都是凡人，只有按部就班的努力才能成为自己，简单的事情反复做，重复的事情做到极致，设计经验就是一堆源文件积累出来的。

要给自己制定作品输出计划，不怕自己做得比较慢，就怕你一直在原地踏步。要让自己多年后有很多作品可以筛选，而不是埋怨没有机会和公司不注重设计，导致自己没有作品沉淀。

四、设计过程多找依据 有时候我们的设计被否定并不是设计本身不好，也许是少了说服需求方的依据。就类似于设计方案技术说不合理、不好开发、实现不了等问题，如果我们可以拿出别人实现的依据，就可以证明我们的设计是没问题的，是你们技术能力不行而已。

设计过程中我们做出来的解决方案要有成熟的构思，也要找到验证方案成立的依据，空口说白话肯定是没有说服力的。平时也要加强体验和总结，也要建立灵感资源库培养采集、分类和分析的习惯，日常的积累量是提高效率的关键，别人产品的上线方案也是参考依据的途径之一。

设计过程中的依据可以是调研分析、竞品分析、线上案例分析、设计推导等，不要闷着头画图，也不要让设计停留在个人理解中，突破固化思维才能突破灵感束缚。

五、设计收尾自我审查 优秀的设计师需要注重细节、具备良好的职场习惯和专业态度，完成项目设计后要反复审查，不要出现低级错误。很多 设计师 完成项目后直接就发给需求方，一些看似小问题却影响了别人对你设计态度的质疑，相互之间的信任度需要从每一个细微之处体现。

自我审查是我们把控设计质量的第一个环节，只有自己觉得满意了才有可能说服别人接受，自己都打动不了还妄想打动别人。自我审查包含：设计逻辑、需求匹配度、细节处理、文案描述、规范统一性等，把控思路和细节，减少因小失大的风险。

六、设计提交要有说明 设计都是比较主观的，我们喜欢的方案需求方不一定能接受，而需求方喜欢的方案也许我们也觉得很丑。有时候方案被否定可能就是需求方只是凭感觉判断的，如果我们提交的只是视觉表现层面的展示，别人判断的时候也只能通过主观意识，也就加大了被否定的可能性。

无论项目大小，我们在提交的时候最好有自己的一些设计说明，不要只是发几个图过去。特别是面试的笔试题，通过包装呈现自己的全案设计思路是至关重要的，这样才能通过整体的结构体现出自己的综合能力。要是比较重要的工作项目提案，我们制作 PPT 也是必不可少的，特别是要进行演说，准备充分才能减少风险。也不至于让需求方觉得这么长时间就画几张图，把设计的价值给拉低了。

平时多输出一些日常练习，完成之后也尽量包装作品，这样才能提高自己作品包装的能力。排版的基础也是需要反复磨练的，不然做个 PPT 都显得不堪入目，反而影响了设计作品本身的质量。

七、设计评审要有主见 在进行项目设计评审时，我们也要先入为主，提前把自己的设计理念阐述一下，不要让大家通过主观意识去判断。在阐述的时候要有自信，对自己的设计方案要有信心，如果自己都否定自己，还怎么让设计说服别人。

遇到对设计作品质疑的声音，不要一味地妥协和质疑自己，要有自己的主见。通过自己前期的设计思考和项目的一些调研依据进行辩证，就算最终要妥协也不能自己否定自己的设计质量，只是大家见解不同，要敢于为自己的作品做争取。有时候需求方自己也不是很明确想法，或者说他们的想法也可能是错误的，我们要自信自己是专业的，方案是符合市场实际情况的。就算最终我们妥协了，也要保留自己的最终解释权。

作为设计师，一定要够专业、有态度、要自信。这份有主见和自信的气场不能丢，要给人的感觉就是站在台上就是我的主场，你们不能单纯以美丑来定义我的设计，要给出一个说服性的理由。就相当于我们发布作品在设计平台，别人评价说作品很丑，那也是别人不明白我们输出作品的目的，我们要坚信自己的方向是没错的，让多年后那些评价的人和我们差距一大截。

八、完成项目复盘经验 工作中项目有大有小，完成的结果也会有好有坏，也有一些不尽人意的情况出现。但是我们依然要养成一个针对项目复盘的习惯，特别是项目做得不好的时候，更是要通过复盘掌握经验和调整思路。

初入职场我们经常会被人否定设计能力，作品也会经常被退稿。复盘出不足的问题才能找到解决方案，这也是自查的一种形式，通过项目来自查自己的技能范畴，针对不足的技能制定学习计划。有些设计师作品经常被需求方否定，却不知道自己的专业能力到底问题在哪里，就是缺少自查的环节。

假设出一个全案设计的项目，然后去构思这个项目中所需要的能力范畴，再对标自己所具备的能力进行梳理。也要找一些优秀的设计作品来进行质量对标，和这些高质量的作品对比，看看自己缺少那些表现力。如果自己无法解析这些深入的表现技能，就要通过学习去加强，不然不会的问题就会越积越多，最终让自己陷入被动状态。

九、主观判断美丑自知 对于美丑的定义因人不同，审美的标准和生活的环境都各有差异，我们在判断感官层面都会带有自己的主观意识。通过这一点我们也要明白，别人判断我们作品也是如此，我们自己要自知自己到底有没有尽力。

不因为别人的夸奖而沾沾自喜，也不会因为别人的否定而一蹶不振，主观判断美丑自知。我们要了解自己、规划自己和信任自己，一切都按照自己的规划去进行，这个过程中难免会有异样的眼光，我们无需改变他人的看法，一切留给时间来验证，只要确定自己的方向是正确的即可。

十、总结 本文通过关于别人对作品美丑的评价为切入口，和大家聊了这个问题出现时的一些关联因素和思考角度。我们要有自己的思考和判断，不会因为别人的评价而晃动自己的坚守，也要因为别人的评价而冷静分析，接受有效的评价屏蔽无效的争论。

本文观点仅为个人经验反思和建议，大家结合自己的实际情况选择性吸收，不足之处欢迎留言补充，我们互相进步。

十年前，设计师可能都得会写几行HTML代码，而今前端与设计师分工明确，盒子模型作为前端技术中的概念对设计是否有可借鉴的意义？往期干货：平面干货！3个章节学会运营设计中的视觉动线我们的作品信息的传递效率高吗？

十年前，设计师可能都得会写几行HTML代码，而今前端与设计师分工明确， 盒子模型 作为前端技术中的概念对设计是否有可借鉴的意义？

往期干货：

平面干货！3个章节学会运营设计中的视觉动线 我们的作品信息的传递效率高吗？

阅读文章 >

遇到跨职能同事对界面设计方案发出灵魂拷问，设计师该如何应答？本文从理论和应用层面，对不同种问题总结了万字科普，希望有用~往期干货：UI/UX设计作品集中的推理分析该怎么写？高手实操案例分析！

遇到跨职能同事对界面设计方案发出灵魂拷问， 设计师 该如何应答？本文从理论和应用层面，对不同种问题总结了万字科普，希望有用~

往期干货：

UI/UX设计作品集中的推理分析该怎么写？高手实操案例分析！ 编者按：作品集中的推导分析部分该怎么写，而不是套市面上的流程和模板？

阅读文章 >

一、那些年，我遇到的灵魂拷问... 我的日常工作嘛，想必和其他从事界面设计相关工作的设计师一样：70%的时间用来构思设计策略和产出设计方案、30%的时间用来和产品团队各种各样的角色打交道：比如需要通过项目展示，让产品决策者买账；或者给开发工程师解释设计细节、跟踪上线后的品控问题。而在这 30%的沟通时间中，与合作小伙伴们的探（撕）讨（逼）设计问题总是不可避免的一个环节。那在这个时候，如何让他们理解问题背景、如何让他们理解你的设计方案、如何让他们“买账”......诸如此类问题是否能高效沟通，显得尤为重要。

其实，对于一些比较偏产品向的界面设计问题（比如：为什么支持“批量取消"？为什么有“确认页”？为什么“全屏展示活动图片”？...等流程、功能、信息展示型问题），我们解释起来是比较容易的——我们可以对标着产品经理制定的产品目标，结合数据分析师或用户研究员总结出来的数据或用户事实，即可快速地合理解释自己的设计方案。但是，如果你的小伙伴恰巧是非常严谨认真、刨根问底的人，他们可能会问出一些 非 常 微 妙的问题，让设计师立时无法抓到一个准确的论点或论据展开阐述，往往只能和团队的小伙伴们相顾无言。那这些 非 常 微 妙 的问题具体指的是什么呢？容我举个栗子：

类似于以上的问题，想必各位设计师在日常工作中并不罕见。然而我每每回答时，对话会进入一个奇妙的怪圈，be like:

“你不觉得这样设计更清晰/工整/美观吗？”

“我不觉得啊，我觉得都长得差不多。”

“可是这样用户能更快找到交互目标，完成交互任务，有更好的用户体验呀。”

“啊？有吗？为啥？所以呢？”

“......”

所谓“忍一时越想越气，退一步越想越亏”。咱就是说，每次都不知道如何解释、眼睁睁看着设计被“砍”来“砍”去可不行。为了让我自己变成更加“耐撕”的设计师，同时尽可能帮助到遇到类似问题的小伙伴们，我尝试着阅读、思考、总结了一些界面设计的科普知识，并以此来深入浅出地、感同身受地、科学严谨地解释一下设计师那些对于微妙设计细节的坚持，到底是从何而来的。欢迎各位设计师小伙伴给你们身边发出类似灵魂拷问的跨职能同事分享这个科普帖；也欢迎刚出新手村的、从事界面设计相关工作的设计师小伙伴们，把它当作入门级界面设计理（下）论（饭）科普来阅读。

1. 呔！灵魂拷问挑战一！

对于“界面设计的工作定义”这个问题，我根据自己的理解和体悟，尝试着用更加通俗的方式概括了它的答案：界面设计，不仅仅是埋头把线框图“从无到有、从有到优”地吭哧吭哧画出来就完事儿了，它还包括了解目标用户的特性和需求，了解产品的细节和目标，并根据用户的期望和产品的商业目标，假设出最“两全其美”的方案，并用目标用户能“看得到”“看得懂”“能操作”的界面把这个方案表达出来。对于这个“两全其美”的方案本身，比如有什么功能、流程长什么样子这些问题，相信产品团队的其他角色会贡献一定的想法和决策；而对于让用户能“看得到”“看得懂”“能操作”这个要求，则是界面设计工作中的主要责任和挑战，也是我们花费了大量时间去“纠结”的关键点所在：

有人肯定要问：但凡是能用智能电子产品看到你这个界面的人，肯定看得到字、认识字、也知道要点哪儿。为什么说“看得到”“看得懂”“能操作”这三点居然是个“挑战点”呢？——其实，“能做到”不一定意味着“做得好”，实际上人类的知觉和行为能力是十分有限的。关于这个论点，我将用一个例子来让大家深切了解（人类）用户的认知局限性。

请仔细阅读下方的视频截图中，黑底白字的字幕给你“布置”的“观察任务”，之后再点击下下方的视频以开始观看：

(《The Monkey Business Illusion》 - B 站视频源 点击下方视频直接播放，或复制链接跳转到 B 站观看）：

当视频无法加载时请刷新页面， 或前往PC获得最佳体验。

默数白衣服的人传了几次球

看完这个视频，相信大家对于人认知的局限性已经有了一定感悟。然而，和“有限”的用户认知相反的是，在实际的产品规划中，（由于不断更新的商业目标）产品的功能和信息的增量却是“无限”的。这对矛盾意味着，要做到“看得到”“看得懂”“能操作”这三点，团队中的设计角色必须斟酌如何正确引导用户在海量信息中，按我们预期的方式和顺序去浏览和操作：

而这就是，除了“画界面”——即“把产品经理规划的功能落实在界面中”这个要求之外，界面设计的另一个要求。这也导致了设计师在设计界面的工作中，会反复斟酌一些在跨职能同事眼中显得“无足轻重”的细节了。

看到这里，各位看官可能会有进一步的疑问：诚然，“引导用户按商业期望并尽量无痛地操作界面”在上述矛盾点的铺垫下，确实显得十分重要。但是，这难道不该跟“界面结构”“文案”这些更直观的要素具有关联性吗？正确的交互引导和设计师纠结来纠结去的界面细节（比如：元素距离、字体大小、图标元素......等），到底有什么因果关系呢？

用一个不那么恰当的例子做类比：程序员在模拟环境下跑代码之前，虽然没有那么确切的证据能证明这段代码一定能跑通且无 bug，但是他们往往会参考以往的经验和网上的案例，用最保险的逻辑和语法至少先码出一段能跑的代码，让它先运行起来再纠错。那么相似地，设计师设计的界面在上线之前，谁也不能保证这个设计一定能达成设计目标——商业目标及用户体验目标，但起码我们可以参考行业公认的“共性设计规律”，以及通过用户调研、数据分析得来的更有针对性的“个性设计规律”，用最自信的方式先设计出一个达到开发和上线标准的界面：

而上述所说的“行业公认的共性设计规律”，往往就和那些跨职能容易忽略、但设计师却不停纠结的界面设计细节，息息相关。

那么，这些“行业公认的设计规律”是什么？决定了怎么样的设计细节？以下我将挑选最基础的一些案例，用跨职能小伙伴们常见的“灵魂拷问”作为开头，结合理论和应用场景，帮助大家更快地感受和理解。

2. 呔！灵魂拷问挑战二！

我们来抽象和展开这个问题：为什么我们需要对某些界面模块进行“特别的设计”？需要“特别的设计”的情景是什么？为了回答这个问题，我想首先介绍一个界面设计的基础理论给大家：

这个理论其实很好理解，无需再深挖背后的心理或生物学原理啥的。不过值得一提的是，这个理论其实不仅运用在界面设计中，在很多其他的艺术或设计创作领域也很常见，我能快速想到的一个（奇怪的）例子就是，喜剧《唐伯虎点秋香》中唐伯虎初遇秋香时，唐伯虎端详了一下秋香的外貌，对身边的祝枝山说“长得也是一般的好看而已嘛”，然后祝枝山意味深长笑了笑、朝着人群大喊：“美女！”，结果所有华府的女佣都转过了头，唐伯虎惊讶地往后一跳，直呼：“哇~秋香果然是国色天香，超凡出尘！”

如果把唐伯虎想象成目标用户（？），把秋香姐想象成我们想重点推荐的功能（？？），要想让秋香姐，啊不是，某个功能对用户而言，是引人注目且过目难忘的，我们需要做出强烈的“对比”来凸显——在界面设计中，这个“对比”可能是颜色、尺寸、形状、留白等样式上的各种不一样：

让我们再回头看看这个灵魂拷问：诚然，通过“挑选一个合适的展示位置”在现有布局中达到“使模块呈现最好的曝光量、（重复）点击率等表现数据”这个目的是可行的，但是不可否认的是，一个载体界面上最佳的位置是有限的，位置的更改更是对页面其他模块而言会牵一发动全身、对用户而言会产生新的学习成本。一旦我们想尽量维持其他现有功能的布局、或希望除了位置优化之外，穷尽最大所能提升模块的行为表现时，为这些模块做特别的设计优化是必要且合理的。当然，这种“特别的设计优化”中的具体设计细节，也要考虑到此处设计复杂度 v.s.研发周期等“性价比”问题，不能理直气壮一味追求“特别的视觉效果“而掉入“过度设计”的怪圈。

3. 呔！灵魂拷问挑战三！

让我来进一步抽象这个问题：对于界面中的文字信息，既然可以利用格式（分行、分段）来区分其类别和从属关系，我们为什么还需要进一步给予文字不同的视觉权重呢？在进一步解释其原因之前，让我们先明白另一个关于信息阅读的“规律”：

为了更好地理解这句话，让我们将自己代入一个例子来实际体会一下所谓的“通过抓取关键词判断全局内容”是个什么情况，请回答以下问题：

回想一下，你在以上例子中收集信息的方式是什么样的？是挨个阅读了第一组和第二组中的所有内容并做出了判断？还是跳跃阅读式提取了和“台灯”更相近的关键字并做出了判断？相信大部分人都更偏向于后者，而后者就是我们所说的“通过抓取关键词判断全局内容”。

记得之前在阅读《社会心理学》这本书的时候，我发现在应用层面上，几乎所有的人类行为动机，其背后都有一个较根源的规律：人脑总是倾向于“简化提取信息“和“分散认知压力”。那么，当我们尝试着用这个心理学现象去反观“信息线索”这一规律时，它似乎变得可以推理和解释了：当我们的界面中堆叠了海量信息和视觉元素时，和我们预想的“用户会按顺序依次获取信息并进行脑内加工”不同，用户下意识会为了简化认知过程、分散认知压力，去跳跃式阅读并“采摘”他们认为的关键信息到大脑的“中央处理器”中，进行进一步加工，以便搞清楚“这个页面是什么？”、“我能否找到我需要的东西？”、“我大概能在哪里通过什么后续交互找到它？”...等问题。不知道大家是否曾看过“F 型阅读顺序”这个用户阅读规律，其实它的底层逻辑也同样是“信息线索”。

那么让我们回到开头的灵魂拷问：为什么需要给界面上的某些文字进行视觉权重的处理，也就是加黑、加粗、加大、加行距等等？其实答案已经不言而喻了——为了把我们想传递给用户的信息，像喂饭一样“喂”到总是跳跃式阅读、可能会遗漏关键信息的用户的“嘴”中，让他们找到他们想找到的、或者我们想呈现给他们的信息。举两个栗子：

4. 呔！灵魂拷问挑战四！

用简单的话来复述这个问题，就是：利用额外的动态控件去传递信息，它的必要性是什么？对于这个问题的答案，让我从一张图片开始，为大家展开阐述。如下图所示，请你尝试盯着图片中心的蓝色圆形，并尝试用余光去辨别距离这个圆形由近及远的物体分别是什么：

你是否有如下感觉：距离圆形，即我们的视焦点越远的物体，越难以辨别是什么形状？那么请你再尝试盯着下面这张动图的图片中心的圆形，并尝试用余光去辨别最远处那个不停运动的物体是什么：

对于这张图片，那个动起来的、距离圆形较远的物体，好像没有静态的时候那么模糊了？以上这两个例子，其实都涉及到一个关于人类视觉的普遍规律：

这个规律实际上和我们眼球构造导致的视觉特性有关，如下图所示：

人的眼球视觉可分为“主要视觉”和“次要视觉”。其中，“主要视觉”分布在中心区域且范围较小，由“视锥细胞”产生图像，而“视锥细胞”对于光线充足条件下的静态目标的色彩和形状细节都十分敏感，在白昼时是人类主要使用的视觉细胞；“次要视觉”则围绕“主要视觉”分布在其周围且范围较大，由“视杆细胞”产生图像，“视杆细胞”对于亮度和动态十分敏感，是黑夜中在“视锥细胞”失灵时的主要视觉补充方式。

其实，不仅是人类，很多其他以捕猎为生的哺乳动物的眼球也有同样的视觉特征。“主要视觉”能帮助捕猎者更好获取在视觉中心的猎物的一举一动，“次要视觉”则能帮助捕猎者快速获取周围环境中潜在的危险或捕猎竞争者的动向变化。

这就解释了为什么当你在光线充足的屏幕上，盯着上面那张静态图片中的圆形时，你的“主要视觉”只能支持你看清视觉焦点范围内的很小一圈的事物，比如距离圆形最近的外星人头像；而对于那些距离圆形较远的形状，则因为落在了“次要视觉”中，而随距离变得越来越模糊。

那上面这个视觉规律和本环节的灵魂拷问又有着怎样的关系呢？首先我们要明白的一点是，人类只有一双眼睛、一个视觉焦点（动线）。那么，当这唯一的视觉焦点随着我们正在进行的交互，移动到界面中的某个位置时，可能某些比较重要的、距离视觉焦点较远（而坐落在了“次要视觉”区域内）的信息，正在随着交互的进行更新了部分内容，那用户很可能就错过了这个重要信息的更新。那么，设计师能做什么来防止这种情况发生呢？

根据上文提到的视觉原理，这里应该有两种思路：1. 把关键信息的静态文案，放置在当前交互（视觉）焦点附近 2. 如果 1.的解决方案在当前界面布局规范中不被允许，那么我们可以利用“视杆细胞对动效敏感“的特性，动态展示关键信息。

最后，让我通过总结上文的内容，来快速回答一下本环节的灵魂拷问：当你想强调的信息和当前的交互（视觉）焦点较远的时候，由于视觉的局限性，我们很难感知到其变化。如果这种“不被用户感知”的概率很大、且其造成的体验或商业后果让人难以接受时，将该信息重复强调在焦点附近、或者用动效引起用户的注意，都是必要且合理的设计手段。

5. 呔！灵魂拷问挑战五！

同样，首先让我尝试转译和展开这个问题：在内容能够完整传递信息的情况下，为什么我们还要增加额外的视觉要素？对于这个问题，和前面的环节相同，让我先引入一个和答案有关的设计规律：

单纯看字面的意思或许有些抽象，为了方便大家理解，同样我将用一个实际的例子来让大家亲身感受一下这个规律。如下图，请分别大声朗读出两个组中的所有词汇，朗读时记得尽量快速并保持正确（想挑战更高难度的小伙伴，也可以尝试朗读每个词汇的字体颜色名称）：

你是否发现自己在识别和朗读第一组内容的时候，速度是快于第二组的？那原因又是什么呢？如果你仔细研究上面两组词汇，就会发现：第一组词汇的字面意思和字体颜色名称是一致的，比如：“粉红色”三个字的字体颜色也是“粉红色”；而第二组的上述两个要素，却是错位的。其实，在这个例子中，（如果你挑战的是朗读词汇本身）字体颜色就是一种“环境刺激物”，当人们对“环境刺激物”和目标识别物本身的信息认知是一致或者相似的时候（正如第一组所展示），就如本规律所说，人的辨识速度会更加快；反之则减慢。接下来，让我再例举一个和界面设计更贴脸的例子，让大家快速感受一下：

如上图所示的三组提示，你阅读时长最短的是哪一组？你能最正确地 get 到弹框信息的又是哪一组？想必大多数人的答案都是第三组，因为其提示中的文字和辅助刺激物（颜色、图标）传递的信息是一致的，因而能使人们更快更正确 get 到信息。其实这个例子也体现了界面设计中，最常见的“环境刺激物”是什么——比如：颜色、图标、插图......这种视觉类刺激物；其他一些不常见的“环境刺激物”包括了：声音、震动这些和其他四感相关的刺激物（写到这里突然想到windows系统里，当警告框莫名其妙连续弹出时，那一连串的“噔噔噔噔噔”，就算现在回想都能吓到炸毛的程度...）：

当然了，选择“环境刺激物”时也不一定非要挑选被文化或普遍认知刻进我们 DNA 的那些元素，诸如：红色=警示、感叹号=有问题......，它也可以来自特定产品领域、甚至完全来自你的产品本身：通过在交互中的不断重复和保持一致，将新的“刺激物+含义”组合刻进用户的潜意识中。比如，在填写密码/验证码等口令类输入的情境下，弹出框的震动会让人甚至都不用看错误提示，就意识到“填写错误”这个信息。这是因为某些聊天和金融类 APP 已经通过不断应用该“环境刺激物”在相应的场景，来让我们下意识把“震动”和“填写错误”联系起来：

好的，有点扯远了......让我们回到这个问题。已知人在与界面交互时，注意力是线性的+有信息量上限的，当设计师面临：

用户正在最重要的任务或者信息流中，且不应该被打断并转移注意力到次要信息线上。但同时，获取该次要信息对于用户后续的操作决策而言，又是必要的； 用户正在主信息流中获取某个信息，但 ta 需要花更少的专注力成本在这个信息上，以便于将注意力“花在刀刃上”。 在这两个情况下，用视觉权重适当的、含义一致的“环境刺激物”去辅助呈现对应的信息模块，是合理且有必要的设计手段。

这是否给你带来了一些颠覆原来认知的、对界面设计的启示？——有的时候，界面设计上的“多设计”，反而是为了用户“少阅读”。

6. 呔！灵魂拷问挑战六！

同样，让我转译一下这个问题：在分割界面信息模块上，多样的空白行、多余的分割线，他们存在的意义是什么？在回答这个问题前，同样让我们从一些由实验结果总结而来的“规律”作为前情铺垫：

这个规律其实很简单直观，大家可以回想一下自己欣赏各种平面艺术作品时，是否都是按照简单几何形去拆解构图的？或者反过来思考，在阅读过的平面设计构图教程中，是否大多数构图法则也都是以简单几何线/形作为基础的，比如：三角形、圆形、正方形、梯形、对角线、放射线等等...从正反两个方向来看，都有事实印证这个规律的正确性。

在界面设计中，由于“传递信息”这个关键目的，带来了“布局的复杂度必须较低”的局限，同时也是考虑到技术投入和实现难度等问题，当设计组件或信息模块时，我们通常会采用的形状仅有方形和圆形：

其中，圆形常用于偏视觉的元素（比如：图标，图标按钮等），我们暂且不展开。接下来，让我们聚焦在常应用于控件或文字模块的“方形”上。这时候就不得不引入一个在界面设计领域，大家最熟悉的理论之一——“格式塔”理论了。这里为了让解释更加好理解一些，让我直接选取一些和本环节问题最相关的两个“子理论”来为大家展开阐述。第一个“子理论”是“邻近性原则”：

上图其实把这个原则体现得淋漓尽致，我就不再为大家举另外的栗子展开解释了。其实，这个原则就回答了“信息间的空白空间”存在的必要性——你是否还记得前文提到的“信息线索”这个规律？既然人们的界面阅读习惯是“快速扫描”、“跳跃获取信息”，那么，和“文字权重的多样性”类似，“空白空间”往往能让人在扫描信息时，下意识推理出信息结构（即信息的从属、分组关系），从而使得这种“跳跃式获取信息”的行为更加快速和准确。比如：当用户看到一整块被空白分割出来的、较独立的部分时，会下意识去扫描第一行——他们往往会认为那一行是标题。通过这种方式，他们可以了解这个信息模块是关于什么的、有没有仔细阅读的必要......等等关键信息。

那么，如果“有层次的空白空间”就能在视觉上帮助分割界面的信息层级了，为什么有时候设计师还会应用分割线/框呢？首先需要从另一个“格式塔”的“子理论”——“同域原则”说起：

这个规律说明了“分割线”也同样能帮助信息分组。并且，在设计实践中，“分割线”这种更为强烈的视觉元素，其分割信息的视觉强度是大于“空白空间”的——这意味着在以下两个情况下，分割线是有存在必要的：

当在界面中的某层平级元素里，有最最需要重点强调的单个信息组时，需要用分割线/框强调之；  当界面中的某类平级元素，因为内含的子元素太多太杂导致“分无可分”时，需要引入视觉上观感更强烈的分割线/框来强化分组。

当然，还有其他例外的情况也会使用到分割线/框，它们和视觉分组无关但和交互引导息息相关，比如：“带边框的信息模块”可用于暗示该模块可点击、且点击都指向同一个目的地页面；“一列带框的信息卡片被屏幕边缘隐藏一部分”，能用于暗示该卡片列是可横向滑动的......等等，这些常见的使用场景相信大家都不陌生，就不展开讨论了。

所以总结并回答一下本环节的问题：“空白”的多样性，能帮助用户在扫视界面时，更快理解界面中的信息的分组关系、子母集关系，从而提升当用户跳跃式阅读界面时，其找关键字的准确性和速度；而分割线/框，作为“空白”的补充手段，既能在视觉上强调单个信息模块，又能帮助在层级过多、元素过杂的情况下，让信息的分组显得更清晰。因此，在信息较多、层级较复杂的界面中，设计师合理地利用多种数值的空白间距、分割线/框，是一种能帮助用户在阅读信息时“大脑减负”的常见方式。

7. 呔！灵魂拷问挑战七！

上述问题中提及的，无论是“菜单”还是“筛选”，本质上都是为目标选项池新增属性维度，并按这些维度分别分组，基于此让用户“按组定位”逐渐找到目标选项的一种交互方式。所以，让我们转译一下本环节的问题：和让用户直接阅读选项信息并决策相比，为什么我们需要通过（多层）分组的方式，让用户决策的过程从“一次性选择到目标”到“通过层层筛选、慢慢锁定目标”？它应该被应用在什么情景中？

因为这个问题解释起来也有些复杂，因此，同样地，让我从人类“决策行为”的剖析开始阐述。人的决策行为，本质上分为“感知”和“思维”两个步骤：先“感知”一个可选项、理解它的内容、并将以上内容“存储”在自己的“短时记忆”中，然后接着“感知”下一可选项并同样存储在“短时记忆”中......然后通过“思维”快速判断自己对每个可选项的主观喜好、客观利弊，最后做出决策。

从上述的“决策行为”方式中，我们可以看到承上启下的关键点是“把选项储存在'短时记忆'中”。说的有点悬乎，举个通俗的栗子来讲就是：当你上班摸鱼，思考中午吃啥的时候，你得先在脑内回忆一下今天食堂的菜谱有啥，才能基于这个信息纠结一小下下，最后决定吃什么。那可能有人又会问：这“短时记忆”又是什么？为什么选项会被存储在“短时记忆”、而不是其他什么什么的记忆里呢？

好的，那让我们进一步展开这个话题，来探讨一下“短时记忆”这个概念。让我快速用一张图片来给大家科普一下什么是“短时记忆”，以及它的兄弟“长时记忆”：

一般，在我们采集到信息中的关键内容后，它会被首先放入“短时记忆”中，只有当我们不断复习（刺激）该信息到某个临界值，它才会被放入“长时记忆”库中，拥有“长时记忆”的特性：

一个事实是：大多数的选择决策往往都是一次性的。这就决定了它们只会存在在“短时记忆”中，并拥有“短时记忆”的局限性——留存时间短，最关键的是，可留存的信息量少。那到底这个“少”又是多么地“少”呢？这时候就不得不提到继“格式塔原则”之后另一个界面设计中最常被提及的定律——“米勒定律”了：

那么，基于上面提到的两个关键点（即“记住可选项是决策的关键点”、“能记住的可选项的容量十分有限”），我们可以引出一个和用户决策行为相关的界面设计中的规律——“席克定律”：

下面我将举一个栗子，让大家感受一下这个规律将如何作用于我们的决策行为中。假设此时你正准备吃中饭，那么请分别在下面 A-C 组的菜谱中决定你想吃的东西。你可以尝试计时，自己从开始阅读菜谱到最后决定吃什么共用了多久：

体验完上述的栗子后，请试着回想一下：是否从 A 到 C 组的决策时长有个非常明显的增长趋势（如果你有一丢丢选择恐惧症，那么这种增长会更加明显）？这就是“席客定律”想告诉我们的规律。

那么在设计实操中，如果可选项过多（超过 9 个），且这种决策对用户而言是必要的、不可跳过的，我们怎么减少用户在进行该决策时的思考负荷呢？在本环节的开始，我曾提到过，人类的决策过程分为“感知”和“思维”两个步骤，因此我们的优化方案也可以从分别优化这两个环节入手：

优化“感知”的处理负荷，即帮助用户剔除非必要的可选项，可用的手段有自动筛选、自动排序，以及手动筛选框、手动排序等功能； 优化“思维”的处理负荷，即将决策的关键因素拆解成不同的维度（组），并将信息多层次地分组放置，形成各种样式的“菜单”，手风琴菜单、下拉菜单、侧边菜单...等等。

当然，解决措施有意义的前提是想解决的问题是有意义的，因此我们可以逆推，上述 1.和 2.的解决措施的应用场景为：选项库在做决策的当下，只会存在于用户的“短时记忆”中——毕竟正因为如此，才有了决策能力的局限性，才引发了后续问题和解决思路。那么，到底是哪些具体的应用场景符合上述条件呢？我罗列了一下能想到的场景：

动态变化的选项库，比如：商品搜索结果列表、活跃用户列表、最热门的歌曲列表等等； 非用户定制的、使用频率较低的选项库，比如：工具类软件的某些功能列表，系统设置选项列表等等。

而一旦选项库是静态的、使用频率较高的、用户定制的，在这种情况下，选项库大概率已经坐落在了“长时记忆”的区间中，所谓“自动脑补”。在这种情况下，设计师可以不用考虑优化决策体验的问题。这时候，设计师使用“菜单”或者“筛选框”等控件的考量，更多应该是基于用户的心智模型、竞品的常规处理方式、它本身或其他同界面入口的曝光量影响等问题了。

二、灵魂的拷问？灵性的应答！ 虽然，贯穿本文的始终是一个个“规律”和“理论”，但引用这些“规律”“理论”的本意是为了佐证本文中各种观点的合理性（毕竟“理论”和“规律”都是多次实际实验后总结出来的、在当前情景下最可能发生、最普适的现象），而非真的让大家在实际解决问题的时候，去咬文嚼字般地用似是而非的语言营造自己的权威感。

让我们开个脑洞换位思考一下：当你在和程序员交流的时候，他们直接甩出代码开始和你讨论数据结构；当你在和数据分析师交流的时候，他们直接把公式和 XX 定理摆在你面前高谈阔论......在这些情况下，你非但不会觉得他们很专业，反而会一头雾水地当场无语，对吧？推己及人，我建议大家在实际的跨职能沟通中，能够更多以这些“理论”“规律”中较表象、容易理解的信息作为起点，结合实际的问题情景、设计方案去解释和沟通：

以上就是基于我在实际工作中跨职能小伙伴们常问我的灵魂拷问，深度研究和思考后总结出的一些理论依据和应用方法，希望对你无论是审视自己的设计作品、还是回答跨职能同事的问题，都有参考价值。最后，感谢大家阅读本文，也欢迎各种点赞评论收藏，栓 Q~

欢迎关注作者的微信公众号：「应谋鬼计」

中国具有五千年文字历史，文字中所包涵的精髓，值得每一位设计师学习、继承与探究。设计师需要熟悉各种字体的风格特征，并能灵活运用字体进行编排设计，才能使作品的内容更清晰、更有条理地传达给读者。文字不仅具有阅读的固有功能，同时肩负塑造版面视觉风格的审美功能。

中国具有五千年文字历史，文字中所包涵的精髓，值得每一位设计师学习、继承与探究。设计师需要熟悉各种字体的风格特征，并能灵活运用字体进行编排设计，才能使作品的内容更清晰、更有条理地传达给读者。

文字不仅具有阅读的固有功能，同时肩负塑造版面视觉风格的审美功能。在现代设计中常能够看到一些精心设计过的字体，以醒目而个性的形式出现，在进行信息传达的同时也被赋予了视觉个性，成为画面的焦点之一。

字体是指文字的风格款式，也可以理解为文字的一种图形样式，不同的字体传达出不同的性格特征。

目前各大字库提供了各种版本、各种类型的字体供设计师使用。正因为字体类型繁多，使得版面设计成了一种很具有挑战的设计工作，设计师必须不断感受与体会，来安排好这些数量有限、潜力无穷的基本元素。

本期通过汉字的发展简史，分析汉字在各种设计案例中的使用，并为大家推荐视觉效果较好的相关字体。

更多字体干货：

超全整理！设计师必备的3类书法字免费资源（附下载链接） 大家好，我是和你们聊设计的花生~ 之前在社群有小伙伴问有没有免费可商用的毛笔书法字体资源，有肯定是有的，但授人以鱼不如授人以渔，今天除了为大家推荐免费好用的书法字体，还会为分享给大家优质的书法字入门知识和教程，还有免费的资源网站，让你即使没有书法功底也有办法做出好看的书法字体 ~ 往

阅读文章 >

一、甲骨文 甲骨文是我国最早形成体系的文字形式，字形优美，变化丰富，甲骨文处于图像化符号和系统化文字的过渡期，强调物体的特征和对自然的模拟。

应用案例：

目前古文字已失去了信息传播的实用性价值，但也为设计师们打开了更为广阔的文字应用空间。在现代设计中更多是作为图形使用，应用于体现古老历史文明的特定内容中。

1. 汉仪陈体甲骨文

以甲骨文书法艺术为基础，融入了现代设计思维，赋予了这种古老文字强烈的时代气息，用“新”的方式再现出甲骨文文化。

二、金文 金文即铸造在殷商与周朝青铜器上的铭文，又叫钟鼎文。多为象形字以及由象形字合成的会意字，优美的文字像一幅幅图画，生动逼真。

以战国时期中山国所出土方壶上金文为发想，取其线条的韵律感，保留重心偏高的特点，重组字体写法，创造出古为今用的现代金文，整体予人端庄优雅的形象。

以西周〈大盂鼎〉金文为基础，结合青铜铭文、甲骨文实物，转译为易于识别的文字造型，并保留象形文字的图像趣味。

三、大篆 广义的大篆包括甲骨文、金文和六国文字。狭义的大篆指籀文，以周宣王时的太史籀所书而得名。

石鼓文为大篆的代表。字体结构整齐，笔画匀圆，形体趋于方正。逐渐摆脱象形的拘束，奠定了方块字的基础。

以大篆为原型制作的一款字体，字形浑厚，方圆兼备，笔势婉转通畅，优雅古朴。

四、小篆 由于战国时期各国的文字非常混乱，大大影响经济生产的发展以及文化教育的传播。因此，秦始皇在统一六国后，进行了具有历史意义的改革“书同文”，即统一文字。

李斯以秦国文字大篆作为基础，去繁就简，同时吸收民间字体中的一些简体、俗体字的优点，进行规范，形成了一种新的字体——小篆。

应用案例：

小篆几乎完全脱离了象形文字，形体偏长，圆润整齐，成为十分美观的方块字体，有庄重肃穆、典雅堂皇之气，特别能营造传统古文字的典雅韵味。

1. 华康新篆体

设计师将传统篆书较难识别的部份略加修改，成为一般人也能看懂的“新篆体”。圆润均匀的线条，圆转的曲线笔势与颀长的字体结构，呈现出篆书独特的风格，

五、隶书 由于人们对信息传播的质量、速度有了更高的要求，小篆就逐渐演变成为笔画简化、更适合书写的隶书。

隶书的出现，是书法史乃至文字史上的一次重大变革。初步形成了构成汉字基本要素的点、横、竖、撇、捺、提、钩、折的笔画特点。隶书书写效果略微宽扁，横画长而直画短，轻重顿挫富有变化，讲究“蚕头燕尾”、“一波三折”，极具艺术欣赏的价值。

应用案例：

隶书字形平整、质朴、雄劲，气度十分典雅，艺术感染力极强，现代设计中常常用来作为版面的标题。

六、魏碑 魏碑体是北魏时期产生的一种介于汉晋隶书和唐楷之间的新书体，又称为龙门体。魏碑体端正大方，质朴厚重，刚劲有力，笔画如同斩钉截铁一般充满气势。

七、草书 为了书写快捷和书者为了抒发自己的胸臆，产生了一种在隶书基础上演变而来，笔画连带，一气呵成，极富张力和艺术感染力的字体——草书。

草书发展可分为带有隶书笔意，有章法可循的章草，进一步到不拘泥章法的今草，再到奔放不羁、气势万千的狂草三大阶段。

应用案例：

草书笔画连绵、自由、奔放、洒脱和率性，便于直接抒发书写者的思想情感。但因其识别性和易读性较低，一般作为标题或装饰元素使用，运用在浪漫情怀、充满动感的版面中。

1. 钟齐柳江毛草

字形潇洒飘逸，笔画连绵，行云流水，古朴优美，个性鲜明。

Tips：如果安装后找不到字体，请搜索其名称「Liu Jian Mao Cao」

八、楷书 楷书盛行于唐朝时期，楷书同时吸取了篆书圆转笔画，也保留了隶书的方正平直。笔画挺秀均匀，字形端正，使汉字的结构大体的固定了下来。后人因为以这种字体作为学习书法的楷模，即称之为——楷书。

应用案例：

楷书字形端正、挺秀均匀、富有韵味，给人以传统、古朴和高雅感。楷体识别性和易读性较好，无论是标题用字或正文排版都可以胜任。

1. 方正楷体（免费商用）

形体方正，结构整齐，将章法严谨的楷书化作现代字体，整体清晰度佳、辨识度高，适用于一般内文、教科书、公文、告示等。

九、行书 行书没有楷书那样规范严肃，也没有草书那样奔放和难以识别，而是书写流畅，用笔灵活，字体如行云流水、婉约妍美、潇洒流畅，而且易识性强，时至今日，行书依然是最为使用和应用最广泛的字体之一。

应用案例：

行书与现代手写体相近似，笔画流畅飘逸，商业设计中常用于潇洒随兴的视觉效果，能营造出充满人文气息与浪漫的氛围。

1. 禹卫书法行书

笔法柔顺，飘逸有型，潇洒如风，是一个很有美感的书法字体。

2. 钟齐志莽行书（免费商用）

运笔灵动快捷，不像草书那么疯狂抽象，却也有着笔走龙蛇之感。

Tips：安装后找不到字体，请搜索其名称「Zhi Mang Xing」。

以上列举的各种字体，均是以不同时代书体为基础，进行规范化设计而成，在 字体设计 师的努力下，最大限度的保留了原字体的精神风貌、笔画造型特点、字形结构比例和审美特征等。

文中展示字体只作为案例分析，版权归原作者所有，如需商用请购买正版字体。

至此，书法界的主流书体都已经登上了历史舞台，最重要的书写介质——“纸张”开始普遍为人们使用，此后的汉字史，可以看作一场精彩又漫长的墨与纸的切磋。下期见！

欢迎关注作者的微信公众号：「艺海拾贝Design」