UX 가이드라인

k-ID API를 사용하여 커스텀 연령 게이트를 구축할 때, 이 UX 가이드라인을 따라 규정 준수와 사용자 친화적인 경험을 만드세요. 이러한 권장 사항은 규제 요구 사항을 충족하면서 플레이어가 연령 확인을 원활하게 완료할 수 있도록 도와줍니다.

이 가이드라인 적용 시기

이 가이드라인은 k-ID API를 직접 사용하여 커스텀 연령 게이트를 구축할 때 적용됩니다. k-ID 임베디드 위젯을 사용하는 경우 UX는 이미 처리되어 있습니다.

연령 입력 방법

구현에서는 플레이어의 연령을 수집하기 위한 최소 두 가지 방법을 지원해야 합니다: 연령 슬라이더 또는 날짜 선택기입니다. /age-gate/get-requirements 엔드포인트의 approvedAgeCollectionMethods 필드를 확인하여 플레이어의 관할권에서 허용되는 수집 방법을 결정하세요.

연령 슬라이더

연령 슬라이더는 플레이어가 연령을 입력하는 간단하고 직관적인 방법을 제공합니다. 이것은 대부분의 관할권에서 권장되는 접근 방식입니다.

디자인 권장 사항:

• 슬라이더 범위를 0세에서 35세 이상으로 설정 (ESRB 가이드라인에 따름)
• 기본 위치를 0으로 하여 중립 상태에서 시작
• 플레이어가 슬라이더와 상호 작용할 때까지 계속 버튼을 비활성 상태로 유지
• 플레이어가 슬라이더를 조정하면 선택된 연령을 명확하게 표시
• 접근성을 위해 키보드 탐색 지원

모바일 버전:

날짜 선택기

날짜 선택기는 플레이어의 전체 생년월일을 수집합니다. 이 방법은 특정 관할권에서 필요합니다.

디자인 권장 사항:

• 현지 날짜 형식으로 일/월/년 입력 지원
• 유효하지 않은 날짜에 대한 명확한 유효성 검사 메시지 표시
• 날짜 형식을 현지 관습에 맞춤 (DD/MM/YYYY 또는 MM/DD/YYYY)

연령 확인

플레이어의 연령을 수집한 후 진행하기 전에 확인 화면을 표시합니다. 이 단계는 실수로 인한 오류를 방지하고 정확한 연령 정보의 중요성을 강조합니다.

디자인 권장 사항:

• 입력된 연령 또는 생년월일을 명확하게 요약
• 입력된 연령이 플레이어의 경험에 영향을 미친다고 설명
• 돌아가서 연령을 수정하거나 확인하고 계속하는 명확한 옵션 제공

보호자 동의

플레이어가 해당 지역의 디지털 동의 연령 미만인 경우 보호자의 승인이 필요합니다. 완료율을 최대화하기 위해 UI는 세 가지 동의 방법을 모두 표시해야 합니다.

동의 방법

보호자가 동의를 완료할 수 있는 세 가지 옵션을 제공합니다:

1. 이메일: 플레이어가 부모 또는 보호자의 이메일 주소를 입력할 수 있도록 합니다. /challenge/send-email을 호출하여 동의 요청을 보냅니다.

2. QR 코드: challenge.url 필드에서 스캔 가능한 QR 코드를 표시합니다. 보호자는 휴대폰으로 이것을 스캔하여 동의 포털에 접근합니다.

3. 수동 코드 입력: challenge.oneTimePassword를 표시하고 보호자에게 asktoplay.com에서 입력하도록 안내합니다.

디자인 권장 사항

• 세 가지 옵션 모두를 동일한 가시성으로 표시
• 나중에 돌아와야 하는 플레이어를 위해 "나중에 하기" 옵션 포함
• 사용성을 개선하기 위해 일회성 코드의 복사 버튼 추가
• 동의가 부여되기 전에 플레이어가 돌아올 경우 흐름을 재개할 수 있도록 challengeId 저장

QR 코드와 일회성 비밀번호는 만료됩니다

QR 코드와 일회성 비밀번호는 1시간 후에 만료되며 /challenge/generate-otp API를 사용하여 새로 고쳐야 합니다. 새로 고침 옵션을 제공하거나 자격 증명을 자동으로 재생성하여 만료를 적절하게 처리하도록 UI를 설계하세요. 자세한 내용은 챌린지 만료 및 시간 기반 인증을 참조하세요.

데이터 라이트 모드

게임이 데이터 라이트 모드를 지원하는 경우, 디지털 동의 연령 미만의 플레이어는 보호자 승인을 기다리는 동안 제한된 기능에 접근할 수 있습니다.

디자인 권장 사항:

• 데이터 라이트 모드에서 사용 가능한 기능을 명확하게 전달
• 동의가 부여된 후 사용 가능해지는 추가 기능 설명
• 플레이어가 동의 상태를 확인하거나 동의 요청을 다시 보낼 수 있는 방법 제공

접근성

커스텀 연령 게이트 UI가 접근성 표준을 충족하는지 확인하세요:

요구 사항	구현
키보드 탐색	모든 대화형 요소에 키보드로 접근 가능
스크린 리더 지원	적절한 ARIA 라벨과 시맨틱 HTML
색상 대비	텍스트와 대화형 요소에 충분한 대비
탭 타겟	버튼에 최소 44×44 픽셀 탭 타겟
오류 메시지	문제 해결 방법을 설명하는 설명적인 오류 메시지

관련 리소스

• 커스텀 연령 게이트 빠른 시작 - 단계별 구현 가이드
• 연령 게이트 - 연령 게이트 엔드포인트 API 문서
• 모범 사례 - CDK 통합을 위한 일반적인 모범 사례