8个技巧帮助你提升视觉层级
大家都知道提高视觉层级，无非就几个点，尺寸、对比、颜色、样式、分组、对称、相似等这些点，基本总结起来就是制造差异，通过差异点来突出我们想表达的信息，视觉层级它能引导我们去发现设计中重要的地方，忽略不重要的点。
本文作者（skys），结合了一些案例来分享在设计中是如何去运用对比来达到提升设计层级的。
<查看更多设计干货，就订阅「懂点设计」吧！>
封面/ 网络
打开 VS 关闭
页面中通过打开或关闭处理方法，对页面中需要透出给用户的信息，可以铺开呈现出来，对于不那么重要信息可以收起来，通过展开和收起的对比，通过二级页面跳转或引导到其他操作，通过这种方式来强调页面关系和节奏。
满 VS 空
一半内容满一半内容少，形式对比，形成层级落差。
▲（上图）左侧图片比较饱满，右侧文字采用正负形结合视觉稍显空来突出页面调性。
▲（上图）左侧空右侧饱满，对比强烈，让用户更懂关注在文字信息。
▲ 同样这个app在上面留白较多，内容集中底部，页面一分为二，上半部分空，下面满，形成对比。
▲ 酒杯比较满，文字底部空，形成视觉冲击整个画面更加聚焦中心。
对称 VS 不对称
在页面中，通过对元素不对称，会让视觉焦点差异点突出来。
▲ 偶尔在设计中运用这种不对称设计手法反而能起到更好的效果
▲ 这个页面主要功能集中在左侧第一个按钮，和传统的重要功能集中在中心不同，能形成产品差异点，同时营造视觉差异性。
▲ 非对称在页面中的运用
大 VS 小
通过元素大和小对比，这种直接感官方式能让我们更聚焦在大的图形上面。
面 VS 线
通过线和面之间对比，常用在按钮和标签，或者区块之间，面的按钮重于线的按钮，这个是设计中经常运用到的设计技法。
衬线字体 VS 非衬线字体
字体也是种对比，如Serif and Sans-serif的对比。
有序 VS 混乱
有时候为了强调对比关系，在页面文字处理中采用有序排版，对于物体排布采用混乱，通过有序和混乱对比强调画面关系，最著名的例子可属苹果设计，大量采用这种有序VS混乱手法。
▲ 文字居中是有序的，手机采用倾斜的营造一种对角线感觉，和文字有序排列形成呼应。
▲ 同样上面两图文字部分采用的整齐左对齐方式，而一些手机，装饰氛围物品则错别排布在页面各个地方，形成对比。
▲ 文字有序，氛围素材无序，对比强烈，装饰效果强。
质感 VS 扁平
质感的和扁平的，这个质感不一定是拟物设计，是有画面感，有色彩重量的，通过对扁平对比来强调。
对比技巧技法的运用总结
打开 VS 关闭
满 VS 空
对称 VS 不对称
大 VS 小
面 VS 线
Serif VS Sans-serif
有序 VS 混乱
质感 VS 扁平
作者skys
《懂点设计》内容分享设计师之一
UI中国主页：http://i.ui.cn/ucenter/36814.html
想查看他的更多干货内容，请订阅《懂点设计》吧！
（预告：上周五的推送中@福利 -自然设计师｜Design of the Nature，给大家留下了一个小福利，中奖名单将于明日周二17:00左右公布，敬请期待哦。）
--关于我们---
UI中国 专业用户体验设计平台
主站：www.ui.cn
新浪微博：@UI中国
合作请加微信：18931333875