Personalización de la Interfaz de Usuario para la Verificación de Identidad

En el competitivo panorama actual, una experiencia de usuario perfecta y con marca es primordial. Cuando se trata de la verificación de identidad, las interfaces genéricas pueden interrumpir el flujo y erosionar la confianza. Didit proporciona un potente SDK de verificación de identidad con amplias opciones de personalización, lo que le permite etiquetar completamente el proceso de verificación para que coincida con la apariencia y el estilo de su marca. Esta publicación explora los diversos métodos para lograr un control total de la IU, desde la personalización básica de CSS hasta la creación de una experiencia totalmente personalizada.

Idea clave 1: Didit ofrece un espectro de opciones de personalización, desde simples anulaciones de CSS hasta un enfoque de renderizado del lado del servidor completo para un control máximo de la IU.

Idea clave 2: La implementación adecuada del etiquetado blanco mejora la confianza del usuario y la coherencia de la marca en todo el proceso de verificación.

Idea clave 3: La API de Didit está diseñada para admitir tanto los componentes de IU listos para usar como las interfaces completamente personalizadas.

Idea clave 4: La personalización avanzada de CSS permite un control granular sobre la apariencia del SDK sin modificar el código central.

Entendiendo las Opciones de Etiquetado Blanco

Didit reconoce que cada marca tiene requisitos únicos. Ofrecemos varios enfoques para la personalización de la IU:

• Personalización de CSS (Básico): El método más simple, que le permite anular los estilos predeterminados mediante CSS personalizado. Esto es ideal para ajustes de marca menores, como colores, fuentes y estilos de botones.
• Personalización de la Página Alojada (Intermedio): Modifique la página de verificación alojada a través de opciones de estilo limitadas disponibles en la Consola de Didit.
• Integración del SDK con IU Personalizada (Avanzado): Control total. Integre el SDK de Didit en su aplicación y cree una IU completamente personalizada utilizando sus frameworks preferidos (React, Angular, Vue.js, etc.). Esto utiliza nuestras API para el procesamiento backend.
• Renderizado del Lado del Servidor (Experto): Maneje todo el flujo de verificación en sus servidores, utilizando la API de Didit para realizar las comprobaciones de identidad principales y construir una interfaz completamente personalizada.

Aprovechando la Personalización de CSS

Para las actualizaciones rápidas de la marca, la personalización de CSS es una herramienta poderosa. El SDK de Didit le permite inyectar reglas CSS personalizadas que anulan los estilos predeterminados. Esto se logra agregando una etiqueta style al HTML que contiene el widget de verificación, o proporcionando una URL a una hoja de estilo.

Ejemplo:

<style>
  .didit-button {
    background-color: #2567FF !important; /* Azul Didit */
    color: white !important;
    border-radius: 5px !important;
  }
  .didit-input {
    font-family: 'Su Fuente Personalizada', sans-serif !important;
  }
</style>

Consideraciones importantes:

• Utilice !important para asegurarse de que sus estilos anulen los estilos predeterminados del SDK.
• Inspeccione la estructura HTML del SDK para identificar las clases CSS relevantes.
• Pruebe exhaustivamente en diferentes navegadores y dispositivos.

Creando una IU Personalizada con el SDK

Para un control total de la IU, deberá integrar el SDK de Didit en su aplicación y crear una interfaz frontal personalizada. Este enfoque requiere más esfuerzo de desarrollo, pero brinda una flexibilidad sin igual.

Arquitectura:

1. Inicialice el SDK de Didit en su aplicación.
2. Cree elementos de IU personalizados (botones, campos de entrada, etc.) que coincidan con su marca.
3. Utilice la API de Didit para activar los pasos de verificación (captura de documentos de identidad, detección de actividad, etc.).
4. Maneje los resultados de la verificación y actualice su IU en consecuencia.

Ejemplo: Inicie la Verificación de Identidad utilizando el SDK de JavaScript.

didit.launchIDVerification({
  container: '#didit-container',
  onSuccess: function(result) {
    console.log('Verificación exitosa:', result);
  },
  onFailure: function(error) {
    console.error('Verificación fallida:', error);
  }
});

Estilos Avanzados y Personalización Extendida

Más allá del CSS básico, puede lograr una personalización más sofisticada utilizando la API de Didit para controlar el flujo de verificación y renderizar elementos de IU personalizados. Esto permite cambios dinámicos basados en el estado de la verificación, la ubicación u otros factores. Por ejemplo, podría mostrar u ocultar dinámicamente elementos según el país del usuario o mostrar mensajes de error personalizados.

Las opciones de estilos extendidos de Didit incluyen la capacidad de personalizar:

• Spinners de carga
• Mensajes de error
• Animaciones de éxito
• Activos de imagen

Cómo Ayuda Didit

Didit permite a las empresas ofrecer una experiencia de verificación de identidad con marca y sin fricciones. Nuestro SDK flexible y nuestra API completa brindan las herramientas que necesita para:

• Mejorar la coherencia de la marca.
• Aumentar la confianza del usuario.
• Mejorar las tasas de conversión.
• Reducir los costos de soporte.
• Mantener una experiencia de usuario perfecta.

¿Listo para Empezar?

¿Listo para tomar el control de la IU de verificación de identidad? Explore nuestra documentación y recursos de integración:

• Documentación de Didit
• Centro de Demostraciones de Didit
• Precios de Didit