一、项目概述 美事6.0全新升级为用户带来更好的使用体验。通过展示品牌视频内容，我们希望向用户展示美事6.0的新理念、新功能和新亮点。我们希望通过这次升级为品牌注入新的活力，并提升品牌的价值和发展。 二、项目流程 整个项目主要分为三个阶段：概念探索，视频制作，

为了向用户展示品牌的新理念、新功能和新亮点，品牌会制作相关视频，并通过这次升级为品牌注入新的活力，提升品牌的价值和发展。那么该如何制作品牌升级视频呢？本文从五个方面进行了分析，希望对你有所帮助。

一、项目概述 美事6.0全新升级为用户带来更好的使用体验。通过展示品牌视频内容，我们希望向用户展示美事6.0的新理念、新功能和新亮点。我们希望通过这次升级为品牌注入新的活力，并提升品牌的价值和发展。

二、项目流程 整个项目主要分为三个阶段：概念探索，视频制作，后期工作。

项目流程

三、概念探索 1. 设计探索 为了满足产品的需求，我们进行了需求分析，确定了美事6.0品牌升级视频的主题、内容和风格。我们还构建了视频的故事情节，建立了一个与美事6.0相适应的世界观。美事6.0的品牌升级，将更清爽、更协同、更灵活的设计理念引入美事的设计语言中，带来全新的使用体验。

设计理念

2. 脚本分镜 在制作品牌升级视频的过程中，分镜是非常重要的。它决定了视频的结构和节奏，并且是视频质量的关键因素。因此，在分镜时应注意以下几点：严格按照策划方案进行，确保视频的整体结构和节奏；充分考虑观众的观看体验，避免场景过于枯燥或累赘；注意画面的转换，避免出现突兀或不连贯的情况；多次审核和修改，确保分镜方案完善。

分镜

四、视频制作 1. 场景建模 进入建模阶段时，应根据分镜分析中提到的具体镜头来确定场景模型的内容。在制作模型时，应注意选择合适的建模工具，并根据需要调整网格密度和模型的比例。此外，还应注意避免模型的复杂度过高，以免增加渲染时间，并要给模型加入动画交互性，使它们在视频中呈现得更生动。为了提高模型的质量，还可以多次审核和修改模型，以确保它们符合策划方案的要求。

建模场景

2. 动画&预览 在制作动画转场时，需要注意摄像机的路径、时间和镜头效果等因素，以保证转场的流畅性和真实感。通过调整摄像机的速度、加速度和曲线等参数，可以实现平稳、弧形和加速等多种不同的转场效果。动画转场过程中，不仅要注重实现各种效果，同时也应注意提高转场的流畅性，以便观众能够轻松跟随故事情节。

在c4d中进行动态预览时，需要注意模型的完整性、预览范围、渲染参数、光照参数和摄像机参数等因素，以保证模型的动态效果和变化。设置摄像机参数时，可以通过调整摄像机的位置、方向和焦距来控制摄像机的视角，使摄像机能够以合适的角度和距离来拍摄模型，这有助于提高模型的真实感。

动画&预览

3. 色彩搭配 在品牌升级视频中，选择合适的色彩搭配是非常重要的，因为它能够有效地提升视频的视觉效果和品牌形象。基于品牌色彩进行搭配，可以将主色、辅色和背景色等统一起来，以统一品牌的视觉风格。利用色彩对比来强调重点，比如可以采用高对比度的色彩来突出主题内容，或采用低对比度的色彩来营造轻松愉悦的氛围。此外，在进行色彩搭配时，还应注意色彩的搭配方式，例如渐变、点缀或拼接等。

色彩搭配

4. 灯光材质 Octane可以通过使用不同类型的光源，如环境光、点光源、聚光灯和灯光遮罩来照亮场景中的物体，从而获得更加真实的渲染效果。使用这些不同类型的光源可以为场景中的物体创建出不同的光照效果，使得渲染的场景更加逼真。例如，使用环境光可以为整个场景提供柔和的光照，而使用点光源则可以在特定区域创建出锐利的光斑。

Octane可以通过调整材质参数、混合多种材质和运用贴图来提高渲染效果。例如，可以通过调整材质的颜色、反射和透明度来改变物体表面的外观，混合金属和木材材质来制作复合材质，以及使用贴图来控制纹理和色调。这些方法可以为Octane渲染提供更真实、丰富的效果。

材质效果

5. 渲染 渲染风格帧测试可以确保渲染质量和提高渲染效率，通过调整抗锯齿级别、光线反弹次数、采样率和灯光参数来实现。这些技巧可以为渲染带来更满意的结果。

渲染效果

五、后期制作 1. 音乐 音乐可以提升观看体验和传递品牌信息，选择与视频内容协调的背景音乐可以增强视频的情绪和氛围。避免选择过于突兀的音乐，与视频内容搭配，能够增强故事性。

2. 剪辑 视频剪辑是一个非常重要的过程，它可以帮助用户表达观点、增强观看体验、提高视频质量，从而更好地宣传品牌。通过剪辑来让视频的内容更流畅、更有节奏感，从而吸引观众的注意。

3. 调色 视频调色可以增强感染力、改善画面、表达主题，通过调色让画面鲜艳、连贯、符合品牌形象，使用AE中的调色插件可以调整颜色和创建效果。

六、结语 制作本次品牌升级视频充满了挑战和困难，我们遇到了许多技术难题，不断探索和完善。尽管本次项目还有很多改进的地方，但我们已经尽力做到了最好。我们将继续努力，为品牌带来更多价值。

作者：58UXD团队

来源公众号：58UXD（ID：i58UXD），58UXD，全称58同城用户体验设计中心。

本文由人人都是产品经理合作媒体 @58UXD 授权发布于人人都是产品经理。未经许可，禁止转载。

题图来自 Unsplash，基于CC0协议。

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。

给作者打赏，鼓励TA抓紧创作！

{{{path> 赞赏

我最近入手了VR设备，体验大大超出预期，难怪老罗觉得VR是下一代硬件平台，我觉得还真的有可能。在VR中有很多新奇的交互体验，视觉冲击感强，所以我对VR设计具体怎么做，充满好奇，不知道你有没有兴趣？ 不管你将来做不做VR设计，其实都应该了解一下，作为设计的广度，

作为一种较为新颖的交互方式，VR交互与常规应用交互有所不同，而相应的UI设计人员也需要寻找更恰当的设计策略，以适应设备的发展与普及。那么在当下，VR交互设计应该怎么做？本篇文章里，作者便做了一定总结，一起来看。

我最近入手了VR设备，体验大大超出预期，难怪老罗觉得VR是下一代硬件平台，我觉得还真的有可能。在VR中有很多新奇的交互体验，视觉冲击感强，所以我对VR设计具体怎么做，充满好奇，不知道你有没有兴趣？

不管你将来做不做VR设计，其实都应该了解一下，作为设计的广度，拓展下知识面也是必要的，万一哪天就要做了呢？就像多年前的UI设计一样，所以这篇文章值得点赞收藏。

之前也有写过两篇VR相关文章，结合起来看效果会更好。下面2篇，同样超干货，值得一读。

《国外大佬手把手教你从0开始学好VR设计》 《 想了解VR设计？看完这篇就够了！ 》 VR应用具有非常直观的UI界面，与可穿戴设备、手机、平板、PC上的应用类似，使得大众能够使用VR。想出新颖的交互会比较有趣，但它却增加了用户的学习曲线。

类似于2D界面，VR设计师会用大小、对比和颜色设计出界面层次结构。 在VR里，大小取决于用户和内容之间的距离，因此了解内容的大小和适当的观看距离至关重要。

比如，知道要设计多大的字体是很棘手的，但幸运的是，在现实世界中有很多先例。在为VR设计内容时，对印刷设计（广告牌、海报、书籍）也需要类似的思考，对VR设计有借鉴意义。

考虑下你现在是如何与一个触摸屏进行互动。我们必须慢慢去学习理解许多模式，比如滑动、捏缩放，长按出现更多选项。这些在做VR设计时也必须要去考虑好。

我相信随着越来越多的设计师进入VR领域，将会有更多的想法来创建和打造新的UI模式，从而帮助行业向前发展。

一、视野 视野，或任何给定时间可观察环境的范围，是设计VR界面时非常重要的一个方面。更宽的视野，用户在体验过程中的沉静感就更强。有2种类型的FOV共同作用形成人类视觉。

单眼FOV描述的是我们一只眼睛的视野。对于一只健康的眼睛，单眼FOV的视野水平在170°-175°，包括从瞳孔到鼻子的角度。鼻前视野FOV通常为50°-65°，对于鼻子较大的人来说较小，而从瞳孔到头部一侧的视野为颞FOV，其较宽，通常为100°-110°。

二、新建Figma文件 1. 画板 当做VR设计时，我使用的画板尺寸为3600×1800（360度），然后我绘制出完美的FOV区域来集中主要设计。

2. 消失点 在透视理论中有一个消失点的概念，这个概念在VR设计中很有用，因为它能帮助设计师在设计软件中创建一个便于感知深度和距离的参考。

我总结了一种在我的设计中创建消失点的方法，通过在一个圆内以10-15度的角度画分隔线。之后，我将线条引入画板，并拉伸线条，直到它在框架内。

完成后，将以连续间隔的直线放到画板中。（彩云注：这个方法也很适合用到画透视线中）

3. 选择主题并丰富背景 一旦消失点画好了，主要的参考线已经变明朗了，接下来就取决于你想如何在环境中发挥创造力。

大多数时候，我使用渐变来创建天空和陆地等效果，然后添加了气泡、结构或使用形状的建筑物，这为环境添加了很多细节，使其感觉更3D逼真。

4. 设计UI 到这一步的时候，你可以基于产品目标开始设计UI了。在设计VR时，对比是最重要的，因此，尽量减少文本和背景周围的颜色。

通常，背景一般是半透明，在UI设计中一个白色背景最好适配深色环境，而对于深色背景最好适配白色环境。按钮通常包括两种形式，主要按钮和次要按钮，颜色保持简单同样是最好的。

5. 布局 与桌面和手机的传统UI设计不同，在VR或者AR中，嵌套导航保持在同一环境中，而界面框架利用了环境中可用的巨大空间。

只有当有新的游戏场景可供探索时，环境才会发生变化。其他时候，也可以实现弹出窗口，新层叠加在旧UI之上。

6. 使用XR工具创建曲面UI 仅用Figma就可以了，设计工具这块原来就足够了，有一种快速简单的方法来设计原型3D，VR，AR界面。

有一个插件叫3D UI Generator，能够自动缩放和调整任何图形，画板以创建3D界面和环境。它支持旋转、斜切、缩放、远近、FOV、曲面程度和等距视图。在Figma上可以安装 3D for XR https://www.figma.com/community/plugin/1043890631255427270/3D-for-XR

7. 声音用户体验 虽然在使用网页或APP时，声音往往很烦人，但它是VR开发不可或缺的一部分。考虑通感现象，其中一种感觉的刺激导致另一种感觉自动触发。

例如，你闻到一些东西，就会产生味觉错觉。这也适用于声音。 由于VR中仍然缺乏触觉反馈，因此当用户触摸物体时，声音是提供反馈的一种很好的方式。

3D声音（又称Holophonic声音）仍处于起步阶段，但将对我们体验VR的方式产生变革。我们都习惯于立体声，它提供来自两个声道（左/右）的声音，但全音可以让我们分辨声音是来自上方、下方还是后方。

想想当你在外面听到飞机的声音，你凭直觉向上看，对吗？ 在VR中拥有这种声音体验将使用户真正身临其境。

三、总结 这是VR设计最基本的底层原理。这几篇VR相关文章一起看完，总算让VR中的设计不再神秘了。

元宇宙是未来发展一大趋势，不少人都想上这趟车，VR设计就是最靠近这一趋势的领域之一，VR设计师这个岗位在将来会越来越紧缺。

为我投票 我在参加人人都是产品经理2022年度作者评选，希望喜欢我的文章的朋友都能来支持我一下~

点击下方链接进入我的个人参选页面，点击红心即可为我投票。

每人每天最多可投35票，投票即可获得抽奖机会，抽取书籍、人人都是产品经理纪念周边和起点课堂会员等好礼哦！

投票传送门： https://996.pm/MZ9B9

原文作者：Ozenua Oluwatobi John（本文翻译已获得作者的正式授权）

原文：https://medium.com/@ozenuaoluwatobi/designing-for-vr-in-figma-15243b15738a

译者：彩云Sky，公众号：彩云译设计；人人都是产品经理专栏作家，腾讯高级视觉设计师。

本文由@彩云sky 翻译发布于人人都是产品经理，未经许可，禁止转载

题图来自 Unsplash，基于 CC0 协议

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。

给作者打赏，鼓励TA抓紧创作！

{{{path> 赞赏

今天来分享一下策略产品经理在思维上的尖兵利器——建模思维。 目录： 什么是建模思维？建模思维与流程、分支思维的差异 建模思维在效果广告eCPM最大化期望收益当中的应用 如何培养建模思维 一、什么是建模思维？ 前面一文提到了相比较常规B端和C端产品经理的分支思维

策略产品经理更重要的就是要用建模思维来思考和解决问题，那么什么是建模思维？对应的流程思维和分支思维又是什么意思。本文作者分享了策略产品经理在思维上的尖兵利器——建模思维。

今天来分享一下策略产品经理在思维上的尖兵利器 ——建模思维 。

目录：

什么是建模思维？建模思维与流程、分支思维的差异 建模思维在效果广告eCPM最大化期望收益当中的应用 如何培养建模思维 一、什么是建模思维？ 前面一文提到了相比较常规B端和C端产品经理的 分支思维 和 流程思维 ， 策略产品经理更重要的就是要用 建模思维 来思考和解决问题， 那么什么是建模思维？对应的流程思维和分支思维又是什么意思。

我们先来举一个深入浅出的例子，给大家把抽象名词具象化的表达出来：“ 假如我们现在来爬一个4阶梯的楼梯，可以一步迈1个阶梯，也可以1步迈2个阶梯，那么请问我们有几种上楼梯的方法 ”，我们分别用分支思维、流程思维以及建模思维来解答这道题目。

1. 分支思维的方法 如果是用 分支思维 来解决这个问题，核心需要讲所有的方法进行遍历，如下图所示：

箭头上表明的是 每次增加阶梯的层数 ，是增加1层还是增加2层，而椭圆中代表的是目前我们已经迈到的阶梯数，是不是看上去有点像我们之前说的 决策树Decision Tree， 我们通过数终端节点的方法枚举出来，分支上楼梯的方法 一共是5种方法 。

定义： 这种通过树Tree穷尽枚举所有的解决方案路径的方法就被定义为对应的分支思维法； 分支思维存在明显的缺陷就是伴随着节点（即达到的阶层）的变多，分支要解决的路径快速膨胀，对应产品来说纷繁复杂，对于系统来说计算耗时且复杂 。

2. 流程思维的方法 如果是通过 流程思维 来解决这个问题，核心就是把系统运行的步骤进行呈现：

大家可以理解把往上攀爬1或者2层楼梯抽象成黑盒流程思维， 流程式的思想通过枚举出系统里正/负向反馈的流程步骤内容来说明每一个细节。 其中j++表示每一次不同的方式走到第4层之后，统计的方案数+1，系统方案运行过后不会二次运行，黑盒（网上爬楼梯1或者2层）的计算方式其实如枚举法类似。

3. 建模思维的方法 首先，我们用函数 f(n) 来表示n个阶梯可行 爬楼梯的方法数量 ，由1.1中的结论表示 f(4) = 5 ，我们把n <= 4以下的阶梯方法用函数表示出来如下：

按照模型推演的思路来说明，我们希望 建立台阶数n > 4的函数 ，来定义函数 f(n)：

case 1： 如果我们第一步迈的是1个阶梯，那么对于接下来的n-1个阶梯则是一个完整的子问题 f(n-1)

case 2 ： 如果我们第一步迈的是2个阶梯，那么对于接下来的n-2个阶梯则是另一个完整的子问题 f(n-2)

咱们把 case 1 和 case 2 下的所有可行性方案相加成一个最终的方案 f(n) 的方案数，来得到最终的函数形式。

这其实可以转化为一个数列通项公式，上面函数的数列写成 {an} ，我们给出递推公式：

求解通项公式可以 得到以下最终结果：

4. 三大思维方式总结对比 根据上面的例子大家看出来三种思维的差异没有，流程和分支思维对于产品也是非常重要的思维方式存在； 但是对于策略产品倚重的思维模式，如果仅仅只是 分支思维， 对于“阶梯数变多”的膨胀场景下，无法具备通用性；如果仅仅只是 流程思维 ，我只能做到每一个系统运行的步骤和实现结果的细化。

而策略产品最重要的是让面临的问题能够通过 建模（建立模型）来变得普世、通用， 打开一把能解决绝大多数业务场景下困难的钥匙 ，当然还是有极少数不具备通用性的场景，我们会通过加权重、对于实验公式单独加减乘除一个系数的方式来提升整个公式的鲁棒性。

二、举例：建模思维在效果广告eCPM最大化期望收益当中的应用 上面是将建模思维的方式从抽象中剥离而具象化，让大家理解 【什么是建模思维】 ，接下来给大家介绍的就是业务函数建模思维在广告排序公式当中的应用，即 eCPM = pCTR * CPC * 1000 这个公式的由来思路 ，带大家领略一下 范里安（谷歌首席竞价学家） Google关键词竞价拍卖机制公式 的由来；全网只给大家讲公式得来的结果，今天Arthur给大家从头到尾的推导一下过程。

Step1： 大家都知道，广告在排序优化的时候就无法类似自然推荐做 贪心算法（单向围绕CTR点击率、CVR、GMV等最大化）优化 ，广告需要去做 平台和广告主利益的平衡 ，除了要做CTR、CVR预估，还需要兼顾平台竞价bid的竞价水平，因此从 上下文相关性、平台收入角度出发建模，得到计算广告收益eCPM业务函数建模 如下：

也就是 u表示每次用户推荐访问或者搜索时候，在上下文c关联匹配的情况下，系统展示广告a的期望收益，e表示expected最大化期望。

Step2： 我们知道，效果广告毕竟不是 离散的投放模式 ，其在平台上一个多个广告主整体连续性投放，因此最大化展现所有广告eCPM和的表达式就可以表示为：

上述表示想 用户 ui 展示一次广告 ai 称之为一次广告投放 (ai,ui) ，因此，所有投放人次的集合 M={r(ai,ui)} 表示为一次匹配 ， Γ 表示成满足广告投放条件的集合 。所以上述表达式的本质问题就是所有的可能 用户-广告匹配Γ 当中，并且寻找一个让 广告期望收益最大的匹配集合 M。

Step3： 基于上述的最大期望期望收益目标出发，将业务目标排序问题，可以拆分成两个问题： 其一是CTR预估问题 ，而 另一个就是bid竞价问题 ，通过eCPM最大化期望收益方式进行广告排序，得到如下公式，也是各大互联网广告通用得搜推广告排序方式，这是eCPM排序公式诞生的思路，其中pCTR和pCVR就是模型预估的CTR和CVR结果。

这个就是eCPM公式思考由来的结果，整个公式的推演就是沿着建模思维的方式得来。

看完这个例子 之后，很多 想从事策略产品的同学肯定慌了都，“ Arthur我数学不好是不是就做不了策略产品了 ”，“ 策略产品是不是涉及到非常多的 数学公式，看着都头大 ”。 我想简单说明一下， 不是让策略产品去干算法的工作 ，每天对着数学公式、对着模型与算法，“走算法的路让算法无路可走”， 这是根本不现实的事情，也是产品经理没有职责边界感的体现 。 核心的出发点 在于培养自己将业务问题函数通用化的思维，找到业务问题道中的共同规律 ；能知道自己在解决什么 业务目标 ，如何处理涉及中利益方的博弈问题，培养出这个思维， 再去做搜推策略、订单策略还是风控策略产品都是万变不离其宗。

三、如何培养建模思维 对于建模思维的培养，我想结合我的一些生活中工作中的一些心得与经历来给大家分享一下，同时帮助想往策略产品转型的同学或者已然是策略产品希望能在这个方面更加进阶提升的同学更进一步提升思考的能力。

提升基础数学能力； 作为策略产品对于数学还是要有一定的基础对于高等数学积分、数列以及基础的数学公式符号要有一定的了解，不要看到公式的推演过程都是完全不知所云的状态；例如我前几期中关于机器学习的几篇文章，能够自己理解并对过程有所推演； 项目业务场景抽象再到具象的过程： 在日常工作中， 能够在做每一个项目/问题都能够清晰且明确定义清楚项目服务于提升的业务指标和解决的问题 ，先要学会找到 问题的共性 ，再来思考构建业务达成的关联因素究竟是哪些；例如上文提到，平台做效果广告非常明确的业务提升指标就是最大化期望收益eCPM才能来保证广告收入最大化，按点击计费的模式下就需要相关性CTR因素，并且需要保证竞价市场也最充分； 机器学习原理与前沿策略论文： 作为策略产品还是需要了解机器学习的原理内容，了解超参求解过程，与各自服务的业务场景；可多看看工业界对于策略的前沿文章，基本上每一篇算法的文章，算法同学都会在背景写清楚业务场景，在构建解决方案前说明问题建模的思路，例如Arthur在之前分享一文中关于 《Nobid最大化转化出价策略》当中的背包问题的解题思路 ，就是一个建模的过程，这都是非常好训练自己建模思维的来源。 本文是全网第一篇介绍 策略产品需要培养建模思维的文章 ，非常多的肝货以及个人思考沉淀，核心还是把策略产品与功能产品的思维方式在工作中的差异点给大家沉淀出来，让希望从事策略产品的同学能够走对路子。

最后， 希望大家“日拱一卒，功不唐捐”。

作者：策略产品Arthur，5年大厂策略产品专家，全网最专业的搜广推策略产品干货博主，帮助你成就策略产品专家之路

本文由 @策略产品Arthur 原创发布于人人都是产品经理，未经许可，禁止转载

题图来自 Unsplash，基于 CC0 协议

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。

给作者打赏，鼓励TA抓紧创作！

{{{path> 赞赏

还有不到两个星期的时间，2022的指针就要走向终点。 就往常经验来看，年终节点的互联网人可能多多少少都会有些疲惫：年终总结、年度营收盘点……年底的最后一个月仿佛是“讨债”月，平日里欠下的“债”，最后这个月都是要还的。 不过，对平日里不怎么拖延、flag也几乎不

赛程已进入白热化阶段，但这不是尾声，而是新的起点。

还有不到两个星期的时间，2022的指针就要走向终点。

就往常经验来看，年终节点的互联网人可能多多少少都会有些疲惫：年终总结、年度营收盘点……年底的最后一个月仿佛是“讨债”月，平日里欠下的“债”，最后这个月都是要还的。

不过，对平日里不怎么拖延、flag也几乎不会倒的人而言，这样的情况却不大会发生。比如下图里这位入围了2022年度作者评选的作者：

（对话截图放出已经过同意）

在今年年度作者评选活动中的互动广场里，不少用户立下的flag看起来也十分具有计划性：

“明年的计划，每月一篇经验总结，两本书，三部纪录片，四部电影” “我要10点睡5点起，早上豆浆晚上泡脚，上班路上听播客，下班路上看文章，元旦一过就开干” 看到这里，谁能不感慨，互联网果然处处有大佬。所谓的年终于他们而言并不仅仅是一年的终点，同时还意味着第二年崭新的起点。互联网人的进度条，其实才刚刚拉满！

而这场一年一次的年度作者评选盛宴也一样，虽然活动历程已过半，但互联网人们的热情还在燃烧！

这不，一周过去了，不少作者的票数已经破万，甚至还在不断上升。

谁最后将在这场激烈的同台竞技里脱颖而出？可能就看你手中的关键一票了！

划重点！参与投票互动，还有机会抽取超值好礼哦！

一、入围作者 今年的入围作者有哪些？点击链接即可进入活动页面： https://zt.woshipm.com/author/2022/index.html

（以上截图仅为部分作者信息，详情请查看活动页面）

活动截止时间为 2022年12月21日（本周三）18：00 ，每人每天最多可以投35票，谁是你心目中的最佳年度作者，就向TA投出你的关键一票吧！

二、参与互动 除了投票互动，人人都是产品经理也准备了许多好玩版块，等你来玩！

1. 幸运大转盘 参与2022年度作者评选作者投票后，即可获得一次抽奖机会，同时参加互动活动则还可额外获取3次抽奖机会，抽取包括人人都是产品经理珍藏版周边、产品&运营枕边书、起点课堂VIP会员、2022产品经理大会视频等超值好礼！

点击进入>>> https://996.pm/MZ9Dq

2. 互联网人年度报告 这个2022，你的身份角色是什么？是领导眼中的一级梗王，还是同事眼中的摸鱼高手？

点击链接或扫码二维码，即可进入活动页面，解锁你的专属身份卡>>> https://996.pm/zA6vd

3. 年度热文榜单 互联网时代，内容瞬息万变，在这个过程中，有哪些精华逐渐沉淀？

人人都是产品经理精选了这份2022年度热文榜单，从“火出大气层”的“羊了个羊”、到互联网人的职场故事，再到产品经理、运营人的必备干货……多维度的内容分享，希望可以给你带来一些启发>>> https://996.pm/YDvm6

4. 互动广场 这一年里，你立下的flag都完成了吗？明年你又有什么样的想法和计划？

不如来互动广场晒出你的年度flag，还可以围观别人的想法和好文章>>> https://996.pm/75OkV

5. 互动问答 年底了，APP们都推出了自家的「年度盘点」，那么2022，你最期待哪家的年度盘点/年度报告？你希望APP年度盘点中，可以为你呈现哪些内容？

不如来前排和其他互联网人一样参与互动问答，还有机会赢取赏金>>> https://996.pm/7W60m

想了解更多活动详情，就进入活动页面查看更多吧，还有其他好玩版块，就等你来>> https://996.pm/YBv2y

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