档案库 · 产品创意 · 产品决策 · 2023
安全规则将视觉设计提炼为你可以每次安全遵循的具体规则
一个副项目页面，包含约25条视觉设计规则，每条都是具体的安全默认值，并配有视觉上的前后对比——2023年2月在Hacker News获得1978分。
Anthony Hobday (anthonyhobday.com)
当时的题目
Most visual-design guidance is abstract — 'make it clean', 'use breathing room' — so a non-expert cannot tell whether their work follows it. Hobday's side-project page offers rules that are 'safe to follow every time', each small enough to apply without taste or judgement, while explicitly allowing any rule to be broken for a good reason.
它是怎么成立的
Saferules，发布在anthonyhobday.com/sideprojects下，是一个单页的视觉设计指导，以默认值而不是文章的形式呈现。其开头说这些规则并不需要每次都遵循——任何有充分理由的人都可以打破它们——但它们每次都是安全可循的。这种框架将设计从品味问题变成了非设计师可以执行的清单。
每条规则都是具体且大多数字化的：使用近黑色和近白色而不是纯值；中性色饱和度低于5%；正文字体保持16px或以上；行长约70字符；按钮水平内边距是垂直的两倍；阴影模糊设置为距离的两倍；保持容器背景亮度差异在HSB中不超过12%（深色）或7%（浅色）。大多数规则配有并排视觉示例和简短原因，这样读者看到错误版本旁边是正确版本，而不是盲目相信指令。
该页面于2023年2月6日登上Hacker News，获得1978分和317条评论。评论线程不仅仅点赞——它还以这些规则所邀请的详细程度进行争论，为OLED屏幕上的纯黑辩护，引用数字，并讨论网站本身是否遵循了它自己的建议。
妙在哪
- 数字取代了判断：'使用近黑色'或'最低16px'对尚未培养设计品味的人是可以操作的，而'让它看起来干净'则不行。
- 每条规则旁边的错误/正确示例让读者一眼就能验证说法，而不是相信作者。
- 明确允许为了充分理由打破规则，使指南感觉像来自从业者的建议，而不是法律，这鼓励了讨论而不是服从。
- 一条规则引用了实证证据——约100个设计良好的网站的容器亮度——表明该默认值源于观察，而非凭空捏造。
- 纯文本和几乎零工具使该产物制作成本低且易于分享，因此是想法本身，而不是背后的活动，承载了关注。
做出来什么
Posted to Hacker News on 6 February 2023, the page drew 1,978 points and 317 comments — very large engagement for a plain text list — with the thread debating individual rules such as near-black/near-white against OLED and projector screens. The page stayed live as part of Hobday's side-projects section and remains the version readers link to.
可以借走的
具体的、可衡量的默认值比抽象的原则传播得更远：一条说‘用这个数字’并配有错误/正确图片的规则可以立即应用——并且能引发富有成效的争论。
后来
材料即产物：页面背后没有公司或产品。在发布线程中，评论者指出Hobday的其他副项目文章，引用规则，为OLED和投影显示添加例外，并要求网站提供日期和导航。页面保持不变地在线，每当该线程被引用时，这些规则就作为参考资料继续流传。其持久影响是证明了以安全默认值和示例形式编写的设计指导可以独立作为可分享的内容。
资料来源
- Visual design rules you can safely follow every time
- Visual design rules you can safely follow — Hacker News discussion
发现哪里写错了？告诉我们。
轮到你了
你刚读完一个点子。把你手上的题目说出来，看看谁接过同样的题。
免费账号 · 3 次免费提问 · 不用绑卡