Tradução do lado do cliente com IA

Maud Nalpas
Maud Nalpas
Kenji Baheux
Kenji Baheux

Publicado em: 16 de maio de 2024, última atualização: 13 de novembro de 2024

Explicação Web Extensões Status do Chrome Intenção
MDN Chrome 138 Chrome 138 Ver Intenção de envio

Expandir seus negócios para mercados internacionais pode ser caro. Mais mercados provavelmente significam mais idiomas para oferecer suporte, e mais idiomas podem gerar desafios com recursos e fluxos interativos, como o chat de suporte pós-venda. Se a empresa tiver apenas agentes de suporte que falam inglês, os falantes não nativos podem ter dificuldade para explicar exatamente qual problema encontraram.

Como podemos usar a IA para melhorar a experiência de quem fala vários idiomas, minimizar os riscos e confirmar se vale a pena investir em agentes de suporte que falam outros idiomas?

Alguns usuários tentam superar a barreira do idioma com o recurso de tradução de página integrado ao navegador ou com ferramentas de terceiros. Mas a experiência do usuário é insatisfatória com recursos interativos, como nosso chat de suporte pós-venda.

Para ferramentas de chat com tradução integrada, é importante minimizar os atrasos. Ao processar o idioma no dispositivo, é possível traduzir em tempo real, antes que o usuário envie a mensagem.

No entanto, a transparência é fundamental ao preencher uma lacuna de idioma com ferramentas automatizadas. Antes de começar a conversa, deixe claro que você implementou ferramentas de IA que permitem essa tradução. Isso define expectativas e ajuda a evitar momentos constrangedores se a tradução não for perfeita. Inclua um link para sua política com mais informações.

Estamos trabalhando em uma API Translator do lado do cliente com um modelo integrado ao Chrome.

Revisar os requisitos de hardware

Os desenvolvedores e usuários que operam recursos usando essas APIs no Chrome precisam atender aos seguintes requisitos. Outros navegadores podem ter requisitos operacionais diferentes.

As APIs Language Detector e Translator funcionam no Chrome em computadores. Essas APIs não funcionam em dispositivos móveis. As APIs Prompt, Summarizer, Writer e Rewriter funcionam no Chrome quando as seguintes condições são atendidas:

  • Sistema operacional: Windows 10 ou 11, macOS 13 ou mais recente (Ventura e versões posteriores) ou Linux. O Chrome para Android, iOS e ChromeOS ainda não é compatível com as APIs que usam o Gemini Nano.
  • Armazenamento: pelo menos 22 GB de espaço livre no volume que contém seu perfil do Chrome.
  • GPU: mais de 4 GB de VRAM.
  • Rede: dados ilimitados ou uma conexão ilimitada.

O tamanho exato do Gemini Nano pode variar conforme o navegador atualiza o modelo. Para determinar o tamanho atual, acesse chrome://on-device-internals e clique em Status do modelo. Abra o Caminho do arquivo listado para determinar o tamanho do modelo.

Chat de demonstração

Criamos um chat de suporte ao cliente que permite aos usuários digitar no idioma nativo e receber tradução em tempo real para o representante de suporte.

Usar a API Translator

Para determinar se a API Translator é compatível, execute o seguinte snippet de detecção de recursos.

if ('Translator' in self) {
  // The Translator API is supported.
}

Verificar o suporte a pares de idiomas

A tradução é gerenciada com pacotes de idiomas baixados sob demanda. Um pacote de idioma é como um dicionário para um determinado idioma.

  • sourceLanguage: o idioma atual do texto.
  • targetLanguage: o idioma final para o qual o texto será traduzido.

Use códigos curtos de idioma BCP 47 como strings. Por exemplo, 'es' para espanhol ou 'fr' para francês.

Determine a disponibilidade do modelo e aguarde o downloadprogress:

const translator = await Translator.create({
  sourceLanguage: 'es',
  targetLanguage: 'fr',
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded * 100}%`);
    });
  },
});

Se o download falhar, os eventos downloadprogress serão interrompidos e a promessa ready será rejeitada.

Criar e executar o tradutor

Para criar um tradutor, chame a função assíncrona create(). Ele exige um parâmetro de opções com dois campos, um para o sourceLanguage e outro para o targetLanguage.

// Create a translator that translates from English to French.
const translator = await Translator.create({
  sourceLanguage: 'en',
  targetLanguage: 'fr',
});

Depois de ter um tradutor, chame a função assíncrona translate() para traduzir o texto.

await translator.translate('Where is the next bus stop, please?');
// "Où est le prochain arrêt de bus, s'il vous plaît ?"

Próximas etapas

Queremos saber o que você está criando com a API Translator. Compartilhe seus sites e aplicativos da Web com a gente no X, YouTube e LinkedIn.

Inscreva-se no programa de pré-lançamento para testar essa e outras APIs com protótipos locais.