AI提示词写不好 UI ?Google 的 DESIGN.md,正在把大厂设计语言变成“可执行说明书”

0 阅读5分钟

你有没有这种经历:

做一个B端后台界面,想知道Ant Design怎么处理表格,得去翻半天文档。

想参考苹果的字体规范,打开Human Interface Guidelines,几百页看着头皮发麻。

做个国际化产品,想看看Google Material和微软Fluent的风格差异,要开十几个标签页来回切。

找设计规范,比做设计本身还累。

前两天刷到一个朋友发的朋友圈:“收藏了100个设计资源网站,真用的时候一个都想不起来。”

底下评论区一片“+1”。

这不怪你。资源太多、太散、质量参差不齐,收藏即积灰,是所有人的通病。

但最近谷歌干了件好事。

它发布了一个叫 DESIGN.md 的项目,把全球知名大厂的设计语言、系统、规范、资源,全部整理到了一个地方。

一句话总结:这是设计师的“导航地图”,不是“又一个吃灰链接”。

一、找设计规范比做设计还累,你是不是也这样?

先说说为什么“找规范”这么痛苦。

痛点1:太散

苹果的HIG在官网,Google Material有自己的站点,微软Fluent在GitHub,Ant Design在国内社区,Semantic UI又是另一套……

你想对比一下移动端的导航栏设计规范,要开5个页面,眼睛都快瞎了。

痛点2:版本混乱

Material Design从2014年到现在,出了Material 1、Material 2、Material You……你搜到的教程,可能是3年前的版本,已经被淘汰了。

痛点3:语言和门槛

很多国外设计系统是全英文的,国内设计师理解起来有障碍。还有一堆专业术语:HIG、Fluent、Carbon、Atlassian……不熟的人一脸懵。

结果就是:

你花了一个小时找资料,最后还是在凭感觉做。

这不是你的问题,是信息组织的问题。

谷歌做搜索引擎起家的,最擅长什么?把散乱的信息组织成可用的知识。

DESIGN.md 就是它在设计领域的“PageRank”。

二、谷歌把“家底”翻出来了:DESIGN.md到底装了啥?

DESIGN.md 是一个GitHub仓库(github.com/google/design)。

简单说,它像一个“设计规范的图书馆”。

目前收录的内容包括:

1. 全球大厂设计系统

  • Google Material Design:谷歌自家的,移动端、Web都覆盖

  • Apple HIG:苹果人机交互指南,iOS/macOS的圣经

  • Microsoft Fluent:微软的设计系统,Windows和跨平台

  • IBM Carbon:企业级设计系统,B端产品的标杆

  • Atlassian Design:Jira、Confluence背后的设计语言

  • Shopify Polaris:电商领域的黄金标准

  • Salesforce Lightning:SaaS巨头的设计实践

2. 开源设计系统

除了大厂,它还收录了社区优秀的开源方案:

  • Ant Design:蚂蚁金服的,国内B端首选

  • Semantic UI:语义化CSS框架

  • Bootstrap:前端圈的“老大哥”

  • Tailwind UI:实用优先的组件库

3. 设计工具和资源

不只是规范,还有:

  • 设计系统的代码实现

  • UI kits和组件库

  • 设计Token(颜色、字体、间距等变量)

  • 设计系统的案例研究和文章

4. 行业标准

  • W3C的无障碍设计规范

  • ISO的设计标准

  • 设计系统的测试和度量方法

关键是:它不是简单列了一堆链接。

每个条目都有:

  • 清晰的分类(大厂/开源/工具)

  • 简要介绍(这是什么、解决了什么问题)

  • 官方链接(直达权威)

  • 适用场景(Web/移动端/桌面/企业级)

这意味着什么?

你不需要再收藏100个混乱的链接。

你只需要记住这一个。

三、这份“设计地图”该怎么用?别只收藏吃灰

我猜你可能已经准备去点Star了。

先别急。

收藏不用的资源,等于没有。

我给你三个“立刻能用”的方法。

方法1:做竞品分析时,拿来当参考坐标系

比如你要做一款SaaS产品。

不知道“表格”该怎么设计?

打开DESIGN.md → 找IBM Carbon → 看它的Data Table规范 → 再对比Ant Design的Table → 找出共性和差异。

10分钟,你就能得出“业界标准做法是什么”。

不用猜,不用凭感觉。

方法2:培训新设计师时,当“教科书”用

我带过很多新人,最大的问题不是不会用Figma,而是不知道为什么这么设计

你说“按钮要有足够的对比度”,他问“什么是对比度”。

现在你可以说:“去看Apple HIG的颜色规范,第3.2节。”

DESIGN.md 里全是大厂的“标准答案”。新人看完,至少不会犯低级错误。

方法3:做国际化产品时,当“文化地图”

不同国家的设计偏好不一样:

  • 美国用户喜欢大而全、功能导向

  • 日本用户喜欢简约、细节精致

  • 欧洲用户注重隐私和数据保护

DESIGN.md 里收录了不同国家的设计系统(比如中国的Ant Design、日本的开源方案),你可以直接参考它们“怎么处理本地化”。

别把它当收藏夹,把它当你每天开工前的“5分钟检索工具”。

每天5分钟,翻一个设计系统。

一个月后,你的设计视野会完全不一样。

我一直在想一个问题:

很多人做不好设计,真的是天赋不够吗?

AI时代,技术门槛越来越低,Figma会用、AI会生成、工具越来越强。

但差的是什么?

差的是“见识”。

你不知道苹果的导航栏为什么这么设计,你就只能抄个样子。

你不知道Ant Design的表格为什么用“左对齐”,你就不会判断什么时候该改。

DESIGN.md 本质上是一个“设计见识加速器”。

你不用花10年去大厂蹲着学。

谷歌把大厂的经验、教训、标准,整理成了一份目录,摆在你面前。

剩下的,就看你了。