单一接口语言

1）什么是单一接口语言,为什么需要它

单一接口语言（EYAI）是由设计师，工程师，分析师和内容作者共享的概念，视觉规则和交互的一般系统。

• 一致性：不同产品和团队中的相同组件和术语。
• 速度：快速组装，更少的holivar，更快的onbording。
• 质量：一致的UX模式，"默认"可用性。
• 可扩展性：安全进化而不分解为"UI动物园"。

2）单一语言层

1.令牌（颜色，打字机，尺寸，阴影，缩进，半径，动画）。
2.组件（按钮、输入字段、表格、图形、调制解调器、烤面包、选项卡）。
3.模式（表格、验证、分步向导、清单/表格、通知）。
4.内容（微操作、术语、错误消息）。
5.肖像和插图（家庭，风格，尺寸和线条）。
6.可用性和i18n/RTL（A11y规则，可翻译性，位置）。
7.过程（版本，gaidrails，review，linters，店面和示例）。

3）设计令牌（表现力的基础）

令牌是所有产品中重新使用的命名值。

3.1令牌结构（示例）

json
{
"color": {
"bg": { "base": "#FFFFFF", "subtle": "#F7F8FA" },
"fg": { "primary": "#11131A", "muted": "#656D76" },
"accent": { "primary": "#2F6BFF", "warning": "#FF9F1A", "critical": "#E53935", "success": "#2EAE60" }
},
"space": { "xs": 4, "sm": 8, "md": 12, "lg": 16, "xl": 24, "2xl": 32 },
"radius": { "sm": 8, "md": 12, "lg": 16, "pill": 1000 },
"shadow": { "sm": "0 1px 2px rgba(0,0,0,.08)", "md": "0 4px 12px rgba(0,0,0,.10)" },
"font": { "family": "Inter, system-ui", "size": { "sm": 12, "md": 14, "lg": 16, "xl": 20 } },
"motion": { "duration": { "fast": 120, "base": 200, "slow": 320 }, "curve": { "inout": "ease-in-out" } }
}

3.2 Neiming令牌

从普通到私人： '颜色。accent.primary`, не `primaryBlue`.

与neiming中的品牌无关（品牌是主题，不是令牌名称）。
分级：'fg。muted`, `fg.primary`, `fg.inverse`.不要在没有系统的情况下以标题（"blue 500"）编码亮度。

3.3个令牌主题

明亮，黑暗，对比：改变含义，不是名字。
主题-覆盖层,UI保持一致。

4）组件： 合同、状态、可用性

组件=视觉+行为+合约+A11y。

4.1按钮合同示例

ts type ButtonProps = {
kind: "primary"      "secondary"      "tertiary"      "danger";
size: "sm"      "md"      "lg";
icon?: "plus"      "download"      "trash";
disabled?: boolean;
loading?: boolean;
ariaLabel?: string;
onClick?: (e: MouseEvent) => void;
};

状态："default/hover/active/focus/disabled/loading"。
可用性：焦环，目标尺寸≥ 40-48 px，toggle的"aria-pressed"。

4.2组件保修

稳定尺寸（线路，paddings）。
开箱即用（角色扮演/aria，键盘，对比）。
不变性：字段内的误差始终在底部并带有"aria-describedby"。

5）UX模式（可重复逻辑）

表格：左/顶部的标签，placeholder ≠标签，摘要+旁边的错误，输入掩码和提示。
调制解调器：一个主要CTA，"Esc"关闭，聚焦陷阱，聚焦回归。
表/列表：排序、粘性标题、排页、导出。
过滤器：显式的"应用"按钮,重置,保存的预设。
通知：tost ≤ 3-5 c，焦点暂停，'role='status/alert'。
Dashbords：顶级洞察力→ CTA → →图形的上下文。

6）单一术语和微写作

6.1词汇表

维护统一的业务和UX术语词汇表。每个接口文章都引用它。
对于双打，选择一个单词（"钱包"与"平衡"），第二个单词作为搜索的同义词。

6.2文本规则

简而言之，在案件中；避免行话。

错误-解释该怎么做： "请以GGG-MM-DD格式指定日期。"

标题是名词；按钮是动词（"保留","取消"）。
一致性单位：UTC或本地货币的日期/时间（EUR，USD）。

7）图像和插图

该家族是同构的：单个角度，线厚度，24 × 24网格。
状态和语义：颜色-次要；形式/图标+文本-主要。
缩放：象形图不以不同的密度"漂浮"（1 ×/2 ×/3 ×）。

8）可用性（A11y）和本地化（i18n/RTL）

组件通过WCAG AA：对比度，键盘导航，焦点，"预制运动"。
可翻译的字符串是资源，不是代码。播放器和数字/日期格式是本地化的。
RTL：图标镜像，正确的Tab顺序，键盘上的DnD逻辑。

9）数字、日期、货币和格式

日期/时间：ISO-8601，真实时间点-UTC；用户是本地。
货币：小单位/十进制行；始终指定代码（例如,12.34或12。34 EUR"-在本地）。
利息："12.3%"和"+1.2个百分点"明确区分。
四舍五入：达到有意义的放电；大数字的"k/m"。

10）Howernans： 角色，文物，频道

设计语言委员会（DLC）：代币/组件的所有者，RFC批准。

• 组件库（Figma/代码）+带示例的实时目录。
• 文件：gaidrails，模式，A11y，内容海德。
• 具有日期，级别（added/changed/deprecated/removed/fixed）的cheinjlog。
• 频道：每周设计合成器，Slack频道，showkeys实施。

11）转化与进化

用于组件包的SemVer： 'MAJOR。MINOR.PATCH`.

MINOR-加法：新令牌，带默认值的props，新组件。
MAJOR-破裂：删除散文，更改语义→迁移海德。
清除：警告，窗口≥ 90天，兼容性标志。

12）Linters和自动检查

UI-linter：令牌外禁止的颜色，反模式（按钮拨号，禁用外线）。
A11 y检查：对比，角色/aria，焦点，键盘。
i18n-linter：代码中的"硬"行，不正确的播放器。
截图测试：成分视觉回归。
可视化API合同（如果有）：数据类型、范围、签名。

13）组件展示（故事书/沙箱）

带有Props控制，代码，状态，A11 y检查器的实时示例。
"食谱"：注册表格，第3步向导，表+过滤器，调制解调器+敬酒。
"区域沙盒"：语言/格式切换/RTL。

14）神经模式和结构

14.1个组件（VEM/语义，CSS示例）

.btn/basic/
.btn--primary/view/
.btn--danger
.btn--lg/size/
.btn __ icon/part/

在代码中，是单调的props名称："size"，"kind"，"disabled"，"onClick"。

14.2库文件结构

/tokens
/components
/button
/input
/modal
/patterns
/docs
/changelog

15）反模式

令牌外的"自由"颜色/缩进。
组件双："ButtonV2"，"PrimaryButtonNew"。
播放器是唯一的字段标签。
禁用outline和"dive-butch"。
不可预测的hover/active/disabled。
音译术语代替正常翻译。
更新时没有迁移盖德。

16）单一语言质量指标

覆盖：使用组件库的屏幕比例。
一致性索引：重复使用令牌vs"手动"样式。
A11y通行率：通过WCAG AA的组件百分比。
Defect Escape：在1k commits上销售UI/内容缺陷。
时间到船：在DLS之前/之后实现类型屏幕的时间。
Adoption：DAU店面，公关数字与组件/模式。

17）屏幕支票清单

• 使用令牌（颜色/缩进/半径）而不使用"硬"值。
• 图书馆中的组件；种姓-仅在RFC下。
• 可用性：键盘/焦点/对比/角色扮演/aria。
• 单位：日期/货币/利息-按海德格式。
• Microcopies：按钮=动词，错误=纠正动作。
• Locali/RTL不会破坏布局。
• 状态：提供loading/empty/error。
• 视觉回归测试已更新。

18）实施计划（3次迭代）

迭代1-基础（2-3周）

令牌（颜色/打字机/spacing/motion），基本组件（Button，Input，Select，Tooltip，Modal），内容海德（音调，标签，错误）。
展示柜（storybook）和A11y-checker，令牌linter。

迭代2-模式和本地化（3-4周）

表格/表/过滤器模式，图标24 × 24，RTL/i18n沙箱，数字/日期/货币规则。
SemVer，cheinjlog，RFC/迁移过程，自动测试（视觉+A11 y）。

迭代3-规模和演化（连续）

复合组件（向导，DataGrid，Chart primitives），temization（浅色/深色/对比度），质量指标报告，定期的UX审核。

19）迷你常见问题

是否需要"一劳永逸"？
没有。从令牌和基本组件开始,然后添加模式和过程。

如何说服团队使用EIAI?

显示胜利：速度，少缺陷，现成的屏幕配方和"开箱即用"A11y。

如何处理传统屏幕?

迁移计划，通过令牌的桥梁样式，优先屏幕是第一个。

底线

单一接口语言不仅仅是组件库。这是一个规则和过程系统，其中令牌指定了表现力，分量是行为和可用性，模式是决策的可重复性，而howernance和度量标准是持续的演变。使语言清晰，可验证和可扩展-您的产品看起来和操作一致，快速且可靠。