Pular para o conteúdo principal
Este guia explica o que você pode personalizar na experiência de WebView biométrica, como usar a tool [Webview] Biometric UI Configuration, quais saídas esperar ao testar e como preencher cada parâmetro de entrada.

​
O que você pode personalizar

Você pode alinhar a experiência à sua marca e regras de negócio com:
  • Cores e modo (claro ou escuro, com pares de variáveis por tema).
  • Idioma dos textos da interface e se o usuário pode trocar de idioma.
  • Validação legal (link para termos e condições).
  • Validação de segurança (limiar de facematch e verificação ghost do documento).
Os widgets de captura de rosto e de documento não são personalizáveis; veja Elementos não modificáveis abaixo.

​
Configuração no Brain

Defina aparência e regras de UI com a tool [Webview] Biometric UI Configuration.
1

Crie um workflow dedicado

Crie um novo workflow no Brain para esta tool. As alterações de personalização da UI do WebView devem ser aplicadas apenas uma vez; você pode manter este workflow como o único lugar onde executa a atualização de configuração.
Modal Criar skill no Jelou Producto para nomear o workflow dedicado
2

Localize a tool

Na barra lateral, busque pelo nome da tool. Se ainda não estiver conectada, abra o ícone Tools na barra lateral e localize [Webview] Biometric UI Configuration no catálogo.
Marketplace com a tool [Webview] Biometric UI Configuration selecionada e conectada ao nó Início
3

Conecte, arraste e configure

Conecte a tool, arraste-a para o canvas do workflow e preencha os campos na barra lateral direita com o nó selecionado. Consulte a aba Entradas na seção Configuração abaixo.
Painel lateral do nó com seletor de versão da tool e instrução para configurar entradas
4

Inclua as mensagens das saídas

Na aba Saídas do nó, conecte cada ramo da tool ao restante do fluxo e defina a mensagem (ou a ação seguinte) que deve ser executada em cada caso. A tool expõe três variáveis de saída:
  • success — corresponde a UI atualizada: a configuração foi aplicada corretamente à UI do WebView.
  • noData — corresponde a Não foram encontradas alterações para atualizar (por exemplo, valores iguais aos já vigentes ou validação que impede salvar).
  • error — corresponde a Erro no serviço (falha ao comunicar com o serviço que persiste a configuração).
Canvas com saídas UI atualizada, sem alterações e erro no serviço ligadas a nós Texto com mensagens
5

Teste o workflow

Use Testar no workflow. Deve retornar sucesso (saída UI atualizada, variável success) quando as alterações forem aplicadas corretamente à experiência WebView.
Painel Testar projeto com execução bem-sucedida e mensagem do nó Texto na ramificação UI atualizada

​
Configuração

​
Cores da UI
enum
Nome da variável: Cores da UIVariável: colorsDescrição: Ativa a paleta personalizada (true / false). Com true, você deve definir Modo e as cores HEX do tema escolhido. Com a paleta ativa, valide contraste e legibilidade entre fundo, texto e botões (principalmente se o tema do dispositivo puder mudar).Valores disponíveis: true, false
​
Modo
enum
Nome da variável: ModoVariável: ModoDescrição: Tema base Claro ou Escuro; define qual conjunto de cores se aplica.Valores disponíveis: Claro, OscuroObrigatório quando: colors = trueNo modo claro, use primaryColor, secondaryColor, tertiaryColor, backgroundColor e fontColor.No modo escuro, use primaryDarkColor, secondaryDarkColor, tertiaryDarkColor, backgroundDarkColor e fontDarkColor (os mesmos cinco papéis visuais, variante de tema).
​
Cor primária (modo claro)
string
Nome da variável: Cor primária (modo claro)Variável: primaryColorDescrição: Cor em formato HEX (por exemplo #ffffff). Afeta progresso e estados ativos (passos concluídos e atual, borda e estado do checkbox de termos, spinner de validação de documento).Obrigatório quando: Modo = Claro
​
Cor primária (modo escuro)
string
Nome da variável: Cor primária (modo escuro)Variável: primaryDarkColorDescrição: Cor em formato HEX (por exemplo #ffffff). Mesmo papel visual que primaryColor no tema escuro.Obrigatório quando: Modo = Oscuro
​
Cor secundária (modo claro)
string
Nome da variável: Cor secundária (modo claro)Variável: secondaryColorDescrição: Cor em formato HEX (por exemplo #ffffff). Botões principais (Continuar, Tentar novamente etc.), spinners de carregamento, sucesso, links de termos, passos pendentes do progresso.Obrigatório quando: Modo = Claro
​
Cor secundária (modo escuro)
string
Nome da variável: Cor secundária (modo escuro)Variável: secondaryDarkColorDescrição: Cor em formato HEX (por exemplo #ffffff). Mesmo papel que secondaryColor no tema escuro.Obrigatório quando: Modo = Oscuro
​
Cor terciária (modo claro)
string
Nome da variável: Cor terciária (modo claro)Variável: tertiaryColorDescrição: Cor em formato HEX (por exemplo #ffffff). Processos em andamento: spinners durante validações e indicadores de passo em execução.Obrigatório quando: Modo = Claro
​
Cor terciária (modo escuro)
string
Nome da variável: Cor terciária (modo escuro)Variável: tertiaryDarkColorDescrição: Cor em formato HEX (por exemplo #ffffff). Mesmo papel que tertiaryColor no tema escuro.Obrigatório quando: Modo = Oscuro
​
Cor de fundo da tela (modo claro)
string
Nome da variável: Cor de fundo da tela (modo claro)Variável: backgroundColorDescrição: Cor em formato HEX (por exemplo #ffffff). Fundo geral das telas do fluxo.Obrigatório quando: Modo = Claro
​
Cor de fundo da tela (modo escuro)
string
Nome da variável: Cor de fundo da tela (modo escuro)Variável: backgroundDarkColorDescrição: Cor em formato HEX (por exemplo #ffffff). Fundo no tema escuro.Obrigatório quando: Modo = Oscuro
​
Cor da fonte (modo claro)
string
Nome da variável: Cor da fonte (modo claro)Variável: fontColorDescrição: Cor em formato HEX (por exemplo #ffffff). Textos: títulos, instruções, mensagens e estados.Obrigatório quando: Modo = Claro
​
Cor da fonte (modo escuro)
string
Nome da variável: Cor da fonte (modo escuro)Variável: fontDarkColorDescrição: Cor em formato HEX (por exemplo #ffffff). Textos no tema escuro.Obrigatório quando: Modo = Oscuro
​
Facematch: limiar de aprovação
enum
Nome da variável: Facematch: limiar de aprovaçãoVariável: facematchThresholdDescrição: Exigência da comparação facial (percentual de coincidência).Valores disponíveis: 65, 70, 75, 80, 85, 90
​
Documento: validar imagem ghost
enum
Nome da variável: Documento: validar imagem ghostVariável: validateGhostPortraitDescrição: Verifica a coincidência entre a foto principal do documento e a miniatura (ghost).Valores disponíveis: true, false
Use false se seus usuários costumam enviar fotos de baixa qualidade; com true, a taxa de rejeições pode aumentar.
​
Modificar idioma
enum
Nome da variável: Modificar idiomaVariável: editLanguageDescrição: Habilita o bloco de idioma (defaultLanguage, canChangeLanguage).Valores disponíveis: true, false
​
Idioma padrão
enum
Nome da variável: Idioma padrãoVariável: defaultLanguageDescrição: Idioma inicial dos textos do WebView.Valores disponíveis: es, enObrigatório quando: editLanguage = true
​
Permitir que o usuário escolha o idioma
enum
Nome da variável: Permitir que o usuário escolha o idiomaVariável: canChangeLanguageDescrição: Se for true, o usuário pode mudar o idioma da interface a qualquer momento do processo.Valores disponíveis: true, falseObrigatório quando: editLanguage = true

​
Escopo do WebView de biometria

O WebView de biometria é composto por 12 telas que guiam o usuário no processo de validação com foto (WebView): prova de vida, documento (frente e verso) e encerramento com resultado. Os nomes e a ordem exatos das telas podem variar conforme a versão do produto e a configuração do agente (por exemplo, vídeo de introdução ou idioma).

​
Elementos não modificáveis

Para garantir a qualidade da verificação, não são modificáveis:
  • Widgets de captura facial.
  • Widgets de captura de documentos.

​
Revisão antes de publicar

Checklist recomendado:
  • Workflow dedicado à tool com execução de teste bem-sucedida (UI atualizada, success).
  • colors, Modo e pares de cores coerentes (claro e/ou escuro conforme o caso).
  • termsLink público e funcional.
  • facematchThreshold alinhado à sua política de risco.
  • validateGhostPortrait adequado à qualidade típica das fotos de documento.
  • editLanguage, defaultLanguage e canChangeLanguage revisados.
  • Widgets de captura visíveis e sem alterações não suportadas.
  • Testes ponta a ponta concluídos no WhatsApp.