Personalització de la Interfície: SDK JavaScript de Didit i Tailwind CSS
Descobreix com integrar i personalitzar sense esforç els fluxos de verificació d'identitat de Didit a la teva aplicació web utilitzant el SDK JavaScript i Tailwind CSS.
La Coherència de Marca és ClauMantenir una experiència de marca unificada en tots els punts de contacte, inclosa la verificació d'identitat, genera confiança i lleialtat de l'usuari. Les opcions d'integració flexibles de Didit ho fan possible.
SDK JavaScript per al ControlEl SDK JavaScript de Didit ofereix un control programàtic complet sobre el flux de verificació, permetent una personalització profunda i una integració perfecta en marcs web moderns com React, Vue i Angular.
Tailwind CSS per a un Estil RàpidAprofita l'enfocament "utility-first" de Tailwind CSS per estilitzar de manera ràpida i eficient els components de la UI de Didit, assegurant una combinació perfecta amb el teu sistema de disseny existent sense anul·lacions complexes.
Solució White-Label de DiditMés enllà de l'estil directe, Didit proporciona capacitats integrals de "white-label" dins de la seva Business Console, permetent una àmplia personalització de la marca, inclosos dominis personalitzats, colors i logotips, aplicats sense esforç als teus fluxos de treball.
La Importància d'una Experiència d'Usuari Fluida en la Verificació d'Identitat
En el panorama digital actual, l'experiència d'usuari (UX) és primordial. Quan els usuaris interactuen amb la teva aplicació, cada punt de contacte contribueix a la seva percepció general de la teva marca. Això inclou processos crítics com la verificació d'identitat. Un flux de verificació maldestre o que no s'ajusta a la marca pot interrompre el viatge de l'usuari, provocar l'abandonament i erosionar la confiança. Per contra, un procés de verificació perfectament integrat i amb una marca impecable millora la professionalitat i reforça la confiança de l'usuari.
Moltes solucions de verificació d'identitat ofereixen UIs genèriques i estandarditzades que xoquen amb les directrius de marca acuradament elaborades d'una empresa. Això obliga les empreses a triar entre una seguretat robusta i una experiència d'usuari coherent. Didit entén aquest desafiament i proporciona eines potents, com el seu SDK JavaScript i les àmplies opcions de "white-label", per assegurar que no hagis de comprometre't. En permetre una personalització profunda, Didit garanteix que el teu procés de verificació d'identitat se senti com una part integral de la teva aplicació, no una interrupció externa i discordant.
Integració del SDK JavaScript de Didit per a la Màxima Flexibilitat
El SDK JavaScript de Didit està dissenyat per a desenvolupadors que busquen el màxim control i flexibilitat. És el mètode d'integració recomanat per a aplicacions de producció a causa de les seves característiques completes, que inclouen gestió de sessions, "callbacks" d'esdeveniments i suport per a marcs populars com React, Vue, Angular, NextJS, Nuxt i Svelte, així com JS "vanilla". A diferència de les incrustacions o redireccions d'iframe més senzilles, el SDK JavaScript et permet gestionar programàticament el flux de verificació i gestionar els esdeveniments directament dins de la teva aplicació.
La integració bàsica és senzilla:
import DiditSdk from '@didit-protocol/sdk-web';
DiditSdk.init({
session_token: 'YOUR_BACKEND_GENERATED_TOKEN',
onSuccess: (session) => {
console.log('Verification completed:', session.sessionId, session.status);
// Handle successful verification, e.g., redirect user, update UI
},
onError: (error) => {
console.error('SDK error:', error.code, error.message);
// Handle errors appropriately
},
onCancel: () => {
console.log('User cancelled verification');
// Handle user cancellation
}
});
Aquest SDK et permet controlar si la verificació apareix com a modal o en línia, donant-te un control granular sobre la interacció de l'usuari. Aprofitant aquest SDK, obtens la capacitat d'embolicar els components de Didit dins de l'estructura de la teva pròpia aplicació, fent-los adaptables a un estil personalitzat.
Estilització dels Components de Didit amb Tailwind CSS
Tailwind CSS s'ha convertit en un favorit entre els desenvolupadors pel seu enfocament "utility-first", que permet un desenvolupament ràpid de la UI i dissenys altament coherents. En integrar el SDK JavaScript de Didit, pots aplicar els teus estils de Tailwind CSS als elements contenidors que allotgen la UI de Didit, assegurant un aspecte i una sensació cohesionats. Tot i que els components principals de Didit estan dissenyats per ser robustos i funcionals, la seva presentació pot ser influenciada per l'estructura DOM circumdant i els estils globals de la teva aplicació.
Per exemple, si el SDK de Didit renderitza un modal o un component en línia dins d'un "div" específic, pots aplicar classes de Tailwind a aquest "div" per controlar la seva mida, espaiat i fins i tot alguns aspectes de la seva aparença. Per a una personalització més profunda dels elements interns del flux de verificació (com botons, camps d'entrada i text), Didit ofereix àmplies capacitats de "white-label" a través de la seva Business Console, que sovint és un enfocament més eficaç i mantenible que intentar anul·lar els estils directament.
No obstant això, per als elements "wrapper" o la UI personalitzada que construeixes al voltant del SDK de Didit, Tailwind CSS és ideal. Imagina que vols presentar el flux de verificació dins d'un component de targeta específic de la teva aplicació:
<div class="flex justify-center items-center h-screen bg-gray-100">
<div class="bg-white p-8 rounded-lg shadow-xl w-full max-w-md">
<h2 class="text-2xl font-bold mb-6 text-center">Verifica la teva identitat</h2>
<!-- Didit SDK will render its UI here -->
<div id="didit-verification-container"></div>
</div>
</div>
En aquest exemple, tot l'estil exterior (fons, aparença de la targeta, estils de text) és gestionat per Tailwind. El SDK de Didit s'inicialitzaria per renderitzar-se dins de #didit-verification-container, heretant alguns estils contextuals i assegurant que sigui visualment coherent amb l'aplicació circumdant. Per als elements dins del flux de Didit, les funcions de "white-label" de Didit proporcionen la personalització definitiva.
La Solució Integral de White-Label de Didit
Tot i que la manipulació directa de CSS pot gestionar alguns aspectes, el mètode principal i més potent de Didit per a la personalització de la UI és la seva funció integrada de "white-label", accessible a través de la Didit Business Console. Això va molt més enllà del que es podria aconseguir amb simples anul·lacions de CSS, proporcionant una solució robusta per a una experiència veritablement de marca. Amb les capacitats de "white-label" de Didit, pots:
- Personalitzar Colors: Controlar botons, text, panells i fons per coincidir amb la teva paleta de marca.
- Establir Tipografia: Aplicar les fonts de la teva marca per a un aspecte coherent.
- Pujar Logotips: Integrar els teus logotips quadrats i rectangulars directament al flux de verificació.
- Ajustar el Disseny: Afinar els radis de les vores per a panells i botons.
- Configurar la Pantalla d'Inici de Sessió: Decidir si mostrar o ometre la pantalla d'inici de sessió inicial.
- Utilitzar Dominis Personalitzats: Allotjar el flux de verificació en el teu propi domini (per exemple,
verificar.lamevaempresa.com) en lloc deverificar.didit.me, assegurant un viatge d'usuari completament fluid sense cap marca externa.
Aquest nivell de personalització s'aplica directament als teus fluxos de treball de Didit, la qual cosa significa que un cop configurat a la Business Console, totes les sessions de verificació iniciades a través d'aquest flux de treball reflectiran automàticament la teva marca. Això és particularment efectiu per a productes de Didit com la Verificació d'Identitat, la Liveness Passiva i Activa, i l'Estimació d'Edat, assegurant que cada pas de la interacció de l'usuari amb aquestes funcions s'alinea perfectament amb la teva marca.
Com Ajuda Didit
Didit destaca com la plataforma d'identitat nativa d'IA i orientada al desenvolupador que permet a les empreses personalitzar completament la seva experiència de verificació d'identitat. Amb la nostra arquitectura modular, obtens comprovacions d'identitat "plug-and-play" que s'integren perfectament als teus sistemes existents. El nostre SDK JavaScript proporciona el control programàtic necessari per a una integració profunda amb marcs web moderns, mentre que les nostres funcions integrals de "white-label" a la Business Console permeten una àmplia personalització de la marca, des de colors i fonts fins a dominis personalitzats. Això garanteix una experiència d'usuari coherent i de confiança en tots els productes de Didit, inclosa la nostra robusta Verificació d'Identitat (OCR, MRZ, codis de barres), detecció de Liveness Passiva i Activa per a la prevenció del frau, i Estimació d'Edat que preserva la privadesa. Didit ofereix un KYC bàsic gratuït i un model de pagament per comprovació reeixida sense despeses de configuració, fent que la verificació d'identitat avançada sigui accessible i eficient.
Preparat per Començar?
Preparat per veure Didit en acció? Demana una demostració gratuïta avui mateix.
Comença a verificar identitats de forma gratuïta amb el nivell gratuït de Didit.
Articles relacionats
- La regulació europea de deepfakes se centra en l'eina, no en el frau
- La IA a les dues bandes de la verificació d'identitat en el joc
- La norma d'identificació de stablecoins cobreix l'emissió i el bescanvi, no el que passa després
- Egipte assumeix el cost de l'actualització KYC dels seus ciutadans a l'estranger
- Unico i Didit: Verificació d'Identitat Avançada per a Pimes al Brasil
- Didit vs. Onfido: cobertura, preus, automatització i migració