其实一个画面能够那么精致都是无数的细节堆出来的，很多人都只关注“大细节”，却很少关注“小细节”，但其实很多时候，就是那么多不起眼的小细节，影响着我们最终的输出效果。

今天我们来简单看几个小细节，真的是很小很小，很容易被忽略，都是实战项目。

1. 一个加号的细节

在管理人员的时候，我们需要添加或者删除人员的操作，也就是常见的加号、减号，最开始设计师做的效果是这样的：

其实也没有什么大问题，但就是差点精致度，如果一个页面，每个点都差点精致度，合起来就会差很多，于是我们就去想为什么它没有那么精致。

首先，我觉得线是有点太粗了，于是我们变细了一点：

其次呢，是否可以在对比上再加一点细节呢？比如里粗外细、里实外虚，于是我们咔咔一顿调整，最后选择了下面三张图的最后一版：

我们看下和第一稿时的区别：

是不是精致很多，虽然是很小的细节，但也影响着整体的效果。

2. 小面积少用大渐变

我们在做页面的时候经常会使用渐变色，有时候还会使用那种比较大的渐变，比如对比色渐变、互补色渐变，像下面这种：

在大面积上使用是没有什么问题的，但小面积就不一定了，比如这种小面的对号，用了渐变色，基本看不到，还影响识别：

不如直接就用白色算了：

不一定所有地方都要使用主色渐变。

再比如我们经常用的按钮，大渐变的按钮，最好别让按钮太短，要有一个最短宽度，这样两个字的时候会好看些，比如下面这两种：

是不是第二个会好一点，既然我们用了大渐变，就一定要让渐变释放出来，不然憋在一个小面积里，看不清楚，那就没意义了。

3. 前后逻辑的问题

当信息层级有前后关系的时候，正常情况下，都应该是前面的是亮起的，后面的是暗的，比如背景灰色，前面的卡片是白色：

再比如，分类页面的侧边栏，选中的是白色，非选中的是灰色：

我们可以看下最近的的一个实际案例：

有一些地方的逻辑是ok的，比如这种信息亮起、弹窗浮层亮起，后面背景暗下去：

但是有一个问题，聊天列表，选中的列表是深色，没选中的反而亮起到前面来了：

这就给人一种好像所有的列表都被选中的感觉，怪怪的，后来我们优化了一下：

这样就没那么奇怪了。这种都是考验一些基本逻辑的问题，千万不能出错，不然就会看起来很奇怪。

总结

好了，以上就是今天分享的几个很细节很细节的小点，可能在很多人眼里觉得很不起眼，但这些小点真的都是非常重要的，都是支撑我们页面精致美观的必要条件。

Powered by Froala Editor