维译通智能界面设计

问题背景

在维吾尔文与中文的翻译产品中，阿拉伯字母（RTL）渲染、双模型并行翻译以及译后评估选优是几个典型的工程与设计难点。UI 设计不仅要处理从文本到图片的输入切换，还要在单页工作台内清晰呈现识别状态、模型并行结果、多维度评测分数和最终采用译文。手工搭建这类页面时，常见的坑包括：绑定失效导致节点被错误地重新挂载到页面根节点；两个输入 Tab 没有互斥隐藏；维语字符串未设置 RTL 方向；以及排版细节如字重不符合字体规范。

核心能力

该技能交付的是一份 .ardot 设计文件，而非后端代码。它会按照自上而下的顺序绘制 7 个模块：顶部导航、四步流程条、输入模块、识别模块、双模型翻译、评估选优、最佳译文输出。整体采用现代 SaaS 风格：白底、紫（#5046E5）为主品牌色，青色代表随机模型，绿色标记最佳结果，琥珀色表示进度状态。绘制时遵循若干关键规则：

• 先用真实节点 ID 作为后续 batch_edit 的父级，绑定每次批量操作后即失效，不能复用。
• 维语文本一律设置 textDirection: "RTL"，保持原文不改写。
• 双模型卡片横排，评估区用三条指标（语义保真度、通顺度、术语准确）做加权综合分。
• 输出卡片高亮最佳译文，附带综合置信度与端到端耗时。
• 每完成一个区块，用 capture_layout(problemsOnly:true) 和 capture_screenshot 自检。

适用边界

该技能只产出界面设计稿，不负责调用翻译或 OCR 接口，也不编写模型代码。如果用户需要可运行的翻译服务，应明确将模型层交由工程团队实现。设计稿面向 1440 宽的工作台画布，深色模式和移动端适配不在默认范围内。