如何制造画面聚焦点

好的视觉体验的产品，不单指好看。最重要的是，页面视觉呈现是否做到了主次分明，对于产品战略的重点部分，是否给予了足够的视觉比重？

每个设计元素的存在都是有意义的。视觉引导顺序的优先级，要和内容信息，功能的优先级对齐。这时，就要确定哪些信息是重点。 体现信息层级要有轻，才能体现重。根据信息的重要性，运用图形，颜色，大小等方法，凸显内容。

以下是我从书籍，文章中找到的知识点。我将它们分别整理出来：

颜色：

• 色相差异越大越容易聚焦

24色相环上相距120度到180 度之间的两种颜色，差异最大。称为对比色。

举个栗子：  左右图对比。左图用色为相接近的色，右图的蓝色和黄色形成对比色。视线一下注意到右图了。

• 明度差异越大越容易带来聚焦
  

黑白是明度最极端的两颜色。因此对比度最大。3张图背景色为绿色，明度偏暗，可以假装它是黑色。三棵树干中。第一棵树明度最亮，因此与在暗色背景中产生最大的对比。

• 冷暖差异容易带来聚焦

人的视觉习惯，先看暖色，后看冷色。

举个栗子：

以下4个图标，第二个暖色图标最为突出。在实际工作中也可根据情况。运用这种方法突出图标。

• 面积差异容易带来聚焦
  

出现较大的形状。视觉焦点就会集中在大形状上

• 纯度高的颜色容易带来聚焦
  

色彩纯度越高。视觉引导性越强。左图为纯色调，色彩很饱和。右图为淡色调，加入些许的白色形成的色调。明显左图更吸引眼球。

拓展知识点：

色调分，纯色调，明色调，淡色调，灰色调，暗色调。

纯色：就是不加任何黑色或白色的颜色。色彩饱和度很高。那些看似鲜艳的颜色都是纯色。下面是各个色调的示意图，大家自个领会吧～

• 产品营销视觉设计思路，强聚焦的图标是什么样的？
  

市场上的应用图标多式多样。怎样才能脱颖而出。提高下载率。是有方法可循的。色彩和图形两类的引导强度如

空间：

• 聚焦的位置符合你的期待
  

当聚焦的位置符合你的期待，这时候信息和色彩产生了很好的沟通。大家不喜欢被延迟，焦点要在合适的位置。让人立刻得到信息。

• 留白、弱化
  

在周围留白、弱化其它元素形成背景。也有聚焦的作用。

• 色块，空间

使用色块来划分不同组别和层次的信息。

文字：

• 大小
  

文字以大小的文字强调信息重要性

• 深浅
  

使用不同灰度的颜色来区分重要性不同的文字。如重要的文字，用深色。相对不重要的文字，用灰色弱化它

• 英文大小写
  

在英文中，大写的文字具有“大声强调”的意味 。写头条标题或需要引起用户注意时，可用全大写

图片内容：

追溯到远古时代，人类最关注生存情况，不断观察周围环境。思考方式是，可以吃吗？可以和它性交吗？ 它会杀死我吗？现代人思考方式已经不像过去那样了。但是不管你愿不愿意，你都会注意到这些事情。

根据这个结论，人类对怎样对图片会引起注意。以下是最容易吸引人注意力的内容：

• 人脸图片
  

尤其是正脸。眼睛也是强点。杂志书籍广告等等，会使用人像做装饰元素。区别在于如何更吸引眼球。

• 性爱照片
  

利用性感美女吸引用户注意。达到提高点击量的目的。

• 危险，恐怖图片
  

恐怖的照片让人有过目不忘的视觉冲击力。用户的好奇心和探究欲也越是强烈。

• 故事
  

我们不想一成不变。大脑需要刺激，需要被感动、被吸引等。通过故事，我们可以通过缩短时间，简化环境的方式，以“上帝的视角”来了解一件事情。

动态：

视频、图片滚动、声音和动效很容易吸引用户的注意力 。

• 视频
  

动态和静态的展示方式，前者会更为夺目。

• 图片滚动
  

将banner摆放在黄金位置上。通过轮播的方式。吸引用户注意力。

• 声音
  

根据需求选择恰当的声音。最容易引起注意的声音要用在关键时刻，频繁使用会让用户麻木，且无视它。

举个栗子：用户格式化硬盘时或是执行无法撤销的动作时。 可出现声音提醒。

• 动效
  

动效给予用户焦点，拉开视觉层次，让用户用户更明白自己所在的位置。

总结：视觉焦点的把控。是有规律可循的。当我们知道产品界面中那些信息需要突出。通过一些方法。可以把控用户视觉焦点的去向。让用户更快地聚焦到需要聚焦的地方。

转载于:https://juejin.im/post/5a32815cf265da4319564cc9