做设计的我们,需要实时考虑我们所设计的对象之间的联系,也就是我们常说的亲密性。
经常在浏览产品界面时,不止一次的,发现一些APP界面,或者PC端界面,做的很美观,但是,却忽略了设计对象之间亲密性。
下面我贴两张图片:
左右图都是我调整过的,为了说明本文提到的问题(图片来源:站酷)。
两张界面第一眼看过去,并无太多不一样的地方。但是细看,就会发现在底下图文模式结合的设计模块中,是有区别的。
左图中,第二段标题文字,与上下图片的间距是一样的。看着非常难辨别,不知道它是上图的说明,还是下图的。这个时候,它与上下图片的亲密性是一样的,会让用户产生误会,不知道它是归属哪里的。这样的设计无非是失败的,因为它没有成功的传达正确的信息,并且让用户多了许多额外的思考,还有可能传递错的信息。
我们再来看右图,仅仅是拉大了标题与上图的间距,但是,让第二行的标题与下图的亲密性明显提高。这样既不改变用户界面的美观性,也成功的传递了信息。
所以,如果两个东西距离很近(比如一张图片紧邻一段文字),那么用户就会认为它们之间是有联系的。
亲密性是很多设计师忽略的一点,我想通过本文让大家知道,亲密性的重要性。
建立设计对象亲密性的方法很多,比如:用线、用框,但是,一般先考虑拉大间距。因为拉大间距足够建立设计对象之间的亲密性,并且还能让界面不失简洁。
这里有一句话送给大家:无关内容间距要大,相关内容间距要小。
小马哥的分享就到这里,欢迎大家关注设计小马哥,我是一个很宠粉的公众号哦。