Saltar al contenido principal

Documentation Index

Fetch the complete documentation index at: https://docs.jelou.ai/llms.txt

Use this file to discover all available pages before exploring further.

Esta guía detalla qué puedes personalizar en la experiencia WebView de biometría, cómo usar la tool [Webview] Biometric UI Configuration, qué salidas esperar al probar y cómo completar cada parámetro de entrada.

​
Elementos personalizables

Puedes adaptar la experiencia a tu marca y reglas de negocio mediante:
  • Colores y modo (claro u oscuro, con pares de variables para cada tema).
  • Idioma de los textos y, si aplica, permiso para que el usuario cambie de idioma.
  • Validaciones legales (enlace a términos y condiciones).
  • Validaciones de seguridad (umbral de facematch y validación ghost del documento).
Los widgets de captura facial y de documento no son modificables.

​
Configuración en Brain

Define la apariencia y reglas de UI con la tool [Webview] Biometric UI Configuration.
1

Crea un workflow dedicado

Crea un nuevo workflow en Brain para esta tool. Debes aplicar los cambios de personalización de la UI del WebView solo una vez; puedes mantener este flujo como el lugar único donde ejecutas la actualización de configuración.
Modal Crear skill en Jelou Producto para nombrar el workflow dedicado
2

Ubica la tool

En la barra lateral puedes buscar por el nombre de la tool [Webview] Biometric UI Configuration.
Marketplace con la tool [Webview] Biometric UI Configuration seleccionada y conectada al nodo Inicio
3

Conecta, arrastra y configura

Conecta la tool, arrástrala al canvas del workflow y completa los campos en la barra lateral derecha al seleccionar el nodo. Revisa la pestaña Inputs (entradas) en la sección Configuración más abajo.
Panel lateral del nodo con selector de versión del tool e instrucción para configurar inputs
4

Incluye los mensajes de las salidas (Outputs)

En la pestaña Outputs (salidas) del nodo, enlaza cada salida de la tool al resto del flujo y define el mensaje (o la acción siguiente) que debe ejecutarse en cada caso. La tool expone tres variables de salida:
  • success — corresponde a UI actualizada: la configuración se aplicó correctamente a la UI del WebView.
  • noData — corresponde a No se encontraron cambios para actualizar (por ejemplo, valores iguales a los ya vigentes o una validación que impide guardar).
  • error — corresponde a Error en el servicio (fallo al comunicarse con el servicio que persiste la configuración).
Canvas con salidas UI actualizada, sin cambios y error en el servicio enlazadas a nodos Texto con mensajes
5

Prueba el flujo

Usa Probar sobre el workflow. Debe devolver éxito (salida UI actualizada, variable success) cuando los cambios se aplicaron correctamente a la experiencia WebView.
Panel Probar proyecto con ejecución exitosa y mensaje del nodo de texto en la rama UI actualizada

​
Configuración

​
Colores UI
enum
Nombre de la variable: Colores UIVariable: colorsDescripción: Activa la paleta personalizada (true / false). Con true debes configurar Modo y los colores HEX del tema correspondiente.Valores disponibles: true, false
​
Modo
enum
Nombre de la variable: ModoVariable: ModoDescripción: Tema base Claro u Oscuro; define qué bloque de colores aplica.Valores disponibles: Claro, OscuroObligatorio cuando: colors = trueEn modo claro usa primaryColor, secondaryColor, tertiaryColor, backgroundColor y fontColor.En modo oscuro usa primaryDarkColor, secondaryDarkColor, tertiaryDarkColor, backgroundDarkColor y fontDarkColor (los mismos cinco roles visuales, variante de tema).
​
Color primario (modo claro)
string
Nombre de la variable: Color primario (modo claro)Variable: primaryColorDescripción: Color en formato HEX (por ejemplo #ffffff). Afecta progreso y estados activos (pasos completados y actual, borde y estado del checkbox de términos, spinner de validación de documento).Obligatorio cuando: Modo = Claro
​
Color primario (modo oscuro)
string
Nombre de la variable: Color primario (modo oscuro)Variable: primaryDarkColorDescripción: Color en formato HEX (por ejemplo #ffffff). Mismo rol visual que primaryColor en tema oscuro.Obligatorio cuando: Modo = Oscuro
​
Color secundario (modo claro)
string
Nombre de la variable: Color secundario (modo claro)Variable: secondaryColorDescripción: Color en formato HEX (por ejemplo #ffffff). Afecta los botones principales (Continuar, Reintentar, etc.), los spinners de carga, los estados de éxito, los enlaces de términos y los pasos pendientes del progreso.Obligatorio cuando: Modo = Claro
​
Color secundario (modo oscuro)
string
Nombre de la variable: Color secundario (modo oscuro)Variable: secondaryDarkColorDescripción: Color en formato HEX (por ejemplo #ffffff). Mismo rol que secondaryColor en tema oscuro.Obligatorio cuando: Modo = Oscuro
​
Color terciario (modo claro)
string
Nombre de la variable: Color terciario (modo claro)Variable: tertiaryColorDescripción: Color en formato HEX (por ejemplo #ffffff). Procesos en curso: spinners durante validaciones e indicadores de paso en ejecución.Obligatorio cuando: Modo = Claro
​
Color terciario (modo oscuro)
string
Nombre de la variable: Color terciario (modo oscuro)Variable: tertiaryDarkColorDescripción: Color en formato HEX (por ejemplo #ffffff). Mismo rol que tertiaryColor en tema oscuro.Obligatorio cuando: Modo = Oscuro
​
Color de fondo de pantalla (modo claro)
string
Nombre de la variable: Color de fondo de pantalla (modo claro)Variable: backgroundColorDescripción: Color en formato HEX (por ejemplo #ffffff). Fondo general de las pantallas del flujo.Obligatorio cuando: Modo = Claro
​
Color de fondo de pantalla (modo oscuro)
string
Nombre de la variable: Color de fondo de pantalla (modo oscuro)Variable: backgroundDarkColorDescripción: Color en formato HEX (por ejemplo #ffffff). Fondo en tema oscuro.Obligatorio cuando: Modo = Oscuro
​
Color de fuente (modo claro)
string
Nombre de la variable: Color de fuente (modo claro)Variable: fontColorDescripción: Color en formato HEX (por ejemplo #ffffff). Textos: títulos, instrucciones, mensajes y estados.Obligatorio cuando: Modo = Claro
​
Color de fuente (modo oscuro)
string
Nombre de la variable: Color de fuente (modo oscuro)Variable: fontDarkColorDescripción: Color en formato HEX (por ejemplo #ffffff). Textos en tema oscuro.Obligatorio cuando: Modo = Oscuro
​
Enlace términos y condiciones
string
Nombre de la variable: Enlace términos y condicionesVariable: termsLinkDescripción: URL pública del documento legal. Es obligatorio para un proceso biométrico; sin enlace no cumples el mínimo de implementación. El documento debe explicitar uso, almacenamiento y tratamiento de datos personales y biométricos, y mostrarse antes de iniciar la verificación.
​
Facematch: umbral de aprobación
enum
Nombre de la variable: Facematch: umbral de aprobaciónVariable: facematchThresholdDescripción: Exigencia de la comparación facial (porcentaje de coincidencia).Valores disponibles: 65, 70, 75, 80, 85, 90
​
Documento: validar imagen ghost
enum
Nombre de la variable: Documento: validar imagen ghostVariable: validateGhostPortraitDescripción: Comprueba la coincidencia entre la foto principal del documento y la miniatura (ghost).Valores disponibles: true, false
Usa false si tus usuarios suelen enviar fotos de baja calidad; con true puede subir la tasa de rechazos.
​
Modificar idioma
enum
Nombre de la variable: Modificar idiomaVariable: editLanguageDescripción: Habilita el bloque de idioma (defaultLanguage, canChangeLanguage).Valores disponibles: true, false
​
Idioma por defecto
enum
Nombre de la variable: Idioma por defectoVariable: defaultLanguageDescripción: Idioma inicial de los textos del WebView.Valores disponibles: es, enObligatorio cuando: editLanguage = true
​
Permitir que el usuario elija el idioma
enum
Nombre de la variable: Permitir que el usuario elija el idiomaVariable: canChangeLanguageDescripción: Si es true, el usuario puede cambiar el idioma de la interfaz en cualquier momento del proceso.Valores disponibles: true, falseObligatorio cuando: editLanguage = true

​
Alcance del WebView de biometría

El WebView de biometría está compuesto por 12 pantallas que guían al usuario a lo largo del proceso de validación de identidad.

​
Elementos no modificables

Para garantizar la calidad de la verificación, no son modificables:
  • Widgets de captura facial.
  • Widgets de captura de documentos.

​
Revisión antes de publicar

Checklist recomendado:
  • Workflow dedicado a la tool con una ejecución de prueba exitosa (UI actualizada, success).
  • colors, Modo y pares de color coherentes (claro y/o oscuro según corresponda).
  • termsLink público y funcional.
  • facematchThreshold alineado a tu política de riesgo.
  • validateGhostPortrait acorde a la calidad típica de las fotos de documento.
  • editLanguage, defaultLanguage y canChangeLanguage revisados.
  • Widgets de captura visibles y sin alteraciones no soportadas.
  • Pruebas end-to-end completadas en WhatsApp.