有一个问题,做过设计管理的人,一定会遇到——
两个设计师的作品放在一起,你一眼就能看出哪个「业余」、哪个「专业」。但如果有人问你:「具体差在哪?」你可能会愣一下。说不上来,但就是能看出来。
这个「说不上来但能看出来」的东西,就是基本功。
就像篮球运动员——外行看投篮姿势,可能看不出区别;但教练一眼就知道,谁练过一万个小时。设计也一样。外行说不出哪里好,但直觉会告诉他「这个看起来靠谱」。
这一章,我把三个基本功——字体、色彩、版式——拆开来给你看。
1. 字体:很多人用错了
字体排印学(Typography)是一门完整的学科。但我只想讲一个最核心的东西——字体不是装饰,字体的目的,是让阅读更轻松。
很多人选字体,看的是「好不好看」「有没有个性」。但用户看字体,看的是「读起来累不累」。
有几个原则,值得记一下:
正文用无衬线。屏幕上的正文,无衬线体的可读性,远高于衬线体。苹果用 San Francisco,安卓用 Roboto,都是无衬线。如果你在 App 或网页正文里用了衬线体——除非你是纽约时报那种品牌调性——大概率用户会抱怨「字太小了」,其实不是字小,是衬线在屏幕上糊了。
不要混超过两种字体。一个页面里出现三种以上的字体,看起来就像拼凑的。一种标题字体加一种正文字体,够了。如果要区分层级,用字重(Regular、Bold)和字号,不要换字体。
层级靠对比,不靠换字体。标题和正文的区分,靠的是大小对比、粗细对比、颜色对比。不是「标题用 A 字体,正文用 B 字体」。
一个页面用了四种字体、标题和正文字号差距太小、行间距太紧,文字挤在一起。
统一的字体系统、标题字号是正文的两到三倍、行间距 1.5 到 1.8 倍、段落之间有呼吸感。
2. 色彩:不是「好看」,是「对的感觉」
色彩是设计里最容易被滥用、也最难掌握的基本功。
一个最常见的误解:暖色=热情、冷色=冷静。其实品类不同,色彩的情绪含义会完全不一样。
同样的红色,在数码产品上是「性能、力量」,在母婴产品上却是「危险、刺激」。所以数码可以用红色做主色,母婴就尽量不要。
同样的蓝色,在金融 App 上是「信任、可靠」,在食品 App 上却是「没食欲」。因为自然界里,几乎没有蓝色的食物。
选色彩不要凭「我觉得好看」。回到第九章的情绪版推导——你的品牌人格、你的品类、你的目标用户的审美偏好——这三者决定了你应该用什么色彩。
3. 版式:呼吸感
版式是最难教、也最容易被忽视的基本功。
因为版式不是「一个具体的技能」。是对空间的感知能力——知道什么元素该大、什么元素该小、什么元素之间该有多少距离。
判断一个设计师的版式基本功,看三样东西就够了:
负空间(留白)够不够?业余设计师怕「空」,总想塞满。专业设计师用「空」来制造焦点。一个页面如果没有足够的呼吸感——字间距、行间距、元素间距、区块间距都挤在一起——不管配色多好看,看起来都业余。
对齐做没做?元素之间有没有无形的对齐线?左对齐、右对齐、居中对齐——不能混。一个页面里如果左中右三种对齐方式全都出现了,那就是视觉噪音。
节奏对不对?一页之长,不是所有元素同等大小。有大的(标题、主图)、有中的(副标题、说明)、有小的(辅助信息)。大小错落有致,用户的视线才能自然流动。
下一章,我们把所有这些基本功——字体、色彩、版式、组件——串成一个完整的系统。设计系统不是组件库。是一个品牌在所有触点上的一致性表达。