Branding Tampilan UI Kustom untuk Verifikasi Identitas

Di lanskap kompetitif saat ini, pengalaman pengguna yang mulus dan bermerek sangat penting. Ketika menyangkut verifikasi identitas, antarmuka generik dapat mengganggu alur dan mengikis kepercayaan. Didit menyediakan SDK verifikasi identitas yang kuat dengan opsi penyesuaian yang ekstensif, memungkinkan Anda untuk sepenuhnya white label proses verifikasi agar sesuai dengan tampilan dan nuansa merek Anda. Postingan ini membahas berbagai metode untuk mencapai kontrol UI yang lengkap, mulai dari penyesuaian CSS dasar hingga membangun pengalaman yang sepenuhnya bespoke.

Poin Utama 1: Didit menawarkan spektrum opsi penyesuaian, dari override CSS sederhana hingga pendekatan rendering sisi server yang lengkap untuk kontrol UI yang maksimal.

Poin Utama 2: Menerapkan white labeling dengan benar meningkatkan kepercayaan pengguna dan konsistensi merek di seluruh proses verifikasi.

Poin Utama 3: API Didit dirancang untuk mendukung komponen UI out-of-the-box dan frontend khusus sepenuhnya.

Poin Utama 4: Kustomisasi CSS tingkat lanjut memungkinkan kontrol granular atas tampilan SDK tanpa memodifikasi kode inti.

Memahami Opsi White Labeling

Didit menyadari bahwa setiap merek memiliki persyaratan unik. Kami menawarkan beberapa pendekatan untuk penyesuaian UI:

• Kustomisasi CSS (Dasar): Metode paling sederhana, memungkinkan Anda untuk menimpa gaya default menggunakan CSS kustom. Ini ideal untuk penyesuaian branding kecil seperti warna, font, dan gaya tombol.
• Kustomisasi Halaman yang Dihosting (Menengah): Modifikasi halaman verifikasi yang dihosting melalui opsi penataan gaya terbatas yang tersedia di Konsol Didit.
• Integrasi SDK dengan UI Kustom (Lanjutan): Kontrol penuh. Integrasikan SDK Didit ke dalam aplikasi Anda dan bangun UI khusus menggunakan kerangka kerja pilihan Anda (React, Angular, Vue.js, dll.). Ini memanfaatkan API kami untuk pemrosesan backend.
• Rendering Sisi Server (Ahli): Tangani seluruh alur verifikasi di server Anda, menggunakan API Didit untuk melakukan pemeriksaan identitas inti dan membangun frontend khusus sepenuhnya.

Memanfaatkan Kustomisasi CSS

Untuk pembaruan branding cepat, penyesuaian CSS adalah alat yang ampuh. SDK Didit memungkinkan Anda untuk menyuntikkan aturan CSS kustom yang menimpa gaya default. Ini dicapai dengan menambahkan tag style ke HTML yang berisi widget verifikasi, atau dengan menyediakan URL ke stylesheet.

Contoh:

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

Pertimbangan Penting:

• Gunakan !important untuk memastikan gaya Anda menimpa gaya default SDK.
• Periksa struktur HTML SDK untuk mengidentifikasi kelas CSS yang relevan.
• Uji secara menyeluruh di berbagai browser dan perangkat.

Membangun UI Kustom dengan SDK

Untuk kontrol UI yang lengkap, Anda perlu mengintegrasikan SDK Didit ke dalam aplikasi Anda dan membangun frontend khusus. Pendekatan ini membutuhkan lebih banyak upaya pengembangan tetapi memberikan fleksibilitas yang tak tertandingi.

Arsitektur:

1. Inisialisasi SDK Didit di aplikasi Anda.
2. Buat elemen UI khusus (tombol, bidang input, dll.) yang sesuai dengan merek Anda.
3. Gunakan API Didit untuk memicu langkah-langkah verifikasi (penangkapan dokumen ID, deteksi kelayakan hidup, dll.).
4. Tangani hasil verifikasi dan perbarui UI Anda sesuai.

Contoh: Inisiasi Verifikasi ID menggunakan JavaScript SDK.

didit.launchIDVerification({
  container: '#didit-container',
  onSuccess: function(result) {
    console.log('Verifikasi berhasil:', result);
  },
  onFailure: function(error) {
    console.error('Verifikasi gagal:', error);
  }
});

Gaya Lanjutan dan Kustomisasi yang Diperluas

Selain CSS dasar, Anda dapat mencapai penyesuaian yang lebih canggih dengan memanfaatkan API Didit untuk mengontrol alur verifikasi dan merender elemen UI khusus. Ini memungkinkan perubahan dinamis berdasarkan status verifikasi, lokasi, atau faktor lainnya. Misalnya, Anda dapat secara dinamis menampilkan atau menyembunyikan elemen berdasarkan negara pengguna, atau menampilkan pesan kesalahan khusus.

Opsi gaya yang diperluas Didit mencakup kemampuan untuk menyesuaikan:

• Spinner pemuatan
• Pesan kesalahan
• Animasi keberhasilan
• Aset gambar

Bagaimana Didit Membantu

Didit memberdayakan bisnis untuk memberikan pengalaman verifikasi identitas yang bermerek dan tanpa hambatan. SDK kami yang fleksibel dan API komprehensif menyediakan alat yang Anda butuhkan untuk:

• Meningkatkan konsistensi merek.
• Meningkatkan kepercayaan pengguna.
• Meningkatkan tingkat konversi.
• Mengurangi biaya dukungan.
• Mempertahankan pengalaman pengguna yang mulus.

Siap Memulai?

Siap untuk mengendalikan UI verifikasi identitas Anda? Jelajahi dokumentasi dan sumber daya integrasi kami:

• Dokumentasi Didit
• Pusat Demo Didit
• Harga Didit