Individuelles UI-Branding für Identitätsprüfung

In der heutigen wettbewerbsorientierten Landschaft sind ein nahtloses und gebrandetes Benutzererlebnis von größter Bedeutung. Wenn es um die Identitätsprüfung geht, können generische Oberflächen den Ablauf stören und das Vertrauen untergraben. Didit bietet ein leistungsstarkes Identitätsprüfungs-SDK mit umfangreichen Anpassungsoptionen, mit denen Sie den Verifizierungsprozess vollständig an das Erscheinungsbild Ihrer Marke anpassen können. Dieser Beitrag untersucht die verschiedenen Methoden, um eine vollständige UI-Kontrolle zu erreichen, von grundlegenden CSS-Anpassungen bis hin zum Erstellen eines vollständig maßgeschneiderten Erlebnisses.

Wichtige Erkenntnis 1: Didit bietet ein Spektrum an Anpassungsoptionen, von einfachen CSS-Overrides bis hin zu einem vollständigen Server-Side-Rendering-Ansatz für maximale UI-Kontrolle.

Wichtige Erkenntnis 2: Die ordnungsgemäße Implementierung von White Labeling verbessert das Vertrauen der Benutzer und die Markenkonsistenz während des gesamten Verifizierungsprozesses.

Wichtige Erkenntnis 3: Die Didit API ist so konzipiert, dass sie sowohl Out-of-the-Box-UI-Komponenten als auch vollständig benutzerdefinierte Frontends unterstützt.

Wichtige Erkenntnis 4: Erweiterte CSS-Anpassung ermöglicht eine granulare Kontrolle über das Erscheinungsbild des SDK, ohne den Kerncode zu ändern.

White-Labeling-Optionen verstehen

Didit erkennt an, dass jede Marke einzigartige Anforderungen hat. Wir bieten verschiedene Ansätze zur UI-Anpassung:

• CSS-Anpassung (Basic): Die einfachste Methode, mit der Sie Standardstile mit benutzerdefiniertem CSS überschreiben können. Dies ist ideal für kleinere Branding-Anpassungen wie Farben, Schriftarten und Button-Stile.
• Anpassung der gehosteten Seite (Intermediate): Ändern Sie die gehostete Verifizierungsseite über die begrenzten Styling-Optionen, die in der Didit-Konsole verfügbar sind.
• SDK-Integration mit benutzerdefiniertem UI (Advanced): Volle Kontrolle. Integrieren Sie das Didit SDK in Ihre Anwendung und erstellen Sie ein vollständig benutzerdefiniertes UI mit Ihren bevorzugten Frameworks (React, Angular, Vue.js usw.). Dies nutzt unsere APIs für die Backend-Verarbeitung.
• Server-Side-Rendering (Expert): Behandeln Sie den gesamten Verifizierungsablauf auf Ihren Servern, verwenden Sie die Didit-API, um die Kernidentitätsprüfungen durchzuführen, und erstellen Sie ein vollständig benutzerdefiniertes Frontend.

CSS-Anpassung nutzen

Für schnelle Branding-Updates ist die CSS-Anpassung ein leistungsstarkes Werkzeug. Das SDK von Didit ermöglicht es Ihnen, benutzerdefinierte CSS-Regeln einzufügen, die die Standardstile überschreiben. Dies geschieht durch Hinzufügen eines style-Tags zum HTML, das das Verifizierungswidget enthält, oder durch Bereitstellung einer URL zu einem Stylesheet.

Beispiel:

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

Wichtige Hinweise:

• Verwenden Sie !important, um sicherzustellen, dass Ihre Stile die Standardstile des SDK überschreiben.
• Überprüfen Sie die HTML-Struktur des SDK, um die relevanten CSS-Klassen zu identifizieren.
• Testen Sie gründlich über verschiedene Browser und Geräte hinweg.

Erstellen eines benutzerdefinierten UI mit dem SDK

Für eine vollständige UI-Kontrolle müssen Sie das Didit SDK in Ihre Anwendung integrieren und ein benutzerdefiniertes Frontend erstellen. Dieser Ansatz erfordert mehr Entwicklungsaufwand, bietet aber eine unvergleichliche Flexibilität.

Architektur:

1. Initialisieren Sie das Didit SDK in Ihrer Anwendung.
2. Erstellen Sie benutzerdefinierte UI-Elemente (Buttons, Eingabefelder usw.), die zu Ihrer Marke passen.
3. Verwenden Sie die Didit API, um Verifizierungsschritte auszulösen (ID-Dokumenterfassung, Liveness-Erkennung usw.).
4. Verarbeiten Sie die Verifizierungsergebnisse und aktualisieren Sie Ihre UI entsprechend.

Beispiel: Starten Sie die ID-Verifizierung mit dem JavaScript SDK.

didit.launchIDVerification({
  container: '#didit-container',
  onSuccess: function(result) {
    console.log('Verifizierung erfolgreich:', result);
  },
  onFailure: function(error) {
    console.error('Verifizierung fehlgeschlagen:', error);
  }
});

Erweitertes Styling und erweiterte Anpassung

Über die grundlegende CSS-Anpassung hinaus können Sie eine anspruchsvollere Anpassung erreichen, indem Sie die Didit API verwenden, um den Verifizierungsablauf zu steuern und benutzerdefinierte UI-Elemente zu rendern. Dies ermöglicht dynamische Änderungen basierend auf dem Verifizierungsstatus, dem Standort oder anderen Faktoren. Sie könnten beispielsweise Elemente dynamisch anzeigen oder ausblenden, je nach Land des Benutzers, oder benutzerdefinierte Fehlermeldungen anzeigen.

Die erweiterten Styling-Optionen von Didit umfassen die Möglichkeit, Folgendes anzupassen:

• Lade-Spinner
• Fehlermeldungen
• Erfolgsanimationen
• Bildressourcen

Wie Didit hilft

Didit ermöglicht Unternehmen, ein gebrandetes und reibungsloses Identitätsprüfungserlebnis zu bieten. Unser flexibles SDK und unsere umfassende API bieten Ihnen die Tools, die Sie benötigen, um:

• Die Markenkonsistenz zu verbessern.
• Das Vertrauen der Benutzer zu erhöhen.
• Die Konversionsraten zu verbessern.
• Die Supportkosten zu senken.
• Ein nahtloses Benutzererlebnis zu gewährleisten.

Bereit zum Start?

Sind Sie bereit, die Kontrolle über Ihr Identitätsprüfung-UI zu übernehmen? Erkunden Sie unsere Dokumentation und Integrationsressourcen:

• Didit-Dokumentation
• Didit-Demo-Center
• Didit-Preisgestaltung