디자인 원칙

synced passkeys에 대한 10가지 디자인 원칙과 3가지 콘텐츠 원칙이 있습니다. 최종 사용자 환경을 쉽게 사용할 수 있도록 팀이 원칙을 숙지하도록 합니다.

UX 원칙

1. 계정 관련 작업과 함께 암호키를 생성하라는 메시지가 표시됩니다.

사람들이 이미 계정 생성, 계정 복구 또는 계정 설정의 일부로 계정 관리에 익숙해져 있는 경우, 비밀번호 생성 옵션을 쇼핑과 같은 다른 핵심 사이트 작업을 수행하는 데 방해가 되거나 방해가 되는 것이 아니라 사이트 경험에 도움이 되는 개선 사항으로 인식할 가능성이 더 높습니다. 로그인 환경 중에 비밀번호를 만들라는 메시지가 제대로 표시되지 않았습니다.

2. 2. 익숙하지 않은 것(패스키)과 익숙한 것을 연결합니다.

Passkeys 소비자를 위한 새로운 용어, 새로운 시각적 기호 및 새로운 인증 방법입니다. 가능하면 패스키를 익숙한 개념, 시각 자료, 경험에 연결하여 패스키의 본질과 가치를 이해하도록 도와주세요. 예를 들어 생체 인식 환경은 친숙합니다.

3. 3. OS 대화 상자 전후에 검증된 패스키 메시지와 아이콘을 사용합니다.

패스키 OS 대화 상자를 트리거하기 전에 현재 작업의 상태와 관련된 패스키 메시지, 아이콘 및 동작을 표시합니다. 패스키 OS 대화 상자가 완료되거나 해제된 후 메시지와 아이콘을 사용하여 작업의 결과 상태를 표시합니다. 이는 신뢰 당사자(RP) 웹사이트와 OS 대화상자 사이에 ‘핸드셰이크’를 제공하고, 패스키를 통해 계정 액세스 및 보안을 최적화하기 위해 OS와 RP가 어떻게 협력하고 있는지 명확하게 설명하여 새로운 개념의 패스키에 대한 사람들의 신뢰와 관심을 높이는 데 도움이 됩니다.

4. 패스키와 관련된 자유와 선택권을 허용합니다.

소비자가 자신의 경험을 계속 제어하고 브랜드에 대한 신뢰를 쌓을 수 있도록 비밀번호 생성 및 관리와 관련된 명확한 옵션을 제공하세요. 비밀번호를 사용하거나 사용하지 않고 계정을 만들 수 있도록 허용합니다. 비밀번호 재설정 시 새 비밀번호를 만들거나 대신 패스키를 만들도록 허용하세요.

5. 패스키 사용 전후에 접근성 원칙을 준수합니다.

Passkeys 사용자가 인식할 수 있는 방식으로 제공되고, 보조 기술을 사용하여 작동할 수 있으며, 패스키를 사용하는 과정에서 워크플로 전반에 걸쳐 다양한 기능적 요구 사항을 가진 사용자가 이해할 수 있는 방식으로 사용자에게 표시될 때 가장 쉽게 액세스할 수 있습니다. 장애가 있는 사용자가 FIDO 배포에 액세스할 수 있도록 하기 위한 지침 및 기본 WCAG(Web Content Accessibility Guidelines)와 같은 접근성 지침을 준수합니다.

6. 고객 여정 전반에 걸쳐 패스키 히어로 프롬프트를 일관되게 사용하세요.

특정 기호, 헤드라인, 메시지, 콜투액션이 포함된 패스키용 ‘히어로’를 만듭니다. 고객 여정에서 계정과 관련된 순간에 전체 영웅 콘텐츠를 일관되게 사용하세요. 예를 들어, 전체 영웅을 사용하는 것과 ‘비밀번호 생성’ 버튼만 사용하는 것을 비교해 보세요.

7. 패스키에 대한 유용한 정보를 유지합니다.

추가 클릭 없이도 비밀번호에 대한 유용한 정보를 휴먼 인터페이스에서 확인할 수 있습니다. 예를 들어, 패스키가 생성된 후에도 계정 설정의 영웅 메시징에서 패스키 ‘무엇’ 및 ‘어디’ 메시지를 유지합니다. 텍스트를 기본적으로 표시하고 추가 클릭 아래에 숨기지 마세요. 다른 예로, 사람들에게 비밀번호를 비활성화할 수 있는 선택권을 주어야 하지만 비밀번호 없이 로그인하는 방법을 이해하지 못할 수도 있으므로 ‘비밀번호 비활성화’ 링크 옆에 비밀번호를 비활성화하면 어떤 기능이 수행되는지에 대한 간단한 설명을 추가하세요. 휴먼 인터페이스에서 이 설명을 계속 유지합니다. 예를 들어, 마우스오버 시에만 노출되는 툴팁에는 이 정보를 넣지 마세요.

8. 계정 설정에서 비밀번호를 기본 옵션으로 설정합니다.

비밀번호의 표시 및 상호작용 모델을 개인의 계정 설정에서 사용자 아이디, 비밀번호 또는 2FA와 같은 다른 인증 항목의 표시 및 상호작용 모델과 일치시킵니다. 예를 들어 계정 설정 내의 다른 로그인 옵션에 H2 제목으로 레이블이 지정된 경우 “Passkeys”에도 H2 제목으로 레이블을 지정합니다.

9. 의미 있는 콘텐츠가 담긴 ‘패스키 카드’를 표시하여 패스키에 모양을 부여합니다.

문자, 숫자, 기호의 가시적인 조합인 비밀번호와 달리 디지털 패스키는 대부분 사람들에게 보이지 않습니다. 계정 설정에서 패스키 카드 어포던스를 표시합니다. 카드 안에는 비밀번호 아이콘, 메시지, 옵션이 포함되어 있어 비밀번호가 활성 상태이고 사용 가능하며 관리할 수 있다는 신뢰를 심어주고 안심할 수 있습니다. 패스키가 두 개 이상인 경우 각 패스키에는 고유한 카드가 있습니다.

10. 고유한 보안 및 비즈니스 요구사항에 따라 UX를 계획하세요.

이 지침은 synced passkeys 사용하는 FIDO에 고유한 UX 개념에 중점을 둡니다. 이 작업을 통해 다양한 형태의 신원 증명 및 비-FIDO 인증 예제를 볼 수 있습니다. 본 가이드라인은 신원 증명 또는 기타 비-FIDO 인증 메커니즘에 대한 보안 가이드라인을 규정하지 않으며, 이는 각 RP마다 고유한 비즈니스 요구 사항과 보안 정책에 따라 달라질 수 있습니다. 가이드라인 전체에서 자체 보안 정책과 비즈니스 동인이 작용하는 부분을 나타내는 이 기호 [ i ]를 찾아보세요.

---

콘텐츠 원칙

UX 원칙은 콘텐츠 디자인 및 전략에 어떻게 적용되나요? 비밀번호 콘텐츠를 안내하기 위해 다음 세 가지 핵심 원칙을 강조하고 있습니다. 또한 조사에 사용한 언어를 보여주는 권장 사항도 포함했습니다. 테스트한 콘텐츠를 그대로 사용하거나 회사의 스타일, 목소리, 어조에 맞게 수정하여 사용할 수 있습니다.

1. 패스키 언어와 아이들이 알고 있는 단어를 짝지어 줍니다.

Passkeys 많은 사용자에게 새로운 개념입니다. 비밀번호가 이미 사용하고 있는 다른 방법과 어떻게 연관되는지 보여줌으로써 이 새로운 로그인 방법의 가치를 이해하도록 도와주세요. 예를 들어 “패스키를 사용하면 복잡한 비밀번호를 기억할 필요가 없습니다” 또는 “Passkeys 지문, 얼굴 또는 비밀번호를 사용하여 만드는 암호화된 디지털 키입니다.”

2. 2. OS 대화 상자 전후에 명확한 “핸드셰이크” 메시지를 사용합니다.

OS 대화 상자 앞에 “계정 만들기” 또는 “패스키 만들기” 메시지를 명확하게 표시하고, 그 뒤에 확인 또는 성공 메시지를 표시하여 사용자가 OS 패스키 환경에 대해 확신을 가질 수 있도록 하세요. 이를 통해 사용자는 회사가 OS와 협력하여 패스키를 통해 계정을 보호하고 있다는 사실을 안심할 수 있습니다.

3. 고객 여정 전반에 걸쳐 패스키 메시지를 사용합니다.

고객 경험 및 인터페이스의 여러 영역에서 비밀번호 프롬프트와 정보를 사용하여 계정 생성, 복구, 설정 등 고객 여정에서 계정과 관련된 순간에 사용자가 비밀번호를 사용하도록 유도하세요. 여기에는 명확하게 표시된 ‘비밀번호 생성’ 버튼부터 ‘왜’, ‘무엇을’, ‘어디에’ 비밀번호를 입력해야 하는지에 대한 자세한 메시지까지 다양합니다.

계정 예시 콘텐츠 만들기

비밀번호 분실로 인한 계정 복구 중 비밀번호 생성

계정 설정