신원 확인을 위한 맞춤 UI 브랜딩

경쟁이 치열한 오늘날, 원활하고 브랜딩된 사용자 경험이 가장 중요합니다. 신원 확인과 관련하여 일반적인 인터페이스는 흐름을 방해하고 신뢰를 훼손할 수 있습니다. Didit은 브랜드의 외관과 느낌에 맞게 확인 프로세스를 완벽하게 화이트 라벨링할 수 있도록 광범위한 사용자 지정 옵션을 제공하는 강력한 신원 확인 SDK를 제공합니다. 이 게시물에서는 기본 CSS 사용자 지정부터 완전히 맞춤형 환경 구축까지 UI를 완벽하게 제어하는 다양한 방법을 살펴봅니다.

핵심 요약 1: Didit은 간단한 CSS 재정의부터 최대 UI 제어를 위한 완전한 서버 측 렌더링 접근 방식까지 다양한 사용자 지정 옵션을 제공합니다.

핵심 요약 2: 화이트 라벨링을 적절하게 구현하면 확인 프로세스 전반에 걸쳐 사용자 신뢰와 브랜드 일관성이 향상됩니다.

핵심 요약 3: Didit API는 즉시 사용 가능한 UI 구성 요소와 완벽하게 사용자 지정된 프런트엔드를 모두 지원하도록 설계되었습니다.

핵심 요약 4: 고급 CSS 사용자 지정을 통해 핵심 코드를 수정하지 않고 SDK의 모양을 세밀하게 제어할 수 있습니다.

화이트 라벨링 옵션 이해

Didit은 모든 브랜드가 고유한 요구 사항을 가지고 있음을 인식합니다. 다음과 같은 여러 가지 UI 사용자 지정 접근 방식을 제공합니다.

• CSS 사용자 지정 (기본): 가장 간단한 방법으로, 사용자 지정 CSS를 사용하여 기본 스타일을 재정의할 수 있습니다. 색상, 글꼴 및 버튼 스타일과 같은 사소한 브랜드 조정을 위해 이상적입니다.
• 호스팅 페이지 사용자 지정 (중간): Didit 콘솔에서 제공하는 제한된 스타일링 옵션을 통해 호스팅되는 확인 페이지를 수정합니다.
• SDK 통합 및 사용자 지정 UI (고급): 완전한 제어. Didit SDK를 애플리케이션에 통합하고 선호하는 프레임워크(React, Angular, Vue.js 등)를 사용하여 완전히 사용자 지정된 UI를 구축합니다. 백엔드 처리를 위해 API를 활용합니다.
• 서버 측 렌더링 (전문가): Didit의 API를 사용하여 핵심 신원 확인을 수행하고 완전히 사용자 지정된 프런트엔드를 구축하여 서버에서 전체 확인 흐름을 처리합니다.

CSS 사용자 지정 활용

빠른 브랜드 업데이트를 위해 CSS 사용자 지정은 강력한 도구입니다. Didit의 SDK를 사용하면 기본 스타일을 재정의하는 사용자 지정 CSS 규칙을 주입할 수 있습니다. 이는 확인 위젯을 포함하는 HTML에 style 태그를 추가하거나 스타일시트 URL을 제공하여 수행됩니다.

예시:

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

중요 고려 사항:

• 스타일이 SDK의 기본 스타일을 재정의하도록 !important를 사용하세요.
• SDK의 HTML 구조를 검사하여 관련 CSS 클래스를 식별하세요.
• 다양한 브라우저와 장치에서 철저히 테스트하세요.

SDK를 사용한 사용자 지정 UI 구축

완전한 UI 제어를 위해 Didit SDK를 애플리케이션에 통합하고 사용자 지정 프런트엔드를 구축해야 합니다. 이 접근 방식은 더 많은 개발 노력이 필요하지만 비교할 수 없는 유연성을 제공합니다.

아키텍처:

1. 애플리케이션에서 Didit SDK를 초기화합니다.
2. 브랜드에 맞는 사용자 지정 UI 요소(버튼, 입력 필드 등)를 만듭니다.
3. Didit API를 사용하여 확인 단계(ID 문서 캡처, 실시간 감지 등)를 트리거합니다.
4. 확인 결과를 처리하고 UI를 그에 따라 업데이트합니다.

예시: JavaScript SDK를 사용하여 ID 확인 시작.

didit.launchIDVerification({
  container: '#didit-container',
  onSuccess: function(result) {
    console.log('Verification successful:', result);
  },
  onFailure: function(error) {
    console.error('Verification failed:', error);
  }
});

고급 스타일링 및 확장 사용자 지정

기본 CSS를 넘어 Didit API를 활용하여 확인 흐름을 제어하고 사용자 지정 UI 요소를 렌더링하여 더욱 정교한 사용자 지정을 달성할 수 있습니다. 이를 통해 확인 상태, 위치 또는 기타 요인에 따라 동적 변경이 가능합니다. 예를 들어 사용자의 국가에 따라 요소를 동적으로 표시하거나 숨기거나 사용자 지정 오류 메시지를 표시할 수 있습니다.

Didit의 확장 스타일링 옵션에는 다음을 사용자 지정할 수 있는 기능이 포함됩니다.

• 로딩 스피너
• 오류 메시지
• 성공 애니메이션
• 이미지 에셋

Didit이 제공하는 도움

Didit은 기업이 브랜딩되고 마찰이 없는 신원 확인 경험을 제공할 수 있도록 지원합니다. 당사의 유연한 SDK와 포괄적인 API는 다음과 같은 도구를 제공합니다.

• 브랜드 일관성 강화.
• 사용자 신뢰도 향상.
• 전환율 개선.
• 지원 비용 절감.
• 원활한 사용자 경험 유지.

시작할 준비가 되셨습니까?

신원 확인 UI를 제어할 준비가 되셨습니까? 당사의 설명서 및 통합 리소스를 살펴보세요.

• Didit Documentation
• Didit Demo Center
• Didit Pricing