知道这两个点，有助于提高设计品质

 1. 使用灰色增强层级 

▲这是之前做支付宝财富时候一个页面，当时业务方需要在理财服务下面加2个入口「稳定收益」 和「浮动收益」。当时也没在意，那就按照设计规范，直接下面加2个小卡片就好了，样式和上面保持一致。然后我就这样做了，但是做完后，发现怎么看怎么奇怪，我们来分析下。

▲单独看局部设计，其实并没有问题，但是从整体看，会发现这里被切割的非常的碎片。这么一个区域有3个卡片设计，同时下面功能和上面还不一样，但是设计上看着又很类似。所以信息表达肯定是有问题的，于是进行了优化。

▲样式雷同，于是我将视觉样式进行了调整，加了一个色块的圆形按钮上去，并且去掉了卡片设计，和上面完全拉开差异了。但是发现新的问题来了，首先这样太重，完全抢了顶部的余额宝那5个金刚入口，同时这两个入口放这里， 两侧视线边距无法对齐，阅读起来有很强的锯齿感。

▲于是我将下面的背景改为了灰色，在样式上进行了区分，同时灰色在格式塔「地面原则」里 面相当于视觉底部，从信息层级上也是清晰的。所以平时我们在处理某个独立模块设计时候，一定要结合整体去看，有时候如果相邻的样式尝试下用不同颜色去创建区别。

▲改之前的前后对比，你会发现优化比之前要很多，同时内容在整个页面的信息里面更加合理。

▲同理，在页面的其他地方，我们也运用这个方法，也很好传递信息层级同时，页面也更加合理，希望这个小技能大家能掌握。

 2. 巧用底纹让页面更精致 

上面是我当时做的支付宝尊享理财一个项目，当时页面差不多定稿了，首页进去一个深蓝色 玫瑰金配色，首页一个邀请的信封，非常高级。但是因为页面内容比较少，页面非常空，需要增加一些细节。

▲第一步，我在页面四周加一个边框，共两层，一个深一个浅，目的是增加层次，让这个页面更加有邀请函的感觉。同时也能让细节更丰富一点，加上后，细节丰富多了。

▲第二步，在页面的上面和下面角上增加一些金属流动的元素。因为是理财产品，同时是100万起投，需要页面体现出一些尊贵感。所以有时候需要一些浓重的氛围营造。

▲改完之后，明显比改之前细节层次，尊享感更强一些，同时我们把这个设计细节，也一直沿用到整个产品设计中，让很平的页面细节丰富起来。

▲有底纹的运用，和没有底纹的运用，运用了底纹让页面更有质感，整个空间感也会更强烈，所以大家今天如果页面中没有细节，可以通过类似方式去添加，但是要注意，底纹元素一定要和品牌有关联，不能乱用。

▲我们熟悉的淘宝88会员也是在页面中大量使用圆形的底纹，这个圆形底纹是基于「88」这个数字圆形抽离出来的，细节非常的强。

3. 最后

这两个技巧，就是平时在项目中实际运用的，虽然都很小的点，但是看完就会用，用了就会出效果，希望各位都能掌握这个技巧。

转载声明：本文来源于网络，不作任何商业用途