如果你有午睡的习惯，你会发现如果中午不趴那么一会儿，一下午的脑子都是不清醒的。如果你有迷茫的习惯，最终你也会发现，无论处在人生哪个阶段，都有数不清的“迷茫”和“瓶颈”在等着你守着你。也许没准儿哪一天，这些迷茫不再以迷茫的面貌出现，它换了一个更酷的名字，灰犀牛。

如果你有午睡的习惯，你会发现如果中午不趴那么一会儿，一下午的脑子都是不清醒的。如果你有迷茫的习惯，最终你也会发现，无论处在人生哪个阶段，都有数不清的“迷茫”和“瓶颈”在等着你守着你。也许没准儿哪一天，这些迷茫不再以迷茫的面貌出现，它换了一个更酷的名字，灰犀牛。

上周给团队做了关于职业规划的分享，我现场做了个小的调研。结果并不出人意料：几乎没有人认为自己拥有清晰的 职业规划 ，同时，约有 30%的设计师认为自己作为设计师最多只能工作到 35 岁。

对大部分人来讲，一生中三分之二的时间在工作，职场是一个个人自我实现的舞台。保持适当的求生欲与危机感，有意识的准备自己职业发展的 Plan B，应该是每个职场人的必修课。 设计师 们也应该重视自己的职业规划，有了更清晰的目标，才能在为老板工作的同时，也为自己工作，为自己的未来工作。

本文从实用角度，以互联网行业的设计从业者为例，结合我自己作为职场老鸟的血泪经验，梳理了进行自我职业规划的方法和步骤，希望大家可以建立一个正确的认知，打开职业生涯发展的新思路。

往期同类文章推荐：

深度分析设计师能力模型（一） ： 从心理学角度聊聊职业规划 很早之前写了一篇《设计师晋升述职和能力模型》的文章，很多小伙伴给我留言或者私信，问了很多问题，也跟我探讨了自己的设计师职业规划和职场困惑。

阅读文章 >

一、认知自我 职业规划的核心根本问题是认知问题，认知问题的处理首先需要从认知自我开始。

成为自己，成为如所其是的自己，是每个人无论在工作还是生活中的首要目标。全球最有影响力的生涯发展研究者舒波，提出的职业发展拱门，也将“自我”的构筑放在了拱门最顶端、最中间的位置。

所以说，了解自己，正确的认知自己是做好职业规划的第一步。成为自己，成就自我，是职业生涯规划的最终目标。

那么如何认知自己呢，我觉得可以从以下 4 个纬度来进行。

1. 职业性格

一个人的性格或人格在成人之后已经定型，几乎是无法改变的了。所以了解自己的性格，正确的认知自己的性格，是一个非常基础的事情。

比方说一个人非常内向，我们不应该把注意力都集中在内向有哪些缺点，拼命改掉这些缺点，努力变得更外向的人差不多。而是应该洞察自己，认知自己，了解自己性格中的长处和短处是什么，不断放大自己的长处，学习一些技巧来弥补自己的短处。

心理学上会有很多方法和量表，比如 MBTI、九型人格、大五人格这些测试工具都可以帮助我们认知自己。

2. 职业兴趣

林语堂说，“先有痴，而后有成”。自己喜欢做的事情，自己天生对某些事情的热爱，往往是我们做事情的原动力。

很多目标感强的人，在学生时代就有了相对明确的目标，这往往得益于比较成熟的职业兴趣与职业启蒙。

相信大多数工作几年之后的同学，也会比较确定自己的职业兴趣。喜欢什么，不喜欢什么。如果对这一点仍然存在疑问的，可以结合“霍兰德职业兴趣测试”来做判断。

3. 能力结构

为了帮助大家更好的进行设计师的能力结构认知，我结合设计师的岗位胜任力模型整理了一个素质评估模型。

我们可以首先看一下专业素质和通用素质的部分，基本上作为设计师我们有六项能力是需要不断提升，也是被不断评估的。分别是：专业技能、项目管理、洞察创新、协作能力、执行力、解决问题的能力。

我们可以通过这个结构化的东西来自评自己的能力结构，哪些方面得分较高，哪些方面得分较低。从而对自己的能力结构有一个全面的认知。

4. 职业价值观

简单的说，我们作为一个人，在工作中自己最看重的是什么，我到底是觉得赚更多的钱最重要，还是获得更多的工作成就感更重要，抑或还是有融洽舒适的同事关系更重要，这都是我们的职业价值观。

职业价值观相对于上面的三点相对更加隐性，但其实对于职业规划而言是最为重要的。

舒波提供的职业价值观自测量表，将职业价值观划分成 15 种类型，分别是美的追求、安全稳定、工作环境、智能激发、独立自主、多样变化、经济报酬、管理权力、帮助他人、生活方式、创造发明、上级关系、同事关系、成就满足、名誉地位。

无论你对了解自己有多高的自信，还是非常建议自测一下。

二、认知环境 对外部环境的认知，也同样重要的决定了我们能不能做好职业规划。对于设计师来讲，需要考虑两个领域的现状和趋势，一个是设计的专业领域，一个是就职公司所在的行业领域。

嗯，这的确是一个很伤脑筋的问题，不过我们在职场上很多关键的选择都与对这个问题的认知程度强相关。遇到问题时抓瞎，问问这个，问问那个，还是不知道该怎么选，这样的情况可能是因为对环境缺乏认知。

在设计思想同质化、设计方法透明化、设计工具傻瓜化的今天，设计师作为一个职业，有着明显的低门槛、低天花板的现象。

低门槛让设计技法的重要性变得越来越弱，设计思维的重要性越来越得以凸显。

想法远大于技法。

这是好事。科技的发展释放了设计师更多的头脑和时间，设计方法和设计理念的同质化加速了设计师的成长速度，从而使得年轻的设计师可以得到快速晋升。

同时，快速晋升的同学也逐渐看清了自己在这个领域里的天花板。天花板与瓶颈的本质不同：瓶颈说的是过程，而天花板说的是终结。所以这意味着互联网行业的设计人才在进行着快速的迭代，快速的新陈代谢。

这也许是一种耸人听闻的说法，但愿如此。

我们再看一下行业环境。显而易见的是，设计师除了是设计师之外，还是自己所在行业的从业者。而设计师和程序员这样的职业，跨行业跳槽相对比较容易，所以我们也经常面临对行业的选择。

也许我们有一些途径可以获知很多信息，帮助我们做选择和判断。不过最近发生的一些事情，充分显示了大环境的不确定性。

2021 年之前，也许没有人能想象奥运会在疫情下召开，全世界的人一起看的奥运直播，直播画面全部是都 2020，而今年是 2021 年；也没有人能想象在线教育行业以双减政策的出台而整体塌方，一夜之间新东方等教育机构的市值缩水近 7000 亿；也几乎没有局中人可以获知滴滴上市后面临的审查。

这就是不确定性。

三、设定 1 个大目标和 1 个小目标 认知环境是一个难度较高的事情，并且我们掌握的信息永远是片面的，我们的认知也永远是不全面的。

如果我们要做职业生涯规划，不需要等到对自我和环境的认知非常胸有成竹之后再进行目标设定。并且因为我们认知的局限性，我们设定的大目标往往只能是一个模糊的、不够具体的目标。

所以首先我们要做的，是设定一个哪怕是模糊的长远目标，结合你所有关于职业状态的美好想象，大胆的设想它，并把它写下来。

然后围绕这个大目标，我们设定一个近期就能尝试实现的小目标。小目标的设定周期可以是一个月，两个月，或者半年。不要太长，也不要太短。

比方说，小莉的职业理想是成为一个万众瞩目的、多金的网络红人，那么他可能就需要从打造第一个关于自己的爆款短视频开始。小目标要与大目标要有强关联。

达利欧 通往成功的 5 步流程

四、立即行动 有了目标，就需要尽快动起来。如果不去行动，会在迷茫中继续蹉跎度日，最后陷入一个毫无动力的死循环。

有了目标，需要立即行动。

对，要立即行动，不是 1 年后，不是 2 个月后，也不是 2 周后。

当然并不是说你要抛下现在手里的一切，重新开始，而是说应该围绕目标先做一些尽可能的低成本的尝试。这种尝试性的行动，其实是在验证目标的可行性。

行动是目标规划的一部分，只有先动起来，才能促使自己在对规划中的内容做进一步的了解、形成更笃定的认知和判断，从而真正实现职业生涯规划的价值。

在行动的过程中总结经验，修正目标，并重复做尝试进行。

以上。

更多职场干货：

艰难求职季，腾讯设计师是如何做职业规划的？ 2020 年真的是一个开局不利的一年，如果有的选择，可能很多人都想重新开启这一年吧。

阅读文章 >

2020年陷入迷茫？帮你做好职业规划的9个实用经验！ 最近和很多设计师朋友交流发现各个阶段的设计师都对自己的职业规划比较迷茫，我最近也思考了挺久，梳理出这篇文章和大家一起共勉。

阅读文章 >

欢迎关注作者微信公众号：「柴林的设计笔记」

大家好，这是 12 月的第 3 波设计干货合集！这次合集里有移动端 AI 图片生成服务，有基于 AI 的独特节日贺卡生成服务，此外还有独特的抽象 3D 图形素材，有针对特定事件和功能的在线网站搭建工具，以及高素质的 Macbook Pro 样机。当然，在此之前记得看看往期干货中有没有你感兴趣的素材：第二波！

大家好，这是 12 月的第 3 波设计 干货合集 ！这次合集里有移动端 AI 图片生成服务，有基于 AI 的独特节日贺卡生成服务，此外还有独特的抽象 3D 图形素材，有针对特定事件和功能的在线网站搭建工具，以及高素质的 Macbook Pro 样机。

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

第二波！2022年12月精选实用设计干货合集 大家好，这是 12 月的第 2 波设计干货合集！

阅读文章 >

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

1、Linear 式设计风格网站合集 https://www.linears.art/

Linear 是一个在设计和细节上都非常考究的设计和开发平台，它提供了一套苹果式的设计美学体系，而采用了 Linear 式设计风格的网站和产品则被称为 Linears，这个名为 Linears.art 的网站就专门搜集了采用这一设计风格的网站和 APP，如果你也偏好 Linear 的设计风格，那么这里的内容都是颇为不错的灵感来源。

2、移动端 AI 图片生成 APP DRAI https://apps.apple.com/us/app/drai-ai-image-generator/id1643729769

DRAI 同样是基于咱们熟悉的 Stable Diffusion 开发而来的应用，不过它被制作成 iOS 平台的应用。使用它来生成数字艺术品的方法很简单，你可以给予一个简单的描述之后，选择你偏好的风格；你也可以上传一张照片，然后告诉它你希望基于这种照片进行哪些修改。DRAI 提供的玩法很自由，你可以通过排列组合创造出很多有趣的作品。

堪比艺术家！被疯狂安利的 AI 插画神器 Disco Diffusion 有多强？ 大家好，我是和你们聊设计的花生~ 有关注「神器挖掘机」阿文（微博 @Simon_阿文 ）的朋友，可能已经了解到他最近正在疯狂安利一款 AI 绘画神器——Disco Diffusion。

阅读文章 >

3、AI 生成独特节日贺卡的服务 https://designstripe.com/ai-cards

这是 Designstripe 出品的一款工具，在人工智能的帮助下，将你的需求和描述转化为一组有着独特插画的贺卡，你需要做的就是紧跟着流程填写内容，就能生成专属贺卡。

4、包含独特纹理的抽象3D形状素材 https://bloom.craftwork.design/

Bloom 是一个包含 450+ 抽象 3D 元素的大合集，这些 抽象 3D 元素大都被设计的非常风格化，规整而充满调性，你可以轻松地把它应用到不同的场合，而且无论是静态还是动态，用起来效果都颇为不错。这套素材有专门的 Figma 库 和 Blender 库，方便你在设计的时候直接调用。整套素材是收费的，但是提供免费试用的小样。

5、免费的在线网站搭建工具 Flyah https://www.flyah.co/

如今的建站工具也做的越来越智能，越来越方便了。很多工具为了提供尽可能多的功能，会提供大量的模板和无意义的插件，甚至定价策略都看得人头疼，而 Flyah 则不同，它保留了简单易用的拖拽是编辑功能，但是大胆地选择了以事件为中心的页面设计，内置的模板也基本上是为了服务不同事件而设置的，设计有格调，功能够集中，感兴趣的同学可以上手试试。

6、高素质 Macbook Pro Figma 样机 https://macbook-mockups.wannathis.one/

这是一套素质超高的 Macbook Pro 样机，这波样机超级有格调，整套样机是付费的，但是对于特定的品牌和项目而言，应该是值得的。这套样机可以直接在 Figma 当中编辑，同时还有免费的 Demo 下载试用。

7、免费创建高素质图表的工具 https://www.image-charts.com/

如果你需要创建漂亮又规整的图表，那么使用 Image Charts 2.0 可以相当轻松的做到这一点，不过它能做到的还不只是这些，它还可以通过自定义的 API 和 Zapier 以及 Make 集成到一起，让你的数据图表可以和任何数据源集成到一起，也能让你的图表动态的嵌入到网站、邮件等不同的场合。

大家好，这是 12 月的第 3 波设计干货合集！这次合集里有移动端 AI 图片生成服务，有基于 AI 的独特节日贺卡生成服务，此外还有独特的抽象 3D 图形素材，有针对特定事件和功能的在线网站搭建工具，以及高素质的 Macbook Pro 样机。当然，在此之前记得看看往期干货中有没有你感兴趣的素材：第二波！

大家好，这是 12 月的第 3 波设计 干货合集 ！这次合集里有移动端 AI 图片生成服务，有基于 AI 的独特节日贺卡生成服务，此外还有独特的抽象 3D 图形素材，有针对特定事件和功能的在线网站搭建工具，以及高素质的 Macbook Pro 样机。

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

第二波！2022年12月精选实用设计干货合集 大家好，这是 12 月的第 2 波设计干货合集！

阅读文章 >

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

1、Linear 式设计风格网站合集 https://www.linears.art/

Linear 是一个在设计和细节上都非常考究的设计和开发平台，它提供了一套苹果式的设计美学体系，而采用了 Linear 式设计风格的网站和产品则被称为 Linears，这个名为 Linears.art 的网站就专门搜集了采用这一设计风格的网站和 APP，如果你也偏好 Linear 的设计风格，那么这里的内容都是颇为不错的灵感来源。

2、移动端 AI 图片生成 APP DRAI https://apps.apple.com/us/app/drai-ai-image-generator/id1643729769

DRAI 同样是基于咱们熟悉的 Stable Diffusion 开发而来的应用，不过它被制作成 iOS 平台的应用。使用它来生成数字艺术品的方法很简单，你可以给予一个简单的描述之后，选择你偏好的风格；你也可以上传一张照片，然后告诉它你希望基于这种照片进行哪些修改。DRAI 提供的玩法很自由，你可以通过排列组合创造出很多有趣的作品。

堪比艺术家！被疯狂安利的 AI 插画神器 Disco Diffusion 有多强？ 大家好，我是和你们聊设计的花生~ 有关注「神器挖掘机」阿文（微博 @Simon_阿文 ）的朋友，可能已经了解到他最近正在疯狂安利一款 AI 绘画神器——Disco Diffusion。

阅读文章 >

3、AI 生成独特节日贺卡的服务 https://designstripe.com/ai-cards

这是 Designstripe 出品的一款工具，在人工智能的帮助下，将你的需求和描述转化为一组有着独特插画的贺卡，你需要做的就是紧跟着流程填写内容，就能生成专属贺卡。

4、包含独特纹理的抽象3D形状素材 https://bloom.craftwork.design/

Bloom 是一个包含 450+ 抽象 3D 元素的大合集，这些 抽象 3D 元素大都被设计的非常风格化，规整而充满调性，你可以轻松地把它应用到不同的场合，而且无论是静态还是动态，用起来效果都颇为不错。这套素材有专门的 Figma 库 和 Blender 库，方便你在设计的时候直接调用。整套素材是收费的，但是提供免费试用的小样。

5、免费的在线网站搭建工具 Flyah https://www.flyah.co/

如今的建站工具也做的越来越智能，越来越方便了。很多工具为了提供尽可能多的功能，会提供大量的模板和无意义的插件，甚至定价策略都看得人头疼，而 Flyah 则不同，它保留了简单易用的拖拽是编辑功能，但是大胆地选择了以事件为中心的页面设计，内置的模板也基本上是为了服务不同事件而设置的，设计有格调，功能够集中，感兴趣的同学可以上手试试。

6、高素质 Macbook Pro Figma 样机 https://macbook-mockups.wannathis.one/

这是一套素质超高的 Macbook Pro 样机，这波样机超级有格调，整套样机是付费的，但是对于特定的品牌和项目而言，应该是值得的。这套样机可以直接在 Figma 当中编辑，同时还有免费的 Demo 下载试用。

7、免费创建高素质图表的工具 https://www.image-charts.com/

如果你需要创建漂亮又规整的图表，那么使用 Image Charts 2.0 可以相当轻松的做到这一点，不过它能做到的还不只是这些，它还可以通过自定义的 API 和 Zapier 以及 Make 集成到一起，让你的数据图表可以和任何数据源集成到一起，也能让你的图表动态的嵌入到网站、邮件等不同的场合。

信息爆炸的今天，消费者的注意力越来越稀缺，设计的目的不再仅仅是美观，更要有效。所以在开始动手之前你需要清楚这六点！电商好文：一小时1200张图！

信息爆炸的今天，消费者的注意力越来越稀缺，设计的目的不再仅仅是美观，更要有效。所以在开始动手之前你需要清楚这六点！

电商好文：

一小时1200张图！当电商设计师把AI画画加入实战，效果太炸了！ 编者按：AI画画一直是2022年的热门话题，但至今仍鲜有实战案例。

阅读文章 >

一、视觉设计需要在信息爆炸的环境中吸引注意力 这个时代信息量增长的速度就像是宇宙大爆炸一样迅猛，在如此巨大的信息河流中，每个人都难免会被干扰到。

优秀的广告设计有一种神奇的本领——“它们知道怎样能吸引顾客的注意力”。在互联网出现之前，我们获取信息的渠道可能是电视、报纸、杂志、收音机、路牌广告…… 那个时候人们身边的信息来源相对较少，我们还比较愿意去花点时间去阅读它，我还记得我小时候无聊时翻看旧报纸时，就算是报纸上的广告也会一个字一个字的去看一遍，因为这是打发时间的好办法，如果遇到哪些有精美插图的读物，我会翻来覆去看上好几遍。然而，互联网的出现让信息像是插上了翅膀一样飞速增长，看看现在我们身边各种各样的广告牌、电视、电脑、手机，那一块小小的屏幕就像是无底洞一样，可以装下任何东西，信息取之不竭用之不尽。

每天在我们所生活的这个世界出现了大量的信息，信息的增长速度绝对是一件近乎恐怖的事情——信息爆炸。信息爆炸表现在五个方面：1、新闻信息飞速增加。2、娱乐信息急剧攀升。3、广告信息铺天盖地。4、科技信息飞速递增。5、个人接受严重“超载”。

“相比于爆炸的信息量，我们的时间并没有变多，注意力甚至更少了”

相比于与日俱增的信息量，我们的时间并没有变多，我们一天还是 24 个小时，每个小时还是只有 60 分钟。时间非但没有增加，反而变少了！因为我们把本来就不多的时间分给了不同的信息，你可能每天会刷一会抖音，看一下朋友圈，上淘宝看看自己的快递到哪了，下了班放松一下打个游戏、追个剧……不知不觉中你的时间被分割成了无数个碎片。碎片化的信息、碎片化的浏览和阅读、碎片化的时间，碎片化就是我们今天生活状态的一个写照。

在这种情况下，不受干扰的做一件事情来变得越来越困难，或许你也想把注意力用在学习上，但你刚刚准备翻开一本书时，你的好友却发来一条 微信 消息，接下来你很难忍住不看它。

当你伸手去点亮屏幕时，你的注意力就像是暴露在了空地上，被各种信息瞄准，各种广告、推送、消息……它们蹦着跳着来吸引你的关注。多数情况下你会乖乖就范，注意力被它们所吸引，马上就忘掉了刚才那个要努力学习的自己，踏上了时间偷偷流逝的奇怪过程中。

二、你的“大”战场在一块“小”屏幕上 在信息与日俱增的今天，承载信息的主要载体却比以往任何时候都要小。以前我们信息的主要是通过书籍、杂志、报纸、纸张这些载体来传递，在纸张作为信息的主要载体时，人们的注意力专注度是很高的，没有消息弹出、没有信息推送，很少有信息能够干扰到你。

随后电视与无线广播加入其中，我们的世界开始变得丰富多彩，有了声音和动画，但是我们还是能够保持专注来看节目或听节目，毕竟信息不是很多，我们还没有学会看一眼就能分辨出哪些是有价值的信息、哪些是无用的广告的本领，一切都东西对于我们还都是新鲜的。

电脑出现后，信息就像是长了翅膀一样，飞速增加，各种博客、论坛开始受到追捧。 互联网继报纸、广播、电视之后成为了“第四大众传媒”互联网发展的速度远远超过了前几任媒体。

无线电广播问世 38 年后，拥有 5000 万听众，电视诞生 13 年后，拥有同样数量的观众，而互联网从 1993 年对公众开放，到拥有这个数量的用户只花了 4 年时间。获取信息对于我们而言变得容易了很多，敲几下键盘，屏幕上就能找到我们想要的信息。但我们还是要老老实实坐在电脑前，保持一个相对专注的状态，并且使用时间也很长。

直到 2007 年 1 月 9 日，乔布斯发布了 iPhone，随后在短短的时间里这个小小的屏幕能干的事情越来越丰富。听音乐、看电影、联络亲朋好友、订票、购物……并且它的使用环境非常便捷，你可以在乘车时候看电影，散步的时候听音乐、躺在床上还不耽误上网购物。然而这所有的功能全都基于那快还没有你手掌大的屏幕。

在手机屏幕上，点、按、滑动，所有的操作都在一块几英寸的屏幕上进行，当然即使是阅读也只能在手机屏幕这小小的面积上进行。雪上加霜的是电子屏幕比纸制阅读更加难以进行，因为屏幕的刷新与发光特性会让眼球的疲劳加快。不仅是这些，越来越多的信息都加入了这场注意力的争夺战，这让你的专注度更加难以维系，在查看一些碎片信息的过程中，最长出现的情况是看到一个有兴趣的内容，然后就会沿着主题进而搜索相关的信息，从而注意力越扯越远，形成一种“注意力游离”的状态，半小时的时间变成了一上午的闲逛，到头来也不知道自己做了些什么。所以你要清楚顾客的阅读场景发生了巨大的变化，像这种碎片化的时间已经成为了消费者使用手机的主要场景。

各种各样的信息变得越来越多，注意力的争夺变得尤为激烈，消费者在这种情况下越来越没有耐心。从原先一个字一个字读，到一行一行读，再到一屏一屏读。

但是我们只能在这一小块屏幕上施展拳脚，毕竟这块小小的屏幕是人们最常用的上网渠道。

截止到 2019 年，我国网民规模达到了 8.29 亿，全年新增手机网民 6433 万；网民中使用手机上网的比例高达 98.6%，手机已经成为网民最常用的上网渠道！用 PC 的甚至都可以忽略不计了。上网时间又多少呢？人均每周上网 27.6 个小时！这块小小的屏幕产生出巨大的价值，以天猫 2018 年双十一交易为例，24 个小时创造了 2135 亿的成交金额，而移动端的销售额竟然占了其中的 90%以上！手机上这块小小的屏幕已经成为了移动着的激烈战场。

三、你只有 3 秒钟的时间抓住顾客的眼球 在“浮躁”盛行的当下，“耐心”或者说是“注意力”渐渐成为了这个时代的稀缺资源。快节奏的生活让时间从来没有像今天一样紧迫，我们不会轻易把自己宝贵的时间交给谁，除非某条信息或某件商品对你来说有很大价值！比如你在面对眼前的广告时，会有一种“麻木”的状态，即使它出现在你眼帘中，你也不会去话时间去关注它，只有看到你关注的信息出现时才会花时间去了解。

面临各式各样的商品推销信息，消费者开始学会了一种实用的技能——用最短的时间去找到自己想要的商品。所以绝大多数广告信息不会得到顾客的仔细阅读，甚至都没进入到顾客的眼帘就被顾客本能的杀掉了。

人们每天要面临的信息量太多了，有效的设计才会被注意。

现在你费尽心思营销你的商品，用尽各种方式证明你的商品有多好，但很多商家往往会漏掉一个最重要的环节：让顾客现在、立刻、马上购买！如果没给出一个立即购买的理由，顾客的反应则是“恩，这个东西看起来确实还不错，以后我可能会买一件试试看。”但是，想让顾客主动记住你、在下次购物时再想起你是非常难的！因为人们在互联网巨大的信息流的裹挟中，已经越来越“健忘”，人们习惯收集各种各样的干货文章还有各种感兴趣的商品，但是收藏后就再也没有打开过，甚至在一段时间后重新翻看我们收藏的信息时，面面相觑感觉从来就没有见过一样。

在亿万件商品中，顾客的“健忘”会更加严重，顾客看完后如果觉得“没有必要现在买，等以后非用不可的时候在说吧”，那你的营销是失败的，这就好像是一个经验丰富的推销员在给你介绍了两个小时商品后表示：您不必现在买，什么时候买都一样。多么可笑和愚蠢？你能保证顾客在下次有需要时还能想起你吗？

总之，你要记住网络中的消费者普遍具有“健忘”的特点，不要指望他能记住你，如果要成交，最好的时机不是明天，不是后天，而是现在！

如何唤起顾客的紧迫感，让顾客立刻下单，这又是一个详细的分支，大家感兴趣的话骉叔后面会单独针对这个方面写一篇。

放射状的注意力：注意力，或者说是人们所注意的内容和方式，总会被认为是点状的。点状的注意力特征是长时间专注，比如我们在阅读一本著作时，会把注意力努力控制在这本著作的内容上，尽量避免周围的环境和信息所干扰，即使周围有某些声音的干扰，我们也会把注意力拉回来，让注意力长时间的在“阅读”这件事上。

但是，这是传统的阅读注意力的形态，互联网时代的注意力已经不再是点状了！

放射状可能能够更加贴切的描述现代人们的注意力形态。请你尝试阅读下面这段话：卡夫卡说人类有两大主罪，所有其他罪恶均和其有关，那就是缺乏耐心和漫不经心。

对于不了解卡夫卡的人来说，注意力已经不再是点状，因为这个点跑了。你会很好奇“卡夫卡是谁？我好像听说过，但又不太了解。于是你搜索“卡夫卡”了解到他是一位伟大的小说家，耳熟能详的作品有《变形记》，好像有档节目名字就叫变形记，于是你的又搜索了这两个变形记是否有关联……

你有没有注意到？短短的时间，你的注意力已经从原先的一个点，放射出了很多个点，不同的内容，不同的方向……

回到我们熟悉的购物过程中，即使我们带着明确目的去购买一件商品，也总是很容易被首页的各种广告把我们的注意力给分散开。你看了半小时的漂亮球鞋，忽然才想起来要买的是啤酒。可能是那双球鞋的图片拍的太漂亮，唤起了你拥有它的欲望，让你离你原来的目的地越来越远。

3秒 注意力法则 ：你只有几秒钟的时间抓住顾客的注意力，并且激起他们的兴趣……就像宇宙的大爆炸一样，前几秒、几毫秒特别重要。因为人们在浏览时会先以毫秒级的速度来扫描一下屏幕，然后做出判断，判断哪些是自己想要看的信息、哪些不确定、哪些直接拉进黑名单！

注意力的分布还和屏幕的位置有密切的关系。简单来说就是倒三角原则：屏幕上面的信息会得到更多的注意，越往下所获得的注意力也就越少。

所以我们商品描述的部分，处于顶端的头图是最被重视的，顾客的注意力大半都在头图的介绍中，而我们重点优化的产品详情介绍，其实是处于相对次要的位置！互联网经济就是注意力经济：互联网经济中，无论是社交、内容、购物、游戏、视频……归根结底就是注意力经济。谁能购在众多信息中争夺到用户的注意力，获取到用户的时间，谁就获得了更多的资本与力量！

四、消费者阅读模式的变革决定了设计思路的转变 人类感知这个世界的方式可以分为五种：视觉、听觉、嗅觉、味觉、触觉。实验心理学家赤瑞特拉（Treicher）做过一个著名的心理实验，是关于人类获取信息的来源。他通过大量的实验证实：人类获取的信息 83%来自视觉，11%来自听觉，这两个加起来就有 94%。

网络带给我们一个视听结合的虚拟空间，也就是说，在网络中只有我们的视觉与听觉在发挥作用，嗅觉、味觉、触觉的信息无法获得。但是其中听觉所占的比例远远低于视觉，因为我们更多地是在“浏览”在“看”而非“听”。

我们在浏览时主要是去看图像与文字，图像和文字这两种元素基本上构成了我们的互联网世界。

所以视觉是消费者对商品、对品牌判断的最重要依据

你在购买衣服时，对这件衣服的面料材质、版型设计、功能特性全部都是通过视觉来获取的，而产品的质量如何？触感是否舒适？有没有特殊的味道？这些信息也只能通过视觉信息去联想，比如你看到面料的特写，会联想它摸起来是一种什么样的触感，穿着是否舒适？是否有弹力？

在购买零食时，图片是不是足够漂亮、能够唤醒你的食欲？这肯定是你购买的最关键信息，至于闻起来味道怎么样？口感如何？是否有足够的分量？这些都变得不再重要，因为从图片上你会感觉到“肯定好吃”甚至你的口水都被它挑逗出来了。

除了产品，对一个品牌来说，视觉也是我们对它进行判断时最重要的因素：进入店铺后如果看到的是劣质的图片、毫无逻辑的布局、没有任何品牌辨识度的颜色，顾客会心里的好感度与信赖感会迅速降低，以至于怀疑你产品的质量，在你还没开始介绍时已经拒绝了你！这就像是我们对一个陌生人的判断，基本上也都是来源于你能看到的外表。

视觉是我们所有感官之首，以前是，现在更是。

图片比文字更容易被记住：莱昂内尔 斯坦丁做过一个试验，他请研究对象在 5 天内看了 10000 张图片，每张图片展示 5 秒，之后再向研究对象展示成组的图片时（一张见过的，一张没见过的），他们能记住之前看到过的 70%的图片。

试试展示 10000 条广告口号，每条 5 秒钟，一个人在 5 天之后还能记住多少？为什么图片更容易被记住？

因为图像给人的信息是具体而具象的，在信息堵塞的今天，大脑会本能的“偷懒”，去避免思考和记忆。所以人的大脑更容易记住具象的信息，这种可视化的图像信息更容易被记住，让信息的记忆成本变得很低，所以我们更愿意去看图，而非看字。

就像上面我们提到的实验一样，给你看十张图片，肯定比给你十个英文单词更容易记住。我们总认为顾客会盯着我们的每个广告，去仔细阅读我们的内容，而实际上他们只是在每个页面上瞥一眼，扫过几个关键字，点击一个自己感兴趣的链接，至于其他的部分，顾客通常连看都不看。

我们不是阅读，而是扫描，通常我们只是花极少的时间来浏览大部分页面，或者只是扫描一下，寻找能引起我们注意的文字或图片。

“用户看起来更像“以 100 公里的速度驶过广告牌”。这是《点石成金》中的一个比喻，而且这是在将近二十年前所提出的，当时的互联网热潮刚刚兴起，信息拥挤的情况还远远不及今日。何况今天信息量爆发式增长。如果以前是“以 100 公里的速度驶过广告牌”，那今天应该至少是“以 300 公里的速度驶过广告牌”人们已经从汽车换成了高铁。

所以，顾客可能会对你的那些含蓄的文字、无关紧要的装饰无感并且忽略掉，你应该把心思放在让顾客“驻足观看”上。

五、广告图的设计不要让消费者长时间思考 现代生活越来越快的生活节奏和爆炸的信息让人们形成了不加思索的思考方式，并且这种现象未来会越来越普遍。——罗伯特恰尔蒂尼

思考是购买路上的拦路虎：现在，随便点进一家商城，都不难找到那些充满“创意”的广告，他们通常会有两个特征：

广告语都是些华丽漂亮的大词，有时还会用一些聪明的双关语，好像被人一眼看明白就是自己的文案不合格一样。 设计形式充满美感，各种点缀元素和绚丽的颜色搭配，但就是没把产品展示的好看。这种设计方式最大的特点是：“充满设计与创意，但第一眼就是没看明白” 这就犯了一个普遍的错误，我们前面提到过：顾客并不是盯着我们的每个广告，去仔细阅读我们的内容，实际上他们只是在每个页面上瞥一眼，扫过几个关键字，点击一个领自己感兴趣的链接，至于其他的部分，顾客通常连看都不看。这些信息不够直接了当，不够清晰易懂，顾客必须停顿下来仔细看几遍你的广告才有可能领会其中意义。而在选择点击这件事上，没人会像去写论文一样思考。

很多说法规定，让顾客从点击到购买完成，这个过程中的点击几次是最好的，有的规定在三次，有的是四次。

其实重要的不是点击的次数，而是每次点击时，顾客需要多少思考？这个点击的动作有多艰难。如果你的点击是让人摸不着头脑，不知道点击的下一步是什么，即使你只需点击一下，也没人去点击。如果你的每一次点击都是毫不费力的、轻松而明确的，那么就不存在必须限制在几次以内。

还有一种信息堵塞的情况：总是在很小的面积内塞满各种各样的产品卖点，密密麻麻的文字、各式各样的配图、五花八门的利益点都打包给浏览的顾客。至于如何消化吸收这些信息则完全让顾客自己去思考，这也是一种错误的做法。顾客总是单纯快速浏览，很少去仔细阅读你的广告，所以顾客会选择轻松的关闭网页，重新选择一个读起来毫不费力的页面。

所以，你的广告或店铺看起来都应该是不言而喻、一目了然的。

六、这些原则不会改变 让我们来总结一下，互联网让顾客有了哪些改变：

互联网环境中的顾客专注力变得更短，更欢迎一些“小块”的信息，而非大量信息。 信息泛滥，注意力却贫乏。这就表示你的广告内容必须与顾客切身相关，了解消费者的需求、渴望，这样才能抓住顾客的注意力，这是销售的第一步。 顾客懂得了闪避推销，更能分辨哪些是浮夸的宣传，变得越来越多疑。这意味着你的商品介绍中要给出足够多的“证据”让消费者能够消除这种不信任感。 顾客喜欢看图片，因为这样更容易记忆和理解。 让顾客思考是一件成本很高的事，请把复杂换成明确易懂。 互联网虽然改变了各种生活方式，但是互联网并没有改变人本身。

如同劳德·霍普金斯在他的经典著作《科学的广告》中所描述的：“人类的本质是不会变的。从大部分的角度来看，现代人跟凯撒时代的人没什么两样，所以基本的心理学原则依然牢靠，因此，你永远不必将学过的心理学原则全部打破、从新建立。

基本的设计原则永远经典，哪怕世事变迁，沧海苍天。尽管技术发展日新月异，但是人本身的变化却非常缓慢。我们依然是只关心与自己有关的信息，至于商家宣传自己的规模有多大，取得了什么样的成就，那些我们都不感兴趣，我们只关注自己能获得什么。

就像 Jakob Nielsen 所述：人类大脑的容量不会马上发生变化，所以研究这些人类行为所得到的成果在很长时间内都不会失效。对于顾客来说，20 年前他们遇到的困难，现在同样如此。

无论什么时候，去了解你的顾客都是最重要的：无论在传统的报刊上刊登广告，还是在电视上播放广告，或者现在在网页上和手机 app 上展示你的广告。都有一个必不可少的步骤，就是尽可能多的去了解你的顾客！

对你的顾客了解的越深入，你的广告也就更具有针对性。不要想着设计一则广告去吸引所有人，把你的商品卖给所有人，那样结果很可能是没人被你吸引，也没人购买你的商品。了解顾客哪些信息？

目标顾客的年龄范围是什么？他们是 00 后还是 90 后？有或者是更成熟的 80 后？ 哪种性别的顾客对你的产品更感兴趣？ 你的潜在顾客收入水平大概是多少？收入会影响他们的品位和生活习惯。 你的潜在顾客教育水平怎样？你用的那些专业术语他们能看懂吗？ 你的商品是顾客的生活必需品？还是奢侈品？ 顾客在什么样的场景使用你的产品？怎样使用你的产品？多展示这些场景，增加顾客的代入感。 你的顾客觉得最有价值的是什么？便捷、便宜、个性还是品质？ 顾客除了在你的商店，还会在哪些渠道看到你的信息？ 你的顾客长期生活在什么地方？有什么明显的气候特点？ 你的顾客群体有没有独特的群体文化？ 你的顾客是哪种消费理念？是使用为主的持家型还是重视当下享受的？

以上这些问题是一些比较典型的分析方向，我强烈建议你根据用户的特点总结出一个，或多个消费者画像，可以是具有不同性格、不同性别、不同工作性质的多个消费者画像，总之要能够代表你的消费者特点，并且去不断优化和修正。

这样你在设计时会有明确的方向性，你可以在进行设计前考虑“这些顾客最关注的是什么？”，设计完成后站在消费者的角度去思考“他们会对这个设计感兴趣吗？”。

 

大家好，这里是和你们聊设计的花生~不知不觉已经是 2022 年底了，最近为大家整理了一篇字体合集，包含了我从今年 3 月份开始收集的 9 类高质量的英文字体，涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。字体都是免费可商用，能满足设计中绝大部分的需求，并节省设计师寻找免费英文字体的精力。本文有字体风格...

大家好，这里是和你们聊设计的花生~

不知不觉已经是 2022 年底了，最近为大家整理了一篇字体合集，包含了我从今年 3 月份开始收集的 9 类高质量的英文字体，涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。字体都是免费可商用，能满足设计中绝大部分的需求，并节省设计师寻找免费 英文字体 的精力。

本文有字体风格的详细介绍和安装包下载链接，建议直接收藏，之后需要是直接下载即可~

往期回顾：

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

阅读文章 >

一、经典衬线体 包含字体：Cinzel、Cormorant、Playfair Display、Butler、Roboto Slab

详细介绍及安装包下载： https://www.uisdc.com/commercially-available-english-font-2

英文衬线字体在设计中运用极广，这里的 5 款字体可以作为 Trajan、Garamond、Baskerville、Bodoni 等经典西文衬线体的替代。5 款字体气质各不相同，或庄重正式或优雅精致，可以满足不同的设计需求。

二、经典无衬线体 包含字体：Roboto、Marcellus、Montserrat、Poppins、Barlow

详细介绍及安装包下载： https://www.uisdc.com/commercially-available-english-font

Helvetica、DIN、Optima、Sofia 等西文字体虽然经典，但没有购买版权不能商用。这里为大家推荐的 5 款英文体正好可以作为这些经典无衬线体的替代，字形气质相似且字体质量极高，无论是正文还是大标题都适用。

三、纤细手写英文字体 包含字体：Dattebayo、England、Sophia Christie、Reading、Cervanttis

详细介绍及安装包下载： https://www.uisdc.com/thin-cursive

这种字体秀丽灵动，适合作为装饰用在画面中，可以烘托氛围、平衡版式，并打破画满的呆板沉闷，使海报层次丰富有亮点。合适与文艺、青春、音乐及女性相关的主题。

四、优雅英文衬线字体 包含字体：TheNightWatch、Branic、Areminiscentsmile、NewYork、Qene-G

详细介绍及安装包下载： https://www.uisdc.com/poster-design-5

这种笔画极具设计感的英文衬线体在今年的海报设计中经常出现，国外设计媒体也预测未来会继续流行。字体风格优雅华丽，装饰性极强，适合以大字号展示，可以作为书籍、网页、海报等的大标题。

五、铜版手写体 包含字体：Italianno、England hand DB、Exmouth、Dynalight、Bolina

详细介绍及安装包下载： https://www.uisdc.com/copperplate-script

铜版手写体字形微微向右倾斜，不同的字母间有极细的笔画相互连接，延绵流畅，如同时书法家用钢笔一气呵成写成的，具有音乐韵律般的节奏和美感。字形精致，气质华丽典雅，在明信片、邀请函、红酒包装等设计上有广泛的运用，适合与女性、婚礼、餐饮美食等相关的主题。

六、笔刷英文字体 包含字体：Forturn、Takota、Good Brush、Shuher、Alinea

详细介绍及安装包下载： https://www.uisdc.com/brush-font

英文笔刷字体一般是用平头毛刷或者硬头马克笔直接写出来的，笔画粗犷利落，具有力量感，笔头留下的毛糙边缘及飞白也让这种字体更具质感。这种字体非常适合需要表达个性主题的海报，且在海报中通常作为视觉焦点进行处理。

七、力量感英文字体 包含字体：Theater、Berd、Thunder、SuperLine、Phyco

详细介绍及安装包下载： https://www.uisdc.com/design-with-a-sense-of-force

这种类型的英文字体最主要的特征就是线条粗重，作为海报主体元素时有很强视觉冲击力。适合大字号的展示，运用在与体育、运动及与男性相关的主题中，突出健壮有力的感觉。

八、科技感英文字体 包含字体：Aperat、Generic Techno、Liberation For 7 Kicks、XYBER、Arcade

详细介绍及安装包下载： https://www.uisdc.com/6-science-and-technology-font

这种字体的外形具有显著的几何块面特征，适合机能风、赛博朋克或未来科幻主题，提升画面的氛围感，可以作为海报或作品集的主视觉或装饰元素。

九、潮流英文字体 包含字体：Facón、Rubik Glitch、Modulor、Ron、Libre Barcode 39 Extended Text

详细介绍及安装包下载： https://www.uisdc.com/6-trendy-english-font

这种字体高度图形化，看起来更像图案装饰而非字体，但这也让它们比常规的字体更能引起人们的注意。如果放大后作为装饰元素用在酸性潮流海报中，可以有效增加画面的设计感和视觉张力。

以上就是今天为大家推荐的 9 类常用英文字体合集，也算是送给大家的 2022 年底礼物啦~

我在开始学设计时经常为找免费可商用的英文字体头疼，一是不知道是不是真的免费可商用，二是可商用的又觉得质量不佳。后来发现很多小伙伴也有和我一样的烦恼，于是决定收集和整理我觉得好用英文字体推荐给大家。也欢迎大家关注我的主页，获取更多免费可商用的中英文字体资源。

夏花生的优设主页： https://www.uisdc.com/u/165152/home

如果你喜欢本期推荐的话记得点赞收藏，也可以转发给身边有需要朋友 。如果有关于本文或者设计的疑问，可以在评论区提出，我会第一时间为大家解答 ~

推荐阅读：

免费商用！15 款设计师必备的中秋海报标题字体（附下载链接） 大家好，我是和你们聊设计的花生~ 中秋将近，今天为大家推荐 15 款我精心整理的免费可商用字体，它们气质各不相同，质量也非常高，适合作为中秋海报设计的标题字体。

阅读文章 >

做字库超简单！字体设计神器Glyphs系列教程（上） 如果你想做出属于自己的字库？

阅读文章 >

近期因为工作调度，有时间去对车载 HMI 历史进行研究。文章主要从车载中控的诞生开始讲起，涉及最新的各大品牌车载 HMI 演变路线。汽车作为代步工具距今已有 130 多年的历史。

近期因为工作调度，有时间去对车载 HMI 历史进行研究。文章主要从车载中控的诞生开始讲起，涉及最新的各大品牌车载 HMI 演变路线。汽车作为代步工具距今已有 130 多年的历史。目前，在视觉范围内如此关注车载 HMI 的历史也只是近十年的事情，因为在过去，人们最注重的还是汽车技术的发展。但随着以交通安全为主的自动驾驶技术的不断发展，智能设计和交互设计的重要性才逐渐显现出来。

首先来科普一下 HMI （Human Machine Interface）的定义：在汽车领域的交互体验设计（Interation Disign），既然说到人机界面，我们先来看看作为交互设计的车载系统是如何演变的。

进阶教程：

6000字干货！四大章节掌握HMI车载设计指南（进阶篇） HMI车载设计成为当今的热门行业，本文通过HMI车载交互设计基础、需求分析的要点、创新的交互形式和视觉设计四大章节，帮你掌握HMI车载设计。

阅读文章 >

一、车载中控系统的演变 1. 以机械按钮为主的车载系统诞生

一般来讲，我们把车载中控系统分成两部分，一部分是与汽车驾驶直接相关的汽车驾驶系统，另一部分是与驾驶不直接相关的各类娱乐系统等。存在两者之间的有车载导航系统和各种与地理相关的功能系统，他们与驾驶操作本身没有关联。但汽车作为交通工具，现代人已经越来越离不开电子导航系统。

这些车载系统最开始应用到汽车上时的交互载体是按键和表盘。 接下来看看它们都是如何被加入到汽车上来的。

① 汽车驾驶系统

1886 年，卡尔·本茨获得燃气汽车第一项专利。世界上第一台汽车，除了三个车轮和一张简易沙发外，似乎看不到任何称得上内饰的设计，那会儿对于这样一台新兴的事物来说，它能开动就已经不错了。

真正的车载系统的诞生，应该从汽车界的老大哥福特 T 型车开始讲起。亨利·福特在 1908 年发明了 T 型车，还没有中控台面板的概念，仪表分布于车内外各个地方，所有的机械结构均裸露在外，甚至挡杆和手刹都被设计在车门外。

除此之外，亨利·福特赢得的另一场胜利是 与乔治·B·塞尔登的专利战。从未制造过汽车的塞尔登拥有“公路发动机”的专利，所有美国汽车制造商都以此为基础向塞尔登支付专利费。福特推翻了塞尔登的专利并打开了美国汽车市场以制造廉价汽车。换句话来说，今天我们普通老百姓能开上家用汽车，是托福特老爷子的福气。

② 汽车娱乐系统

1910 年，爱立信创始人拉什·马格拉斯·爱立信（Lars Magnus Ericsson）驱车在瑞典街道行驶，他将车停在路边，然后，他的妻子则拿出两个长杆，分别将它们钩在电话线上。爱立信则给电话机插上手柄，然后从运营商处获得信号，在车里进行通话。这便算是最早的车载电话。

时间来到 1922 年，雪佛兰与西屋公司合作，打造出了第一款搭载收音机的汽车。这在当时引起极大轰动，导致雪佛兰销量节节攀升。不过，车载收音机刚诞生的时候，也是遭受了很多的质疑，人们觉得它会影响司机的驾驶，甚至当时美国还出台了相应的法律来制约它。

后来雪佛兰重新设计收音机的操作逻辑，消除了美国政府的顾虑的同时，也实现了汽车领域早期的“盲操作”。

1930 年的意大利，一款名为：Iter Avto 的自动导航系统出现了，屏幕只有 5-7 寸的大小，在那个年代，没有人造卫星，甚至连电脑也还没有发明，更不会有语音提示了，它只是将纸质的路线地图，卷进一个小盒子，随着车辆的行驶自动展开。从当时的角度来看，这套导航系统相当神奇，这或许就是车载导航的雏形。直到今天，这项技术呢，仍然运用于汽车拉力赛中，只不过它换了个名字，叫“路书”。

早在 1986 年，别克公司就展现出了惊人的远见。在别克 Riviera 上搭载了第一个触控中控屏，这个搭载 GCC 的系统的 3*4 英寸触控屏，不仅能调节空调温度和收音机，还能显示车辆故障诊断、剩余燃油量和里程信息。

另外 80 年代盛行的车载电话也在这时被蓝牙所取代，伴随着空调系统、音响系统的完善，再加上车辆控制的功能越来越多，豪华品牌的中控台终于被各种按键排满，这样不仅看起来不够美观，使用起来也非常繁琐，甚至影响到了行车中的安全性，怎样简化中控，成为一个问题。

2. 车载系统跨入有屏时代—以中控屏作为信息交互枢纽

① 跨入有屏时代的关键节点

2000 年之后，车载中控屏随着 GPS 和电子后视镜技术的出现，以及当时苹果和三星推出的智能手机，这一次人们对这个新技术已经做好了准备，彻底跨入有屏时代，有屏的意义是什么呢？互联网传奇人物，凯文凯利曾经预言到：汽车将成第四空间，车机将成为继电视、电脑、手机后的第四块屏。

关键节点一，宝马为 2001 款宝马 7 系引入 iDrive 系统，其（非触摸式）中央显示屏的位置较高，紧邻仪表板，通过一个可以四向控制的主按键与几个快捷键，将 700 多项功能整合其中，大大的简化了中控台实体按键。随后各豪华品牌竞相推出类似的系统，随后实体按键与屏幕的组合占据了中控台的主要位置。

关键节点二，2012 年，特斯拉 Model S 的 17 寸中控竖屏横空出世，正如乔布斯当年推出 iPhone4 般惊艳，这可是在那些传统车型上从来没见过的新鲜玩意儿，它的出现让实体按键全部失去意义，标志着汽车内饰正式迈向一个新的时代。

② 车载中控屏的演变路线

随着自动驾驶的发展，通过观察各个品牌动向，我们可以预见未来汽车将朝着两个不同的方向发展。

一方面，汽车会依旧保留驾驶乐趣的体验，让驾驶者能够自主控制，“驾驶”将成为现代人的一种娱乐方式而得以保留；另一方面，汽车会作为一个高度智能的交通工具，为人类提供安全、高效的运输功能，人们用汽车从 A 点到 B 点，在途中可以完全沉浸在自己的世界里，做自己想做的事，这点类似于航天飞船的全自动驾驶系统。

车载中控屏会根据汽车的发展方向去发展，归纳总结一下近年来座舱屏幕的演变路线，主要有四大主线和其他支线：

主线一：传统派一一仪表屏和娱乐屏分列布置，均为小横屏; 主线二：双联屏派一一仪表屏和娱乐屏并列布置，均为横屏; 主线三：大竖屏派一一仪表屏和娱乐屏分列布置，娱乐屏是大竖屏; 主线四：大电视派一一仪表屏和娱乐屏分列布置，娱乐屏是大横屏; 支线一：由双联屏派衍生出的多连屏派; 支线二：旋转派。 传统派

顾名思义，传统派就是传统的车内屏幕布局方式。也是绝大多数传统汽油汽车的屏幕布局形式，传统汽车主要卖点在于驾驶乐趣，那么车载中控大屏完全就是一个多余的设备，车载中控小屏也仅显示极少的必要信息，车载中控大屏对于提升驾驶乐趣毫无用处，从现在的各类超级跑车、小钢炮、硬派越野上，都能得到佐证。

值得注意的是，类似奥迪的三块屏，下面一块屏幕其实是开关的替代，因此我个人仍然把它归为传统派。目前，仍在使用传统派布局的主流车企有：大众、丰田、本田、日产、马自达、奥迪...等

双联屏派

仪表屏和娱乐屏并列布置。真双连屏的创始者是 2013 年上市的上一代奔驰 S 级，并且当上一代奔驰的内饰语言得到广泛认可后，双联屏这一浪潮也对过内外车企产生了不小的影响。

很多的自主品牌开始偏向于采用奔驰的双联屏设计，就像在今年上市的长安 UNI-T 不仅外观吸睛，内饰采用液晶仪表盘和中控大屏组成的双屏联动也是科技感满满。此外，小鹏 P7、奔腾 T99 运动版等自主车型也都采用了双联屏的设计。而国外车企方面，通用、宝马.....也对双联屏爱不释手。

双联屏的主要优势在于两点，一是视觉冲击力强、二是有科技感

但在实际使用方面，双联屏也有两个非常大的缺点。

一是双联屏布局下的中控屏一般都是 14：1 的比例，很扁，这就导致在导航界面下能够显示的前方路线非常有限。

二是双联屏的中控屏位置其实是比较高比较深的，这就导致驾驶员在触摸操作时手的触及性并不好，经常需要向前移动身体，对驾驶安全有一定的影响。

而奔驰在使用双联屏的时候，其实中控屏是不能触摸的，都是依靠方向盘开关，或者下中控区域的触控面板来控制中控屏的内容。

所以说这方面，虽然国内的车企在智能座舱方面的整体实力都要强于海外企业，但是也暴露了部分国内车企在人机工程的 Know-how 方面有很长的一段路要走。

也正是基于以上两点原因，我个人预计后续采用双联屏设计的车企可能会越来越少，目前看来，短期内可能只有宝马在坚守。

大竖屏

仪表屏和娱乐屏分列布置，娱乐屏是大竖屏。大竖屏的开拓者毫无疑问是 2012 年上市的特斯拉 Mode S。

此后无论是造车新势力（蔚来、小鹏），还是积极拥抱变化的传统势力（沃尔沃 XC90、荣威 RX5）都不约而同的选择了大竖屏。

从体验上来说，大竖屏的优势在于：

面积比之前的所有类型的屏幕都大，可同时显示的内容多； 导航的布局非常好； 驾驶员触摸较为方便，开关进展的体验较好； 因此我个人认为，正是基于上诉这些原因，奔驰才在最新一代的奔驰 S 上抛弃了双联屏而采用了大竖屏。

与此同时，国内某些车型则是走了一些完全相反的道路....

当然了，大竖屏也并不是完美，比如：

大竖屏整体的布置位置较低，经常需要驾驶员低头； 播放视频时，大竖屏的利用率较低；

目前，仍然在坚持使用大竖屏的代表车企是蔚来，其新一代 NT2.0 平台仍然在使用与旧版 NT2.0 平台相同的屏幕布局。

大横屏

仪表屏和娱乐屏分列布置，娱乐屏是大横屏。与大竖屏一样，大横屏流派的开创者仍然是特斯拉（要不怎么说特斯拉在电动车领域的地位高呢）。

在我个人看来，特斯拉从大竖屏转变为大电视的原因主要是因为其在 Modle 3 和 Modle Y 上取消了仪表盘，需要依靠大电视的左侧区域显示驾驶信息。与此同时，大电视的布局虽然是横屏，但由于其面积大，在导航界面的显示体验总体也比较好，并且播放视频的利用率很高。

有人问，为什么新款 SX 并没有取消仪表屏，不再采用竖屏？

答案是竖屏并不利于车载软件适配。况且新款 SX 的车载娱乐系统算力高达 10 Tops，足以游玩一些 3A 大作。既然如此，中控屏做成像电脑显示屏那样的大横屏也是情理之中——总不可能有人觉得用竖屏、窄屏、小屏或不规则屏玩游戏会感觉到舒服吧？

总体来看，四条主流路线中，对于电动汽车，我个人认为大电视其实当前的最佳布局，燃油车的最佳布局则是大竖屏。

多联屏

在多联屏流派中，影响最大的当属是理想 One 了。

一般来说，典型的多联屏是在双联屏的基础上再增加一个副驾屏，有的车型还会怎加一块开关屏，从而组成一套完整的前排座舱交互系统。增加的副驾屏可以照顾副驾驶的娱乐需求，而增加的开关屏则可以解决触摸不便的问题。

但是双联屏遗留的对地图界面不友好的问题仍然没有能够解决，此外，多联屏最大的缺点就是贵。

相比之下，奔驰 EQS 的多联屏则是另外一种形态，更像是把仪表、大电视和副驾驶屏做成一体，解决了副驾驶的美观问题。

如果说，上一代奔驰 S 级的内饰是燃油车时代的美学巅峰，那么，EQS 自一出场就拥有这种底气，相信 EQS 的内饰也将成为大学汽车设计专业课堂上的模版典范。

旋转派

最后咱们来说说我个人眼里另类——比亚迪旋转屏

在到底是横屏好用还是竖屏好用这件事上，或许不同的人会有不同的答案，但比亚迪把单选题做成了多选题。

我可以转，你爱用哪种模式就用哪种模式。

但是，这不代表旋转屏就是完美的。

为了保证两种模式均不遮挡空调出风口，比亚迪只能把出风口布置在非常靠下的地方，导致空调吹脸效果受到很大影响。

二、新科技：HUD 抬头显示器 1. HUD 的诞生：从航空领域到汽车行业

HUD（Heads Up Display）抬头显示系统，作为一种综合电子显示设备，可以将车辆的信息，如车速、油耗、发动机转速、导航等，投影到前挡风玻璃上或其他显示介质上，供驾驶者查看，从而减少驾驶者因低头或视线转移而带来的安全隐患。

HUD 起源于航空领域, 1988 年通用汽车首次将 HUD 应用在汽车领域。2003 年，宝马成为欧洲车企中第一家配备 HUD 的公司，此后多家整车厂，如奔驰、奥迪、丰田、本田等，也开始推出装配 HUD 的车型。

随着 2020 年奔驰新 S 级推出业界首款量产 AR-HUD（增强现实型抬头显示系统），整个 HUD 市场再次按下加速键。

2. HUD 的发展现状：W-HUD 为市场主流，AR-HUD 初露锋芒

车载 HUD 经历三代升级，成像质量不断优化，信息量持续增加，科技感大幅增强。目前市场上 W-HUD 为主流，AR-HUD 加速落地量产。

第一代为 C-HUD（Combiner HUD），组合式抬头显示系统。C-HUD 采用半透明树脂板作为显示介质，具有安装便利的优点，但是成像区域小、显示信息少，由于 C-HUD 是以配件的形式加装在车辆上，在发生事故时容易对驾驶员造成二次伤害。

第二代 W-HUD（Windshield HUD）风挡式抬头显示系统，是目前应用最广泛的 HUD，已经实现量产。W-HUD 利用光学反射将行车信息投射到汽车前挡风玻璃上。W-HUD 较 C-HUD 显示范围更大、投影距离更远。

第三代 AR-HUD（Augmented Reality HUD）增强现实抬头显示系统，是一种全新的抬头显示技术，和传统的 W-HUD 相比，AR-HUD 投影范围大、信息量多，可以更好地结合 ADAS 采集到的数据，进行场景融合，通过数字图像与真实场景的叠加，增强 HUD 的实用性和科技感。

接触过 AR 成像技术的读者可能知道，目前行业主流的 AR 成像技术普遍存在重影眩晕、画面较小、强光倒灌难以看清的小问题，市面上做的比较好的 AR-HUD 是是奔驰和华为。

虽说市面上的 AR-HUD 仍显鸡肋，但随着以交通安全为目的自动驾驶得以普及，HUD 就会变得更加可有可无。毕竟如果不用依靠表面上的显示信息，在无需花费全部的注意力的情况下，系统就能在无形之中助力驾驶，对驾驶人来说是更理想的选项。

三、汽车大脑：车载操作系统 在汽车智能化时代，汽车的动力、内饰与机械性能不再是评估汽车好坏的核心标准，取而代之的是汽车大脑车载操作系统。

根据佐思汽研公布的报告，广义上的汽车操作系统分为四类，分别是手机映射系统、ROM 型汽车操作系统、定制型汽车操作系统以及基础汽车操作系统。

1. 手机映射系统——Android Auto、CarPlay

很容易理解，就是打开手机，通过有线、无线连接车载大屏，将手机中的地图、音乐、社交、语音软件投射到汽车大屏中，可以满足用户多样化需求。车主们常用的 CarPlay、Carlife、Hicar 都属于这一类。

在目前已知的车载系统中，手机映射普及率相对较高，只要有汽车大屏与无线功能的汽车，几乎都可以使用手机映射系统。

2. ROM 型汽车操作系统——小鹏与蔚来以及宝马、奔驰等

通常情况下，像在手机操作系统中的小米 MIUI 一样，在基础操作系统的平台上定制 UI 与个性化功能。造车新势力中的小鹏与蔚来，以及宝马、奔驰等国际品牌，纷纷选择该思路。

汽车底层操作系统主要有 QNX、Linux、安卓以及阿里巴巴旗下的 AliOS。这些操作系统包含系统内核、底层驱动等底层组件，等同于手机操作系统中的 iOS、安卓。

3. 深度定制车载操作系统——小度车载 OS

如今，不少汽车系统还可以深度定制，修改系统内核、实现座舱系统以及自动驾驶平台等。小度车载 OS 就属于深度定制车载操作系统。

手机除了屏幕就没有更多显示终端，可汽车不一样，有电池组、发动机、车窗、车门、方向盘等诸多组件，所以需要深度定制。

4. 国产车载系统，群雄纷起

从基础功能上来看，汽车操作系统其实只有三类，分别是基础系统、定制系统与深度定制系统。在这三大类别中，有许多国产操作系统存在。它们仿效鸿蒙系统，试图在车载系统中打出一片天。

① AliOS

十年前，中国三大互联网公司百度、阿里巴巴、腾讯作为这波汽车操作系统国产化浪潮中的领头羊，其中最早开始研究的当属阿里巴巴，AliOS 的历史最早可追溯到 2011 年。

那时候，鸿蒙系统尚未诞生，苹果 iOS 系统、安卓系统与 Windows Phone 在手机操作系统领域三分天下。阿里巴巴抱着打破垄断的念头，毅然进入该领域，推出 YunOS 操作系统。只可惜由于系统使用人数过低，以及与安卓系统的抄袭纠纷，最终被迫放弃开发。

一个失败的手机操作系统，该如何处理研发团队？阿里巴巴想到的法子是转型，向整个物联网领域扩展，把汽车视作了一个重要的物联网切入点。于是在 2016 年，阿里巴巴与上汽集团合作成立了新公司斑马智行，而 YunOS 也摇身一变改名 AliOS，开始在汽车操作系统中大展拳脚。

② 小度车载 OS

与 AliOS 离奇的身世相比，百度旗下的小度车载 OS 诞生历程相对简单。从五六年前开始，百度就不满足于搜索业务，全力进军 AI 相关产业，而智能汽车正是 AI 重要的落地场景。百度 Apollo 是向汽车行业及自动驾驶领域的合作伙伴提供的软件平台。

小度车载 OS，就是智能车联开放平台（Apollo ）的外在形式。囊括了几百家生态合作伙伴，支持上千个车载小程序，智能语音助手连接万物，百度的车载系统在底层系统并未做多少改变，核心在于定制化服务以及个性化交互。

③ 腾讯车载小程序

腾讯小程序是一套跨 OS、云端轻量化的车载应用开发框架，基于微信小程序的基础，能够让 300 万量级的微信小程序生态以更低成本、更快速地上车。简单来说，腾讯希望通过自己海量的小程序优势，通过数量优势战胜对手，在车载系统领域打造全新的超级 App。

④ 华为 HiCar

阿里、百度、腾讯，切入方式不同，带来的车载系统生态也各有特色。然而，它们并不是最有希望取得成功的国产车载操作系统。因为，华为也来了。

华为觊觎智能汽车市场多年，一开始华为推出了手机映射系统 HiCar，HUAWEI HiCar 将移动设备和汽车连接起来，把手机的应用和服务延展到汽车，实现手机为核心的全场景体验，给消费者创造智慧出行体验。据介绍，华为 HiCar 运用了很多鸿蒙系统的设计元素，某种程度上可以理解为鸿蒙的初级形态。

华为鸿蒙车机的主界面由多个卡片式小组件构成，显示的是推荐使用的应用程序与场景。至于鸿蒙系统广为传播的分布式能力，华为支持车机与智慧家庭联动。在车上轻轻一点，家中的智能家居产品也会随之运动。

在原理上，华为鸿蒙车载系统基于 Linux 核心打造，属于定制型车载系统。不过，随着华为与长安和宁德时代共同打造的阿维塔推出，华为鸿蒙系统正在朝着深度定制系统迈进。接下来，拥有智能座舱、与自动驾驶系统联动的鸿蒙系统或许会给我们带来惊喜。

四、6 大车载系统开源地址 Android Auto： https://developers.google.com/cars/design/android-auto ios Carplay： https://developer.apple.com/design/human-interface-guidelines Apollo (设计系统暂未开源)： https://developer.apollo.auto/document_cn.html AliOS： https://miniapp.alios.cn/index#/document 腾讯车载小场景： https://cloud.tencent.com/developer/article/1377214 华为车机： https://developer.huawei.com/consumer/cn/doc/distribution 最后我想说，从阿里到华为，他们已经向世界证明了中国制造。

当前全球汽车产业目前已进入产品价值被重新定义的全新阶段，各种类型的车载系统方案暂时也无法评估优劣。但随着自动驾驶技术的不断发展，以人为本的用户体验成为决定产品成败的关键因素，如何让消费者感受到与众不同的体验成为产品开发工作中的重中之重。

车载设计万字干货！从零开始帮你学会 HMI 可用性测试 前言 这篇文章针对车载行业的可用性测试，我们做一下深入探讨，前面几篇跟下来的读者也都知道我写作的节奏，前面会深入讲解该主题的基础内容，并结合一些我工作中实际案例给予大家去了解，后半部分以实践案例为主，将前面基础知识融入进来，结合案例进行剖析可用性测试，这次文章大纲分为三大内容：可用性基础

阅读文章 >

车载设计万字干货！帮你掌握 HMI 设计的知识体系 这是我第一篇HMI系列的文章，对于车载的热爱，我的想法就是多去分享一些行业知识，接下来让我们一起追光吧 ～ 拓展阅读：

阅读文章 >

提到按钮，大部分人印象就是文字加个背景框，并没有太多需要设计的空间。但是作为 B 端设计师，相信很多同学在工作过程中都产生过以下问题：按钮作为最基本的交互单位之一，几乎在每个页面中我们都会使用到。由于不同行业下业务场景的复杂性，很多时候很难直接参照其他产品的按钮进行复用，也无法用一套布置方案复用所有场景，所以作为...

提到按钮，大部分人印象就是文字加个背景框，并没有太多需要设计的空间。但是作为 B 端设计师，相信很多同学在工作过程中都产生过以下问题：

按钮作为最基本的交互单位之一，几乎在每个页面中我们都会使用到。由于不同行业下业务场景的复杂性，很多时候很难直接参照其他产品的按钮进行复用，也无法用一套布置方案复用所有场景，所以作为 B 端设计师需要对按钮控件具备足够的认知，理解其背后的使用逻辑和规范，才能满足多层级跨场景的设计需要。

本文结合自身的工作经验，对按钮进行了系统性的整理和总结，希望对各位 B 端设计师同学的日常工作和学习有所帮助。

更多 按钮设计 干货：

万字干货！3个维度帮你有理有据做好CTA按钮设计 任何设计师都曾经与 CTA 按钮打过交道。

阅读文章 >

一、按钮的发展历史 在详细介绍按钮前，我们先简单了解下按钮的发展历史。按钮的概念起初是源自现实物理世界的实体按钮，在日常生活中如电源开关、计算器、电话等都是通过实体按钮进行控制，由于其简单直观易操作的特性，即使如今各种电子产品都逐渐发展为触控屏操作，实体按钮依旧被保留了下来。

当数字屏诞生后，人机交互设计开始走向数字屏幕后，为方便用户理解，在很长一段时间内设计师都是采用拟物风按钮来暗示用户可执行的操作。伴随着客户端设备升级和开发方式的变更，至 2013 年 Apple 在 iOS7 上第一次采用了扁平化设计，至此按钮样式开始往扁平化发展。随后历经了多年发展，按钮的样式开始层出不穷，但是无论样式如何变更，其背后的体验交互逻辑依旧是物理世界按钮的映射。

二、什么是 B 端中的按钮 1. 按钮的定义

在 B 端设计中什么样的组件可以定义为按钮？我们先来看看国内外设计系统中对按钮组件的定义：

总结来说，按钮可以理解为用于承载即时操作和命令的组件。由于 B 端产品业务逻辑复杂、页面流程多，相较于传统意义上的按钮，B 端中的按钮被设定为可复用、规范化的组件，通过对组件元素进行拆解、归纳、重组，将其划分为特定类型的组件方便管理和使用。

按钮相较于输入框、选择器、单选框等控件无法进行数据输入，相较于标签、文字提示等控件也无法进行信息浏览，其关键在于「即时性」和「承载操作」，既可单独完成操作，也可与其他控件联动，作为触发操作的行动点。

2. 容易与按钮混淆的控件

① 标签 Tag

虽然同样翻译为标签，但是此处指的是 Tag 标签，而非 Tabs 标签页。标签在样式上与按钮几乎相同，且同样可以添加图标标识和触发操作。两者的区别在于，标签侧重于信息的选择、筛选和分类，而按钮则只是单纯用于触发即时操作，因此很多时候标签会设置不同颜色样式以便信息区分。

② 开关 Switch

和其他录入控件相比，开关 Switch 最显著的特点便是和按钮一样触发后立即生效，因此很多初级设计师很容易将其与按钮归为一类。

其区别是，开关承载的是两种互斥状态的切换，如打开/关闭、显示/隐藏、启用/禁用等，此外由于在视觉上符合用户对现实世界中开关的认知，所以可以直接展示当前项的状态。

③ 单选/多选框 Radio/Checkbox

单选框和多选框一般用于状态标记，但是无法直接触发操作，所以通常会和按钮配合进行使用。最常见的搭配场景便是在登录页，用户勾选「记住密码」或「自动登录」后标记其状态，再点击按钮进行登录。

三、按钮的原子拆解 相较于其他组件，按钮的元素构成较为简单，分为内容层和容器层，通过将不同元素进行搭配组合，即可设计出不同类型的按钮类型和按钮状态。

内容层：图标和文字自由组合。内容层作为操作引导的核心必须存在。 容器层：控制颜色、圆角、描边、投影等样式，有些设计系统下还会加上交互动效，提升用户体验感。

四、如何区分按钮类型

在查阅大厂的设计规范时，相信以下按钮名称大家应该都不陌生：主按钮、悬浮按钮、图标按钮、危险按钮、下拉按钮、文字按钮、CTA 按钮……很多新手设计师会产生疑惑：

为什么要划分如此多的按钮类型？ 这些按钮间的区别是什么？ 为什么各家设计系统下按钮分类都不相同，我应该选择哪种作为参考？ 为了区分好按钮类型，关键要先明确类目划分的边界。这里为了方便大家学习，我从按钮的强调程度和使用场景 2 个维度将按钮进行划分，基本涵盖了常见的按钮类型：

1. 依据强调程度划分

在同一个页面中往往会存在多个行动点，因此需要将按钮依据强调程度进行划分，确保用户可以依据设计的按钮层级快速找到最需要操作的按钮。常见的按钮强调程度可以分为 3 个层级：

高度强调：承载页面上最重要和突出的行动点。为了保证视觉层级最高，通常会采用大面积主色填充或投影增加空间层级的方式进行区分，例如主按钮和 FAB 按钮（悬浮按钮） 中度强调：承载仅次于最重要行动点的常规操作。为了避免太过吸引用户注意，通常采用中性色进行描边或填充，也被称之为次按钮。 轻度强调：对页面中其他操作补充或可选操作。为了确保视觉上不凸显，通常不会填充背景色，常见于文字按钮和图标按钮。在轻度强调中还可以划分为弱强调（内容填充主色）和不强调（内容填充中性色），由于文字按钮填充中性色难以和正常文本进行区分，所以一般内容填充中性色只会用在图标上。 由此我们得到了依据强调程度划分的几个常见按钮类型：主按钮 > 次按钮 > 文字按钮 > 图标按钮。接下来针对每种类型我们来展开说明。（FAB 按钮在 B 端页面中属于特定场景下使用的按钮，不具有通用性，故划分到使用场景中进行讨论）

① 主按钮 Primary

主按钮代表着页面中的核心操作项，是视觉权重最高的按钮，常用于突出提交、完成、确定等操作。为吸引用户注意，常使用品牌色填充背景引导用户视觉焦点。关于主按钮的使用需要遵循以下 2 个原则：

在一个焦点任务中最多只使用一个主按钮。同时存在多个主按钮会让用户失去操作焦点，造成信息干扰。

主按钮并非必须使用。如果没有必须突出的操作项，强行添加主按钮反而会打破按钮间的层级关系。

② 次按钮 Secondary

次按钮是使用最频繁的按钮，当在页面中不确定选择哪种按钮时，使用它往往是最安全的。次按钮通常使用中性色，其样式可以分为描边型和填充型：描边型使用最为广泛，是次按钮首选的样式，而填充型相对特殊，在不同设计系体下会根据业务场景选择是否使用。

关于填充型次按钮

相较于描边型，早年在 B 端产品中很少会见到使用填充型样式作为次按钮使用的，但是可以发现近几年国内外设计系统如 Arco Design、Marterial 等，开始陆续将填充型次按钮纳入到按钮组件库中。

填充型次按钮更多的使用场景是在移动端上，其视觉强调程度弱于主按钮但又高于描边型，可以更好的表达组件的整体性和吸引用户注意。

伴随着硬件设备的发展，桌面端和移动端的操作边界开始逐渐模糊，各产品开始追求全生态环境下的统一性。为降低用户在设备切换时的体验隔阂，一套设计系统需要能同时满足多端设备的兼容，而填充型样式更符合其场景需求。最典型的便是 iPadOS 连接鼠标操作时，悬停态下填充型按钮明显比描边型更容易被识别。

如何选择次按钮的样式

基于以上考虑，在工作中选择次按钮样式时可以参考以下建议：

如果当前项目上已经有在使用的开源库，尽量以原有组件库为主。除非自身产品有设备互通的场景或需要同一套设计语言兼顾不同端，否则增加多余的次按钮样式只会更加复杂且影响用户的体验一致性。 如果是项目是 0～1 搭建组件库，根据自身业务场景选择其中一种样式使用即可。一般桌面端产品使用描边型，如果产品生态中有移动端，为了保持设计语言的统一更建议采用填充型。 此外还需考虑前端修改组件库样式时的开发成本。 ③ 文字按钮 Text

文字按钮适合承载如取消、还原等无需特意强调的操作，通常使用在表格操作栏、表单页等场景。为了和普通文本做区分，提示当前内容可交互，需要加上链接色（一般是蓝色）提醒用户。

文字按钮和链接的区别

文字按钮和链接（Link）的默认样式一致，在搭建组件库时很容易发生混淆。其区别在于按钮用于发起动作，触发相应的业务逻辑，而链接的作用是导航，作为页面跳转或锚点定位的触点。为了更好地区分，可以在交互样式上进行处理：

文字按钮：指针悬停时容器添加背景色。 链接：指针悬停时文本添加下划线。

④ 图标按钮 Icon

图标按钮的视觉层级最弱，但是由于占据空间小，常用于同时展示多个操作项时使用。由于缺少文字解释，单纯的图标可能会造成用户的理解偏差，故建议在指针悬停时加上 Tooltip 的文字提示进行辅助说明，对于特定操作还可加上快捷键指引。

2. 依据使用场景划分

在依据强调程度划分的基础上，还有部分按钮只应用于在特定的业务场景中，所以各设计系统下的按钮分类会有所不同。以下按钮的应用场景较为频繁，故被单独划分为一类方便交流和管理。

① 功能按钮 Function

功能按钮顺应用户心智，采用绿色、橙黄色、红色代表了成功、警告、危险三种功能按钮，用户无需浏览按钮内容，直接通过色彩即可识别当前操作可能导致的后果。

由于功能按钮的视觉权重往往比主按钮还高，在页面中需谨慎使用，避免对其他页面信息造成干扰。

② 虚线按钮 Dashed

相较于普通的描边型按钮，虚线按钮只承载传输文件或新增配置项等操作，为方便用户感知，将其描边设计为虚线样式。

上传 Upload

由于虚线按钮只能支持单纯的触发操作，在很多上传情景下不能满足其业务需求，故逐渐衍生出单独的上传组件，相较于虚线按钮：

上传组件支持批量上传 通常有更大的交互区域且允许支持拖拽上传，以降低用户的操作门槛 搭配展示文件列表，用于对已上传文件进行预览、重新上传、删除等操作

③ 幽灵按钮 Ghost

顾名思义，幽灵按钮不具备实体性，一般底色为透明，其按钮的内容反色，通常使用在复杂或颜色较深的背景中，例如 banner 图、官网首图等，避免按钮突兀地破坏背景的整体性。由于幽灵按钮使用的场景不固定，因此无须严格遵循现有规范，只要满足其特定场景下的业务需求即可。

④ 行为召唤按钮 CTA

CTA，即“Call to Action”的缩写，意思是行为召唤。该词原本是营销领域的术语，后来逐渐引用至互联网领域中，即目的在于给用户一个明确的反馈：当前事件的操作流程已经完成或即将发起一个新的流程。

CTA 按钮之所以会被单独归类，因为当按钮作为吸引用户采取点击行为的载体时，时常在事件操作的最后一步出现，作为产品的关键触点之一，可以有效提高页面或屏幕的转化。也因此当页面中存在多个按钮时，CTA 按钮的优先级往往是最高的，可以通过色彩对比、元素点缀等方式引导用户点击。

⑤ 悬浮按钮 FAB

悬浮按钮 FAB，即 Floating Action Buttons 的缩写，其特点是会始终悬浮在页面的固定位置，不会随着页面滚动而消失。

在 B 端产品中，FAB 按钮更多的使用场景是承载全局性的附属功能，常见操作包括咨询、客服、快捷键、点赞、收藏、分享、回到顶部等。在设计 FAB 按钮时需注意以下要点：

不能干扰用户在当前页的正常操作和浏览。尽量放置在页面的固定位置，当操作数过多时可将其他操作下钻至更多按钮中。 承载操作须是当前页的全局操作，无须与其他页面元素发生联动即可触发。如不能承载保存、删除、清空等操作。

⑥ 下拉菜单 Dropdown

按钮组不是单独的按钮类目，而是按钮组的集合体，当多个同级操作项同时出现，但不想占有太多页面空间时使用。通常按钮组会将最关键的主操作露出，其他操作收入更多操作项中。

严格来说 下拉菜单 Dropdown 并不属于按钮类型，但因为其使用场景较为频繁且时常用来承载多个按钮操作，故在此处作为单独类型进行讲解。下拉菜单作为操作命令集合使用时，可以简单理解成按钮组：将多个操作按钮收纳到同一菜单下。在使用时有两点需要额外注意：

和选择器 Select 的区别

选择器 Select 属于录入控件，在基本形态上和 下拉菜单 Dropdown 高度相似，都是通过下拉浮层来容纳更多信息，在实际应用时经常容易被混淆。要区分两种组件，最关键是理解其使用场景：

下拉菜单：当页面上的操作命令过多时，用此组件可以收纳操作元素。核心是菜单导航和命令集合 选择器：用于一组选项中选择一个或多个数值。核心表单填写和数据筛选 样式与操作项的关系

当下拉菜单用来承载操作项时，各操作项关联性也会引起下拉菜单样式上的区别，这里用实际的案例辅助大家理解：

乍一看似乎都是差不多的样式，在工作中很多设计师也是随机选择其中一种进行使用，但是作为设计师，就是应该从细节之处见真章，每一处设计都应有理有据。

简单来说，以上三种组合按钮中的操作关联性是逐渐疏远的，这一点从按钮样式上也可以看出。

新建一：合并同类项。突出新建操作本身，更多操作项是新增的数据类型进行区分，减少重复文案的出现。 新建二：操作延展。强调的是数据导入的形式，提供更多操作渠道供用户选择。 新建三：信息收纳。各操作项之间并没有关联性，只是缓解空间压力或突出使用最频繁的操作。

五、按钮的交互状态 在了解了以上按钮类型，我们来看看按钮的交互状态。不管哪种按钮类型都会存在相应的交互状态，设计师在交付设计稿时需要将不同状态下的按钮样式进行标注，方便前端开发。

在刚开始接触按钮时也曾被一堆状态给乱花了眼，光是理解不同状态的区别已经头大。其实回头来看，开始只要记住 4 种最关键的按钮状态便可满足大部分的使用场景，即按钮的正常态、悬停态、点击态和禁用态。

在日常工作中，没有设置聚焦态和加载态并不会影响用户的正常使用，但是加上后可提升用户的产品使用体验，大家可以根据开发成本和实际的业务情况考虑是否加上。

1. 正常 Normal/Default

按钮的初始状态，即默认情况下的基础样式，此处不多做介绍。

2. 悬停 Hover

当鼠标指针移入按钮时的状态。为了暗示用户鼠标指针已进入按钮的可交互区域，按钮相较于正常状态在背景色彩等样式上会有明显的区别。悬停态通常还会配合鼠标指针变化辅助用户理解，在前端 CSS 样式表中常用 cursor:pointer，指针变化为伸出食指的手。

由于悬停态是由鼠标指针移动引起，故只有设计桌面端产品时需要考虑到，而在移动设备上通过手指操作故按钮不存在悬停的状态。（在 iPadOS 更新至 13.4 版本后开始支持连接键鼠操作，但是在日常工作中很少会出现，此处不予以讨论）

3. 激活/点击 Active/Press

鼠标点击即按下按钮时的状态。激活态是在悬停态基础上发生变化，鼠标指针样式和悬停态保持一致，按钮背景色发生变化，提示用户已触发点击操作。

4. 禁用 Disabled

按钮无法操作被锁定时的状态。该状态是为避免用户误操作而设立，如在登录页未完成信息填写时将提交按钮禁用，提示用户无法点击，只有填写完必填字段后才可以点击提交。在鼠标悬停时指针变化为禁用状态，在前端 CSS 样式表中常用 cursor: not-allowed，通常会配合 tooltip 文字解释说明行动点不可用的原因，避免用户疑惑。

值得一提的是，禁用按钮并非只有置灰一种样式，只降低色彩饱和度和明度也是禁用按钮的表现手法之一，且相较于置灰更方便用户识别主次按钮。

以上是针对不同按钮状态的说明，这里并没有针对不同状态的样式进行详细说明，因为不同的设计体系下可能会采用不同状态样式进行展示。为方便对比，这里将常见组件库中的按钮状态进行了整理：

可以发现，除了 TDesign 中描边按钮激活态下增加了中性色填充外，基本按钮状态都是保持着一致的梯度变化。这里以正常态的按钮样式为基准，将悬停和激活状态下的色彩变化进行整理：

总结来看，在不同色彩的按钮上按钮状态会按照不同梯度分布：

主色（品牌色）按钮色彩梯度从浅到深：激活 〉正常 〉悬停 中性色按钮色彩梯度从浅到深：激活 〉悬停 〉正常 之所以出现这种情况，主要是因为在搭建产品色彩体系时，品牌色一般会采用色板中间色作为主色（通常是第六个颜色），故不管往浅往深都有更多灵活调整的空间。而背景使用的中性色为了避免干扰视觉层级，通常选择色彩较浅的中性色，因此没有再往下延伸色彩梯度的空间。

以上介绍的四种状态建议采用色彩组件库中色卡进行配色，上图标注了不同按钮状态的 配色 选择，下面是 AntD 和 ArcoD 的色板生成工具地址（关于产品取色未来会专门出一期文章进行讲解）。

ArcoDesign Palette 色彩工具： https://arco.design/palette/list

Ant Design 色板生成工具： https://ant.design/docs/spec/colors-cn#色板生成工具

5. 聚焦 Focus

该状态用于指示电脑光标的位置。在有些场景下不操控鼠标，只通过键盘方向或 Tab 切换选择页面元素进行操作，反而是更高效的操作方式。常见的聚焦态按钮样式为增加描边，有的设计系统下会采用和悬停态一样的样式。键盘操控快捷键推荐：

「Tab」前进 「Shift + Tab」后移 「Enter」激活

6. 加载 Loading

表明用户操作后系统正在处理的状态。由于服务器响应或网络延迟等问题，有时候用户操作完需要间隔一段时间才能响应，加载态可缓解用户的焦虑情绪，避免用户由于未收到反馈而反复操作的情况。

六、按钮设计需考虑的因素 接下来便到了本文的最关键部分，也是按钮设计中出现最频繁和令人头痛的问题：我的按钮究竟应该放在哪里？

在此之前先要理解按钮设计的目标是引导用户采取我们希望用户采取的行动。这就需要尽量帮助用户快速找到需要操作的按钮并了解执行该操作的结果，同时尽可能避免误操作。基于以上目标，我们从用户实际操作路径的视角来梳理按钮设计时应考虑的问题：

按钮区在页面中的什么位置——空间位置 有多个按钮时采用怎样的阅读顺序更合适——排列顺序 按钮采用怎样的样式更合适——视觉样式 1. 按钮区的空间位置

当用户进入页面时，除了浏览当前页的信息内容还需要寻找接下来可执行操作的可交互区域，即按钮区。除了单纯通过视觉差异区分按钮和页面其他元素外，还需考虑到用户在信息浏览过程中的视觉动线。结合古腾堡法则和格式塔原理，给出以下设计建议：

① 放置在用户的浏览路径中

在没有其他视觉效果引导时，F 型和 Z 型网页浏览模式可以作为用户视觉动线的基础指导，关于以上 2 种浏览模式网上有太多相关介绍，此处就不再赘述。

② 尽可能靠近其所控制或联动的对象

将关联性强的信息放在一起，可以降低阅读成本，提高用户的感知效率。

2. 多按钮的排列顺序

① 保持用户的操作惯性

这里先讨论一下开头提到的问题：主操作项放在左边合适还是右边合适？我们先来看看一些案例：

可以发现，即使是业内顶尖的互联网公司也并没有遵从同一套确定方案。对于新用户而言，确定按钮的位置对操作时间和错误率影响并没有太大差别。并由此得出更关键的结论：不要轻易改变当前产品中用户已经习惯的按钮位置。

在此基础上对于操作项不固定的页面，给大家整理了以下建议：

② 同类操作项按组分类

最典型的案例便是编辑器类产品的操作项，将同类操作区整理分组，方便用户查找。

③ 阅读顺序符合操作预期

此处的阅读顺序并非特指从左往右、从上往下，而是依据用户当前视觉动线，优先满足用户预期或操作可能性最大的按钮需要最先被用户发现。

考虑到人体工程学操作习惯和操作后果的影响，还需注意一些特定的场景：

④ 流程操作遵循方向认知习惯

流程属性的按钮如上一步、返回、后退等操作用户习惯在左边，而下一步、前进、更多等操作在右边。

⑤ 破坏性操作提升操作门槛

如删除或清空按钮，尽可能放置在远离主按钮的位置，甚至可以下钻至更多按钮中，避免误触。

3. 按钮的视觉样式

在文章开始基于强调程度划分按钮类型时，按钮的视觉样式便是基于其强调程度划分的，页面中越是需要强调的按钮其视觉权重越高。前文中只划分了主按钮、次按钮、文字按钮、图标按钮这 4 种基本类型，此外还可以通过文本粗细、内容量等方式进一步细分。

七、关于按钮的其他问题 1. 按钮的尺寸

按钮的尺寸优先体现在其高度上，而宽度一般根据内容区大小自动适配。通常会将按钮分为大、中、小这三种规格，以满足不同场景下的使用需求。

高度

大尺寸：通常使用在企业官网、账号登录、导航菜单等场景中。一般高度设置为 40～64px。 中尺寸：按钮的默认尺寸，适用在 B 端页面的大部分场景。一般高度设置为 28～40px。 小尺寸：常用于气泡弹窗等小型控件中。一般高度设置为 12～28px。 宽度

关于按钮宽度需要注意的是，由于按钮内容的不固定，同规格按钮可能因为内容量差异引起视觉上的层级误判。故为了减少按钮错综不齐的情况，建议设置按钮最小宽度的界限，一般为 4 个文字+左右内边距。

2. 按钮的文案

相较于其他方面，似乎大家对产品文案总是保持着“点到为止”的态度，但是并不意味着文案不重要，错误的文案会让用户产生疑惑，严重影响用户体验。相反好的按钮文字甚至可以做到即使不去阅读上下文，单凭按钮文案即可做出正确的判断。在一些关键节点的 CTA 按钮，文案的优化可以带来转化率大幅度的提升。因此关注文案细节也是设计师平时需要考虑的问题。优秀的按钮文案包含以下几个要点：

① 内容简洁，删除赘词

按钮区域寸土寸金，每一个字都要有其存在的意义，如果删除也不影响信息表达即没必要存在。

② 表达清晰，避免产生歧义

文字表达清晰，避免使用用户难以理解的专业术语。

③ 规范用词，不要出现错别字

常见的“登陆&登录”、“收获&收货”、“即时和及时”都是容易打错的词。

下方给大家整理了 常见易错的按钮文案表，建议保存收藏。

④ 一致的语法表达

如统一采用动宾结构：修改价格、提交工单、查看更多等。

⑤ 适当的情感化表达

结合自身品牌特性，在按钮中融入适当的情感化文案，也是塑造品牌心智的触点之一。

3. 按钮的圆角

当前市面上主流的互联网产品大多都采用了圆角设计，因为圆角矩形相较于直角更具安全感和亲和力、在相似内容中识别度更高，且圆角对信息的聚焦性更强。同样 B 端设计中通常也会在按钮中加入圆角，方便用户更高效的辨别和获取信息，但是需要注意的是圆角并非越大越好，过大的圆角会导致按钮操作热区的缩窄，更不易被点击触发。如在移动端产品上都是采用手指按压，而桌面端采用鼠标指针单击，相较之下后者对点击按钮的触发精度要求更高，也因此全圆角按钮（也被称为胶囊按钮）更适合在移动端产品上使用。

此外按钮的圆角设置还需考虑到产品整体的视觉一致性，在不同场景下都要保证统一的感官体验，如在大尺寸的按钮上圆角的曲率也应设置更大。

8000字干货！超全面的 Web 端按钮设计指南 按钮是设计界面中常用且重要的组件之一，它在页面中占据的位置不大，却承载着重要的交互操作。

阅读文章 >

参考链接

https://mp.weixin.qq.com/s/81Xbb2zEHqJS2bABY32ztQ https://www.zcool.com.cn/article/ZMTI3MzkzMg==.html https://www.uisdc.com/button-application https://www.zcool.com.cn/article/ZMTI2MzUwMA==.html https://www.yuque.com/yovar/bq79sy/ufeuex https://uxmovement.com/buttons/why-ok-buttons-in-dialog-boxes-work-best-on-the-right/ https://www.woshipm.com/pd/3104897.html

无论是刚过去的双 11 还是昨天的双 12，只要打开电商网站，细心的设计师应该都会发现，3D 场景已经成为当下势不可挡的潮流了。优设老师小毅作品作为 3D 设计的老牌工具，C4D 曾经是很多人的学习首选。但正版近 2 万的售价和苛刻的硬件要求，也让越来越多的人开始选用免费且硬件要求更低的 3D 设计新秀神器：Bl...

无论是刚过去的双 11 还是昨天的双 12，只要打开电商网站，细心的 设计师 应该都会发现，3D 场景已经成为当下势不可挡的潮流了。

优设老师小毅作品

作为 3D 设计的老牌工具，C4D 曾经是很多人的学习首选。但正版近 2 万的售价和苛刻的硬件要求，也让越来越多的人开始选用免费且硬件要求更低的 3D 设计新秀神器：Blender。

对普通的 UI 和视觉设计师而言，Blender 无疑更适合作为 3D 设计的工具：

多平台通用：Mac/Windows 双平台，Mac 用户无需额外购买主机 轻量化免费：对硬件要求低，安装包仅 230M，创作的作品可自由商用 3D 创作功能强大：绝大部分 3D 设计需求，都能通过 Blender 实现 渲染速度更快：Blender 自带渲染器速度很快，适合快速出图 当然，相比 C4D，Blender 的缺点是教程较少，遇到一个难题，有可能耗费一下午才能找到答案。

现在这个问题的系统解决方案来了！

优设联合京东高级视觉设计师小毅，耗费大半年的时间精力，打磨出这一套可能是目前性价比最高的 Blender 零基础直播课程！

课程原价 699 元， 限时特惠价 599 元！ 之后立刻恢复原价！

手机扫码报名，网页端右戳报名 ? https://pro.uisdc.com

一、循序渐进，零基础也能轻松上手！ 3D 设计看似复杂，但只要掌握了正确完整的学习流程，也可以在短时间内快速上手。而一个拥有多年 3D 创作经验的设计师，无疑是你学习路上的绝佳帮手。

在课程设置上，Blender 系统直播课会从软件基础开始，帮你快速熟悉界面后，从一个小元素入手，用简单轻松的方式，创作出你的第一套 3D 作品，相信我，那一刻的成就感会让你有百倍信心跟完这门课！

之后课程逐步进阶，从中型场景到大型场景，每一步都增加了难度，但又控制在可接受的范围内，帮你实现 从零基础到 Blender 3D 创作达人的平滑过渡。

学员熊猫反馈

学员 C 反馈

为了让你的基础更牢固，老师还额外录制了价值百元的 Blender 基础课，报名即送！

更详细的课程安排，可以看这份大纲：

二、有问必答，保姆级课程服务 无需再担心问题一直找不到答案了。参加课程后，遇到任何问题，老师和助教都会在群里解答。而且你的每一份作业，只要按时完成，都会在课程周期内得到老师的点评建议，甚至直接上手帮你修改源文件。不用担心自己在原地踏步，在这套课里，你的进步，我们帮你看见。

学员萌该皮不皮反馈

三、第二期重磅升级！ 课程采用全新的直播上课+录播课点评的形式，直播形式让大家上课时有问必答，录播点评作业形式能让老师抽出更多时间为大家仔细讲解，同时会收取同学们的作业源文件，老师直接上手修改，为你展示更合理的优化方法！

在课程排期上，由于上期有同学反馈作业时间不够，这期整个课程周期拉长，大作业的时间都留有 5 天时间，再也不用熬夜赶了。

学员嘎嘣嘣反馈

四、首屈一指的小毅老师 与别的 3D 课老师不同，小毅老师作为现任的京东高级视觉设计师，承接过多次大型电商大促级别的视觉项目设计，成功落地多款上亿流量的设计项目，拥有一线实战和电商 3D 设计经验。聪明的人知道这意味着什么：他教给你的东西，是真正能落地成为作品集，去面试大厂的。

老师作品：

当然，看学员作品更能感受到这门课的强大。

学员作业：

想跟着他一起学习 Blender，掌握 3D 创作的方法，今晚秒杀价就别错过啦

课程原价 699 元， 限时特惠价 599 元！ 之后立刻恢复原价！

手机扫码报名，网页端右戳报名 ? https://pro.uisdc.com

大家好，这里是和你们聊设计的花生~不知不觉已经是 2022 年底了，最近为大家整理了一篇字体合集，包含了我从今年 3 月份开始收集的 9 类高质量的英文字体，涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。字体都是免费可商用，能满足设计中绝大部分的需求，并节省设计师寻找免费英文字体的精力。本文有字体风格...

大家好，这里是和你们聊设计的花生~

不知不觉已经是 2022 年底了，最近为大家整理了一篇字体合集，包含了我从今年 3 月份开始收集的 9 类高质量的英文字体，涵盖经典、优雅衬线、纤细手写、粗犷笔刷、力量感等不同风格。字体都是免费可商用，能满足设计中绝大部分的需求，并节省设计师寻找免费 英文字体 的精力。

本文有字体风格的详细介绍和安装包下载链接，建议直接收藏，之后需要是直接下载即可~

往期回顾：

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

阅读文章 >

一、经典衬线体 包含字体：Cinzel、Cormorant、Playfair Display、Butler、Roboto Slab

详细介绍及安装包下载： https://www.uisdc.com/commercially-available-english-font-2

英文衬线字体在设计中运用极广，这里的 5 款字体可以作为 Trajan、Garamond、Baskerville、Bodoni 等经典西文衬线体的替代。5 款字体气质各不相同，或庄重正式或优雅精致，可以满足不同的设计需求。

二、经典无衬线体 包含字体：Roboto、Marcellus、Montserrat、Poppins、Barlow

详细介绍及安装包下载： https://www.uisdc.com/commercially-available-english-font

Helvetica、DIN、Optima、Sofia 等西文字体虽然经典，但没有购买版权不能商用。这里为大家推荐的 5 款英文体正好可以作为这些经典无衬线体的替代，字形气质相似且字体质量极高，无论是正文还是大标题都适用。

三、纤细手写英文字体 包含字体：Dattebayo、England、Sophia Christie、Reading、Cervanttis

详细介绍及安装包下载： https://www.uisdc.com/thin-cursive

这种字体秀丽灵动，适合作为装饰用在画面中，可以烘托氛围、平衡版式，并打破画满的呆板沉闷，使海报层次丰富有亮点。合适与文艺、青春、音乐及女性相关的主题。

四、优雅英文衬线字体 包含字体：TheNightWatch、Branic、Areminiscentsmile、NewYork、Qene-G

详细介绍及安装包下载： https://www.uisdc.com/poster-design-5

这种笔画极具设计感的英文衬线体在今年的海报设计中经常出现，国外设计媒体也预测未来会继续流行。字体风格优雅华丽，装饰性极强，适合以大字号展示，可以作为书籍、网页、海报等的大标题。

五、铜版手写体 包含字体：Italianno、England hand DB、Exmouth、Dynalight、Bolina

详细介绍及安装包下载： https://www.uisdc.com/copperplate-script

铜版手写体字形微微向右倾斜，不同的字母间有极细的笔画相互连接，延绵流畅，如同时书法家用钢笔一气呵成写成的，具有音乐韵律般的节奏和美感。字形精致，气质华丽典雅，在明信片、邀请函、红酒包装等设计上有广泛的运用，适合与女性、婚礼、餐饮美食等相关的主题。

六、笔刷英文字体 包含字体：Forturn、Takota、Good Brush、Shuher、Alinea

详细介绍及安装包下载： https://www.uisdc.com/brush-font

英文笔刷字体一般是用平头毛刷或者硬头马克笔直接写出来的，笔画粗犷利落，具有力量感，笔头留下的毛糙边缘及飞白也让这种字体更具质感。这种字体非常适合需要表达个性主题的海报，且在海报中通常作为视觉焦点进行处理。

七、力量感英文字体 包含字体：Theater、Berd、Thunder、SuperLine、Phyco

详细介绍及安装包下载： https://www.uisdc.com/design-with-a-sense-of-force

这种类型的英文字体最主要的特征就是线条粗重，作为海报主体元素时有很强视觉冲击力。适合大字号的展示，运用在与体育、运动及与男性相关的主题中，突出健壮有力的感觉。

八、科技感英文字体 包含字体：Aperat、Generic Techno、Liberation For 7 Kicks、XYBER、Arcade

详细介绍及安装包下载： https://www.uisdc.com/6-science-and-technology-font

这种字体的外形具有显著的几何块面特征，适合机能风、赛博朋克或未来科幻主题，提升画面的氛围感，可以作为海报或作品集的主视觉或装饰元素。

九、潮流英文字体 包含字体：Facón、Rubik Glitch、Modulor、Ron、Libre Barcode 39 Extended Text

详细介绍及安装包下载： https://www.uisdc.com/6-trendy-english-font

这种字体高度图形化，看起来更像图案装饰而非字体，但这也让它们比常规的字体更能引起人们的注意。如果放大后作为装饰元素用在酸性潮流海报中，可以有效增加画面的设计感和视觉张力。

以上就是今天为大家推荐的 9 类常用英文字体合集，也算是送给大家的 2022 年底礼物啦~

我在开始学设计时经常为找免费可商用的英文字体头疼，一是不知道是不是真的免费可商用，二是可商用的又觉得质量不佳。后来发现很多小伙伴也有和我一样的烦恼，于是决定收集和整理我觉得好用英文字体推荐给大家。也欢迎大家关注我的主页，获取更多免费可商用的中英文字体资源。

夏花生的优设主页： https://www.uisdc.com/u/165152/home

如果你喜欢本期推荐的话记得点赞收藏，也可以转发给身边有需要朋友 。如果有关于本文或者设计的疑问，可以在评论区提出，我会第一时间为大家解答 ~

推荐阅读：

免费商用！15 款设计师必备的中秋海报标题字体（附下载链接） 大家好，我是和你们聊设计的花生~ 中秋将近，今天为大家推荐 15 款我精心整理的免费可商用字体，它们气质各不相同，质量也非常高，适合作为中秋海报设计的标题字体。

阅读文章 >

做字库超简单！字体设计神器Glyphs系列教程（上） 如果你想做出属于自己的字库？

阅读文章 >