利用 AI 进行客户端翻译

探索实验性 Translator API，为全球客户服务赋能。

Maud Nalpas
Maud Nalpas
X GitHub
Kenji Baheux
Kenji Baheux
Alexandra Klepper

发布时间：2024 年 5 月 16 日；上次更新时间：2024 年 11 月 13 日

将业务拓展到国际市场可能需要投入大量资金。覆盖的市场越多，支持的语言就可能越多，而支持的语言越多，互动功能和流程（例如售后支持聊天）就可能越有挑战。如果贵公司只有英语支持人员，非英语母语人士可能难以准确说明自己遇到了什么问题。

如何利用 AI 为使用多种语言的用户改善体验，同时最大限度地降低风险并确认是否值得投资聘请精通其他语言的支持人员？

有些用户会尝试使用浏览器的内置网页翻译功能或第三方工具来克服语言障碍。但与互动功能（例如我们的售后支持聊天）相比，用户体验不佳。

对于集成了翻译功能的聊天工具，请务必尽量缩短延迟时间。通过在设备端处理语言，您可以在用户提交消息之前实时进行翻译。

不过，在使用自动化工具跨越语言鸿沟时，透明度至关重要。请注意，在对话开始之前，请明确说明您已实现支持此翻译的 AI 工具。这样可以让观众有心理准备，并避免在翻译不完美时出现尴尬的情况。提供指向包含更多信息的政策的链接。

我们正在开发客户端 Translator API，并将模型内置到 Chrome 中。

演示聊天

我们打造了客户服务聊天功能，让用户可以用自己的第一语言输入内容，并接收支持人员的实时翻译。

使用 Translator API

此 Translator API 有两个重要方法：

  • canTranslate()：检查是否有适用于您的语言对的翻译模型。如果设备上已有模型，则返回 "readily"；如果浏览器需要先下载模型，则返回 "after-download"；如果无法进行翻译，则返回 "no"。
  • createTranslator()：这会异步设置 Translator 对象。如果模型需要下载，系统会等待下载完成。

Translator 对象只有一个方法：

  • translate()：向其提供源文本，系统会输出译文。

由于此功能目前处于实验阶段且仅适用于 Chrome，因此请务必将所有代码封装在功能检测中。

const supportsOnDevice = 'model' in window && 'createTranslator' in model;
if (!supportsOnDevice) {
  return;
}

const parameters = { sourceLanguage: 'en', targetLanguage: 'pt' };
const modelState = await model.canTranslate(parameters);
if (modelState === 'no') {
  return;
}
const onDeviceTranslator = await model.createTranslator(parameters);

const result = await onDeviceTranslator.translate(input);
if (!result) {
  throw new Error('Failed to translate');
}
return result;

模型需要时间才能向用户提供。您可以通过以下两种方式解决此问题：

  • 等待模型准备就绪后，再启用依托翻译功能的界面元素。
  • 首先使用服务器端 AI 进行翻译，然后在模型下载完毕后切换到客户端。

后续步骤

注册 Translator API 源代码试用，为您源代码中的所有 Chrome 用户启用翻译功能。

我们期待收到您的反馈。如需分享您对此方法的反馈，请在说明文档中创建问题，并告诉我们您最感兴趣的用例。

您可以注册参加早期预览计划，以便使用本地原型测试此技术和其他早期 API。