配色和字体的对比一直都很受大家的重视。在制定设计规范的时候,我们首先会去确定产品的主色调和辅助色。对于文字来说,不同级别的文字(标题类,正文类,提示类)会选择不同的字号和字色,这些都是会出现在你的设计规范中。然而我很少看到有人在设计规范里提到间距,所以从这个角度来看,间距经常会被我们忽视。那么这篇文章里我就对间距做了一个比较简单的总结。
那么如果我们想了解间距乃至更加规范的使用间距,首先我们要明白为什么要使用间距。间距的使用有很多作用,可以吸引用户注意力、提升内容的可读性,阐述元素之间的关系。其实简单来说,间距的作用可以归纳成一句话:建立视觉层级来简化界面内容,让用户更容易接受。
一个物体周围的留白越多,就会越容易吸引用户的注意力。
从信息层级的角度来说,级别越高的内容间距越大。因为越重要的内容就要吸引用户越多的注意力,因此为了更好的进行区分,块内间距都是小于块外间距的。
以Airbnb为例,因为从信息层级的角度来说,一个房源(内容块)的级别要比其介绍信息要高的多,所以每个房源之间的间距要大于房间图片、位置、价格的间距。
概同样可以用来影响一款产品的设计风格。
同样的内容,左边的使用线条,右边使用间距。从上面这个图,我们也可以看出线条受到设计师冷落的原因。线条的使用会极大的分散用户的注意力,整个界面会会稍显拥挤。
虎扑的界面是有线条的,但是我发现把线条去掉以后用户还是能够通过间距来很好的区分内容。
设计师要做好设计要把自己带入用户的角色,但是也不要去“代表”用户。通过自己的主观臆想去做设计,觉得这个界面好看就行了,但是好看对于用户来说不一定好用。可是现在设计师很少能参与到用户调研过程中,所以在工作中,我们的一些想法无法得到数据的佐证。这也是现阶段大部分设计师的一个痛点。