网易资深视觉设计师：24个容易忽略的App设计细节

标签： 2024-12-03　次

QQ截图20170914091505.png

网易UEDC – 黑马青年：随着移动优先的趋势，APP的设计也越来越受到公司重视，不停地提高APP的设计质量是每个设计师的追求，有哪些设计中的细节被你忽略了呢？让我们一起来看看这些细节你都驾驭住了吗。

视觉表示型问题

1. 统一的图标设计风格

网易资深视觉设计师：24个容易忽略的App设计细节

图标设计在整个APP设计中是比重较大的板块之一，图标设计风格有：线性图标、填充图标、面型图标、扁平图标、手绘风格图标和拟物图标等。无论我们选择何种表示形式的图标都请连结统一性，相同的模块采用一种风格的表示形式，如果是线性图标就连结一致的描边数值。

图标在配色上面也要连结有规律的统一，采用相同颜色是比较常用的配色方式。如果你采用差别色相的配色方式，要连结整体的配色协调，不要出现饱和度、明度反差过大的配色而影响整体的视觉协调。

2. 图标大小的视觉平衡

网易资深视觉设计师：24个容易忽略的App设计细节

同一个界面出现多个图标时，我们需要连结整体的视觉平衡。并非是所有图标都采用相同的尺寸就能达到平衡，由于图标的体量差别，相同尺寸下差别体量的图标视觉平衡也不相同，例如相同尺寸的正方形会比圆形显得大。因此，，我们需要按照图标的体量对其大小做出相应的调整。

3. 优化你的分割线

网易资深视觉设计师：24个容易忽略的App设计细节

界面设计中往往细节的处理最容易被忽略，按照界面配色的差别，我们在分割线色彩的选择上面也要做出相应的调整。由于分割线的作用是区分上下信息层级和界面装饰，配色的表示力要低于文字信息的力度，通常我们会选择浅色而否定深色，这样界面会更加简洁通透。深色的分割线要慎用，除非在一些特定的产品场景下。

4. 合理的运用投影的颜色与透明度

网易资深视觉设计师：24个容易忽略的App设计细节

通过对按钮、卡片等进行投影运用可以增强立体感与层次感。我们在制作投影时，需要按照差别配景改变投影的颜色、透明度。

浅色配景下投影的颜色会选择拾色器偏左上角的位置和透明度在10%~40%（个人经验）之间进行调整。深色配景下投影的颜色会选择拾色器偏右下角的位置和透明度在20%~40%（个人经验）之间进行调整。

投影的权重要符合页面设计的氛围，投影的运用是为了增强元素的立体感与层次感，而不是影响整个页面的视觉平衡。

5. 不要过度装饰，让界面更简洁

网易资深视觉设计师：24个容易忽略的App设计细节

设计需要准确的驾驭“度”，过度的设计会干扰信息的传达。减少不须要的设计元素，让信息脱引而出，整个界面将会更加简洁清爽，也不会分散用户的注意力。