福州贝纳设计学校与你分享UI设计中需要提升的细节

了解页面中每一个控件所表达的意义，也是非常重要的一环。今天福州贝纳设计学校为大家总结了几个在设计过程中非常有用的几个小细节，希望对大家有所帮助。

1、尖角与圆角

尖角更具权威感，圆角缺乏稳重感

当然每一个元素都没有绝对的好或者不好，例如尖角虽然在一定程度上让用户产生距离感，而这种距离感可以让某些特殊的产品更具权威感或者档次感。例如苹果的官方网站中出现的卡片基本全部是尖角，这就是为了营造一种高端的品质感受，给用户一种“不可触摸”的权威感，让用户感觉产品更值得信赖，更符合Apple的产品调性。而圆角具有了亲和力的同时失去了一些稳重感，尤其较大的圆角会让产品很难有“高大上”的视觉和心理感受，这也就需要设计师根据不同的场景需求选择不同的元素展现方式。例如下图：国外的一款针对高端用户的电商产品，尖角的使用让整体页面变得“高冷尊贵”。

圆角更具亲和力，尖角产生距离感

其实界面设计中很少会出现绝对的尖角，因为产品总是要让用户用的舒适，锋利的按钮或者锋利的卡片会让用户感觉非常的“不友好”从而产生距离感。而适当的圆角可以消除这种紧张的体验，当然圆角越大，便更具亲和力。然而其中也是要根据产品的属性最终确定圆角的大小，例如针对母婴类的产品圆角就会做的非常大，而工具类产品只需有一点圆角就够了，过大的圆角反而显得过于复杂了。这里需要注意的一个点就是一一个产品中，圆角的大小是要统一的，如果界面中的信息卡片选择8px的圆角，那么不论是卡片还是按钮最好都选择8px的规范，减少不必要的对比。例如下图母婴类产品，几乎整个产品没有尖角的出现，全部都是较大的圆角，迎合产品性格的需要。

2、箭头的使用规律

左箭头-返回前一页

左箭头一般出现在页面的左上角，起到返回前一个页面的作用。当然有些APP也习惯把返回按钮放到左下角，这都是设计师主观去设计的。当然不太推荐设计师在这种用户根深蒂固的操作习惯中做改变。如下图所示，左图的返回箭头在界面底部，单手操作时更易点击然而用户习惯受到挑战。右图返回箭头常规性的放在左上角。

右箭头-进入新页面

在iOS系统中，右箭头一般代表着跳转到一个新的页面，其实箭头也有一定的作用是来通过这个元素丰富页面的布局，当然前提是需要跳转新页面的时候。当信息过多或者布局受限时也可以不加箭头，通过标题加粗或者其他方式让用户知道可点击即可。箭头的样式没有固定规范，根据界面风格或者信息层级的重要程度来定就可以，信息层级较弱，则箭头也较弱，相反则同理。

右箭头还有一种功能是指引用户右侧有隐藏内容可以横向滑动，然而如今更多的是通过遮挡住的未显示完整的图片或者文字来给用户传达横向滑动的信息。总而言之，右箭头在界面设计中起到锦上添花的作用，虽然有很好的提示效果，但还是要慎用，避免过多的不必要的箭头造成用户的晕头转向。如下图所示，大标题的“更多”按钮由于层级较低并且在界面中出现的次数较少，所以使用了右键头来强调可，点击性。而右侧的列表页由于信息较多并且列表较密集，即使没有箭头用户也具有点击欲望，这里就没有加右箭头的必要。

上下箭头-展开与收起

下箭头一般在用户界面中代表着“展开全部”的意义，当界面中信息过多需要隐藏而又不想让用户单独跳页面查看全部内容时，展开与收起功能成了最佳交互选择。理所当然，上箭头一般代表着“收起部分内容”的意义。

圆形箭头-刷新、同步

一般圆形循环箭头常见于刷新页面或者换一-批内容的操作。当然还有用作同步消息记录或者其它同步信息的按钮。

3、投影的使用规律

投影在界面设计中是一把双刃剑，用得好，会让界面多很多层次感，让界面更生动活泼，而用不好就会让界面变得脏与躁。首先投影适用于在大的信息卡片.上增强立体感而不是琐碎的元素上，其次可以用在界面需要上下层级区分时，例如标题栏或者抽屉栏使用投影可以明确空间上的上下层级关系。注意单个产品中投影的属性要保持一致，也不要在有投影的卡片，上再叠加新的投影卡片，否则会让界面层次过多反而变得降低阅读效率。

投影尽量不要使用纯黑色

很多设计师喜欢把投影设定为黑色然后调整透明度，然而这样很容易让界面变脏，尤其背景有色彩倾向的时候。推荐的投影颜色是吸取背景色，然后把明度与纯度降低一些即可，保留一些背景色的色彩倾向，可以让整个画面更和谐统一。如果背景为白色时可以稍微偏一些产品主色的色彩倾向，当然要注意度的把握，色相不可过于明显。

根据不同情景选择投影强度

一般界面设计时投影的强度都不会太重，弥散式投影就是其中常见的做法，只需达到层级区分的目的即可，过于明显的投影会适得其反，让用户的视觉反而被过强的投影抓了过去。而在做视觉banner或者H5时，强烈的肯定的投影又成了一种特殊的视觉表现技法，这就需要设计根据不同的情境选择投影的使用强度。

高斯模糊制作投影

除了使用软件内的图层样式制作投影之外，还有一种常见的方法，就是通过高斯模糊手动制作投影，通过钢笔工具或者图形工具画出投影的形状，然后选择高斯模糊，调整透明度后至于需要投影的元素下方。这种制作投影的方法有个好处就是可以自己设计投影的形状，让投影更生动起来。

福州贝纳设计学校：http://fjbnsj.91soxue.com/

上一篇: 学UI设计可以从事哪些工作     下一篇: 福州贝纳设计学校教你零基础学习室内设计需要多久