About a Designer (5) “基础”不简单

Beforweb 重新开动的时候说起“About a Designer”也会继续，那么我们继续。
​
前情回顾下？去年 12 月完成了第一章内容，关于我“从手机销售到网页设计师”的转行历程——从第一代触屏智能手机，到野蛮自学立志转行，到艰难维生进退维谷，最终幸运地抓住机会成为网页设计师，故事告一段落。

然而在最初的“广而告之”当中，预计会叨念的还不止这些；接下来的更多内容应该会试着围绕一个个话题展开，而不再以流水账大故事作为驱动了。

“基础”不简单

几周前收到一份 widget 的设计稿。形式很简单，medium 规格，上下两组内容单元，各自包含一行标题和一行描述，逻辑如下：

然而我第一眼看到之后的印象却是：

很明显，“描述 A”本应与“标题 A”保持较近的距离，形成逻辑上的分组；但设计稿中的“描述 A”却和“标题 B”过近，以至于使人误认为它是“内容 B”的描述信息；而原本的“标题 A”与“描述 B”被错误的距离所分隔，于是形成了各自独立的感知。

毕竟来自正经产品团队，设计师大体具备最基本的专业度，这类基础性的问题理应避免。每每遇到这类情况，我总会想到那本《写给大家看的设计书》。

我的第一本“设计书”

正如在上一篇当中聊到，我在 2006 年 4 月加入博客大巴，成为一名网页设计师。当时的主要工作是设计制作博客模板——即便十四年之后的如今回想起来，这份工作也仍然很棒——职责之一是设计模板的主题外观，天马行空挥洒想法，只要气质符合博客大巴的整体基调；职责之二就是自力更生完成所有前端代码，还原设计方案，并且兼容包括 IE 6 在内的各种主流浏览器——如此具有综合性与挑战性的工作。

如今只能通过历史快照工具来回顾十四年前的工作成果

作为一个“一定要很努力”的新手，在第一年里，我更多是在游泳中学习游泳——设计方面，参考着 CSS Zen Garden 等网站进行了大量的模仿练习，无论是“感觉”还是PS、Illustrator 的水平都有了不少提升；前端方面，“标准化 Web 开发”方面的书也正经开始学习起来，转手实践到自己的设计里，页面写得越来越健壮灵活。但所有这些“学习”，更像是在忙着应对这份让我感到非常兴奋而又陌生的工作；我仍然没有去学习一些真正意义上关于“设计”的东西。

博客模板这种东西，主题风格与视觉创意只是“设计”当中的一部分；真正决定了用户是否愿意长久使用的，还是文本内容方面的呈现质量，包括日志本身以及侧边栏里的信息等等。在“应对”这份工作一年多之后，我越发频繁地感到内容部分总是哪里不对。正像第二篇里所说，“对我来说，学任何东西似乎都是持续往复着这样的循环…先上手，再矫正收归，继而保持迭代”，于是我估摸着到了该收归经验和补充理论知识的时候了。

学习理论自然从读书开始。买来一批“设计书”，每晚约 10 点至夜里 1 点，坐在客厅一边陪着一只叫做斑斑的幼猫…一边狂读——2007年秋天，刚刚开始养斑斑，出于安全考虑先将它和推推隔开，单独养在客厅；又怕隔离太孤独，于是这样每晚坐在客厅读书，也算给它个陪伴。上手的第一本便是《写给大家看的设计书》，约莫当时从书名判断够初级，缺乏学科背景的人也不会有什么阅读障碍一类。

当年的幼猫，如今也已十三岁

回头看来突然发现，自从养猫开始，学习方式也健康了很多嘛，不再像卖手机时期那样摧枯拉朽的自毁了；平静的甚至有些禅意嗯。

印象里就是开悟了，“原来是这么回事哦”这样。“亲密性”，“对齐”，“重复”，“对比”——读过这四点简单的原理，抬头再去看网页，博客，包括书籍杂志、印刷品——凡是涉及通过文字内容传递信息的载体，原来里面都蕴含着这些最基本的规则——原来这些全部都是有意设计过的；而那些设计不当的内容，其中的问题也变得一目了然，包括自己在第一年里设计的那些博客模板——要么是内容表现出的分组关系没有正确体现它们之间的逻辑关系；要么是文本的对齐方式缺乏统一性或有意的差异性；要么是没有通过正确的重复模式来传达信息的类型逻辑；要么是没有综合运用多种设计元素来构建信息的层次与对比，进而难以体现内容的主次关系。

而当我试着遵照这些原理规则去调整页面里的文本内容样式时，我发现了三方面的收益：

• 以上这些问题逐渐得到解决，页面看上去越来越“对”了。
• 这让我开始更多地从目标用途、重要性和逻辑关系的角度来打量各种类型的信息，而不再只是简单地把它们看作“文本”。
• 从前端实现的角度，也越来越理解元素语义的重要性——信息的逻辑关系一定是可以体现在高度语义化的 HTML 代码里的。

坦诚讲，那时我甚至不确定也并没有很在意这本书里的内容是否真的属于所谓的“设计原理”，因为它们看起来太朴实无华且显而易见了。但我非常确定这些东西会让页面内容不仅看起来更“漂亮”，同时读起来也更轻松，更容易快速地甚至是下意识地理解信息的性质与含义。

想到 Mike Stern 在 2017 年 WWDC 上讲过的一句话，“或许你会觉得这些原理看起来非常基础或是显而易见，但在很多时候，意义最为深远的，往往正是那些看上去非常简单的东西。” 就是这么回事。这里也为各位推荐“图文版 WWDC 设计分会：基础设计原理”这套内容。

“基础设计原理”，WWDC 2017，Mike Stern.

基础问题？

直到如今我也认为以上这些基础到有些朴素的“规则”是设计师最基本的职业能力之一。然而事实是，那之后的十四年间，直到如今，我们仍然会时不时就在这样那样的产品界面或其他信息媒介当中发现大大小小的脱离不开这些基础范畴的问题，包括本文开头提到的情形。

我从不愿把原因归结为“设计师的基本能力缺失”一类，理由很简单——我是一个依靠胡乱自学和莫名其妙的运道从手机销售转行到互联网设计的门外汉，我在很长一段时间内都真心相信我所具备的意识与能力应该是这个行业的下限，是所有设计或相关专业出身的设计师所必然具备的；我更愿意相信这类状况多数是因为如今的设计师们必须将更多精力放在相对“高阶”的问题当中，例如利用缜密的数学手段研究用户行为，终日处理复杂的业务逻辑和服务流程，或是打磨风格化的视觉效果等等，因而在无意中忽略了一些相对基础的东西。

但从某种角度来说，这也意味着“基础”并不简单，至少不会简单到无需投入心思就能正确实现的程度。我所反复念叨的“基础”，在我个人看来更接近于“essential”，即“基本而必要的，重要而必不可少的”，而非“basic”或“junior”这类“初级”概念。

或许“基础”的中文表意确实容易让人产生误解。过去在和一些年轻朋友合作的过程里，每每发现类似的问题，我都会絮絮叨叨各种“基础”、“基本能力”、“常识”一类字眼儿，以至于一些同学真的感到被侮辱，甚至可能，哭了。简直仿佛这年头“基础”已经成了骂人的词儿。

我这些年来得罪过的行业中人倒是不在少数。捂嘴笑。但因为这么一个词儿而得罪甚至是伤害到一些设计师朋友，也着实划不来。不，我或许不该甩锅给“词语的中文表意”一类；问题恐怕还是出在我的表达方式上。我猜。我在这些场景中或许更多是以最直白快速益于解决问题的方式，而非通过循循善诱令人易于接受的方式，来温和而婉转地传达信息。我猜。

但有一点我很确定——如果你读过第一篇当中关于我当年艰难转行的经历——我在十四年前身为一个手机销售，每天夜里像一只可笑又可怜的没头苍蝇一样鲁莽自学设计的时候，盲目乐观裸辞在家自我感觉良好地做着所谓的网站设计和习作的时候，一次一次面试失败而毫无头绪几乎彻底绝望的时候——回想所有这些，我真的好希望那些时候能有个在行业里还算有些经验的人，来为我这个门外汉指出所有的“基础”问题，来告诉我缺乏哪些基本素养与知识；纵使这个人的态度再直白再严厉再不留情面，我也会由衷地感到庆幸与感恩。

说到这里突然开始有些沮丧。无意继续言语。

本文仅关于个人经历与相关看法，而非特定书籍的推荐，且仅代表个人观点。