多留意设计模型 | 《Web 界面设计》读后感

图片来源：豆瓣读书

在我的固有认知里，O’REILLY 的书籍向来都是专业而深奥的，唯有神秘的程序员们才会触碰。所以，当我人生第一次读完一本 O’REILLY 时，便有一种莫名其妙的欢喜和得意。

话归正题。

我们每天都会接触大量设计模型。单单「拖放」这个动作，就能在这么些场景中遇上：

• 把文件拖放到文件夹
• 调整 To-do 列表顺序
• 在地图上左右挪动位置
• 把文件拖到 QQ 对话框发送
• 在 Excel 中按列复制单元格内容
• 选择复制文字时拖动鼠标（或滑动手指）

可我们是否刻意思考过，「拖放」这个简单的交互动作，可以分成哪几类？每次操作都包含多少个事件？都涉及到哪些元素？

思考得够深，够全，应该是交互设计中该有的功底。即便是在页面中放一个小小的按钮，因其而来的影响也不容小觑。鼠标悬停时、点击时、点击后该按钮呈现什么样子？点击后服务器可能会提供哪些反馈？每一种反馈又需要另一套怎样的体系来支撑？……

设计必定是环环相扣的，因此在设计模型的选择使用上就颇有讲究。要讲究，自然离不开对各种设计模型的熟悉掌握和运用。《Web 界面设计》这本书的魅力也就恰恰在此：对于常见设计模型的归纳和对应的最佳实践的总结。

尽管书里所举例子都有些过时了，但它对于一些设计模型（比如编辑、输入、分页、转场等）的详细阐述和系统分析却无可挑剔，让人惊讶于界面交互的纷繁复杂的同时也为之一振：自己还有那么大的学习进步空间！

平时虽也留意一些设计模型库（比如 ui-pattern.com），但不到用时，便绝不会刻意去了解个究竟的。

之前总有大神强调说，要做好产品经理，首先得把 App Store 里的 App 玩个转。

在理。

当自己缺乏一个系统性的知识体系时，能不能提出一个像样的解决方案，全靠过往是否有丰富的体验。

你觉得这里怎样做切换比较好？

那个 XX App 的切换做得挺好的，我们可以参考参考。

但问题终究还在：哪怕把所有 App 体验一遍，不做总结归纳的话也仍然极其受限。印象不够深刻的体验，过了就忘了，需要举例说明时便也没了信手拈来的优雅。

所以，阅读《Web 界面设计》这种书就大有裨益：加强和完善碎片化知识。正如《把时间当做朋友》一书里所说：

在这样的时代里，「阅读」突破了个体的「体验」或者单纯的「试错」的种种局限。「体验」往往只能局限于自己，而「试错」也受限于自己的阅历。然而，通过「阅读」，我们可以得知他人的「体验」和「试错」结果（即所谓的「经验」）。

这么看来，以后除了多多留心平时那些熟视无睹的设计外，还得多读一读其他 O’REILLY 了。

---

本文最早在 2016 年 3 月 13 日发布。