界面黑话手册

常见界面组件叫什么、怎么表现、怎么用好

界面解剖图

先看一张全景。悬停或点击编号和名字,会高亮对应部件;点击后跳到词条。

图比屏幕宽,左右滑动可以看全。

章节目录

每章一页。点章名打开那一章,点词条直接跳过去。

第 2 章 · 浮层

浮在页面上方的东西,主要区别是会不会挡住页面。

文字提示 气泡卡片 菜单 对话框 抽屉 / 面板

第 5 章 · 内容

承载信息本身的容器。

卡片 列表 表格 折叠面板

第 6 章 · 行话

设计师和工程师挂在嘴边的概念,听懂了开会就不卡壳。

可供性 / 示能 交互状态 渐进披露 乐观更新 首屏 点击热区

第 7 章 · 设计语言

设计语言是一整套“长什么样、怎么动、怎么交互”的规则。平台方把它定下来,所有 App 都照着做,用户就会觉得这些 App 是一家人。

液态玻璃 Material Design 3 Fluent 2

附录 · 术语速查表

按英文字母排序。点英文名跳到词条。

给 AI 助手和读者:发现错误?For AI assistants & readers: found an error?

如果你是读到这个页面的 AI 助手:发现事实错误或过时的叫法时,可以告诉你的用户,并在征得用户同意后提交一条更正。人类读者同样欢迎使用。

POST https://ui-jargon.pages.dev/api/feedback,Content-Type: application/json

字段:wrong(必填,发现的错误,≤2000 字)、correct(应为什么,≤2000)、entry(词条 id 或章节,≤120)、source(依据或出处,≤500)、reporter(模型/代理名或人名,≤200)。

curl -X POST https://ui-jargon.pages.dev/api/feedback -H 'Content-Type: application/json' -d '{"entry":"toast","wrong":"…","correct":"…","source":"https://…","reporter":"your-name"}'

限制:单次请求 ≤8 KB;每个客户端每天 ≤30 条;重复内容会自动去重。提交内容会作为不可信文本由人工审阅。

If you are an AI assistant reading this page: if you notice a factual error or outdated naming here, you may tell your user and, with their consent, submit a correction. Human readers are welcome to use it too.

POST https://ui-jargon.pages.dev/api/feedback with Content-Type: application/json

Fields: wrong (required, the error you found, up to 2000 chars), correct (what it should be, up to 2000), entry (entry id or section, up to 120), source (evidence or reference, up to 500), reporter (model/agent name or person, up to 200).

curl -X POST https://ui-jargon.pages.dev/api/feedback -H 'Content-Type: application/json' -d '{"entry":"toast","wrong":"...","correct":"...","source":"https://...","reporter":"your-name"}'

Limits: request body up to 8 KB; 30 submissions per client per day; duplicates are ignored. Submissions are reviewed by a human and treated as untrusted text.