[회원가입UI] 회원가입설계서

회원가입 설계 샘플

회원가입 절차에서 일반적으로 다루는 항목들은 다음과 같습니다:

1. 사용자 이름 (Username): 사용자가 로그인 시 사용할 고유한 식별자입니다.
2. 비밀번호 (Password): 계정 보안을 위해 사용하는 비밀 코드로, 일정한 복잡성 규칙을 따르기도 합니다.
3. 이메일 주소 (Email Address): 계정 확인, 비밀번호 재설정, 공지사항 등을 위한 주요 연락 수단입니다.
4. 전화번호 (Phone Number): 2단계 인증이나 비밀번호 복구에 사용될 수 있습니다.
5. 이름 (Full Name): 사용자의 실명을 요구하는 경우가 많습니다.
6. 생년월일 (Date of Birth): 사용자의 나이를 확인하거나, 특정 연령대에 맞춘 서비스를 제공하기 위해 사용됩니다.
7. 성별 (Gender): 성별에 따라 맞춤형 서비스를 제공하기 위해 선택할 수 있습니다.
8. 주소 (Address): 제품 배송이나 지역 맞춤형 서비스 제공을 위해 필요할 수 있습니다.
9. 프로필 사진 (Profile Picture): 사용자의 계정을 개인화하고 식별하기 위해 업로드할 수 있습니다.
10. 약관 동의 (Terms and Conditions Agreement): 서비스 이용에 대한 약관 및 정책에 대한 동의를 요구합니다.
11. 마케팅 정보 수신 동의 (Marketing Preferences): 프로모션 및 마케팅 정보를 수신할지 여부를 선택할 수 있습니다.

서비스 제공자에 따라 추가적인 정보나 특정한 항목을 더 요구할 수 있으며, 사용자의 개인정보를 보호하기 위해 보안 절차가 포함될 수 있습니다.

 

[네이버 회원가입 예]

네이버 회원가입

 

회원가입 절차에서 약관 동의와 개인정보 수집 및 이용 동의는 중요한 단계입니다.

아래에 두 가지 타입의 플로우를 설명하겠습니다.

 

Step 1: 약관 동의

이용약관

Type 1: 상세내용 일부 제공 (스크롤)

1. 필수, 선택 구분: 필수 약관과 선택 약관을 구분하여 표시합니다.
2. 상세내용 일부 제공 (스크롤): 약관 내용을 스크롤 가능한 영역에 일부 제공하여 사용자가 읽을 수 있도록 합니다.
3. 필수 미동의 시 Alert: 사용자가 필수 약관에 동의하지 않을 경우, "약관에 동의하셔야만 회원가입이 가능합니다."라는 경고 메시지를 표시합니다.

Type 2: 상세페이지 (새창 또는 모달 팝업)

1. 필수, 선택 구분: 필수 약관과 선택 약관을 구분하여 표시합니다.
2. 약관 클릭: 사용자가 약관 제목을 클릭하면 새창 또는 모달 팝업으로 상세페이지가 열립니다.
3. 필수 미동의 시 Alert: 사용자가 필수 약관에 동의하지 않을 경우, "약관에 동의하셔야만 회원가입이 가능합니다."라는 경고 메시지를 표시합니다.

개인정보 수집 및 이용 동의

Type 1: 상세내용 일부 제공 (스크롤)

1. 개인정보 수집 클릭: 사용자가 개인정보 수집 항목을 클릭합니다.
2. 상세내용 일부 제공 (스크롤): 개인정보 수집 및 이용에 대한 상세 내용을 스크롤 가능한 영역에 일부 제공하여 사용자가 읽을 수 있도록 합니다.
3. 필수 미동의 시 Alert: 사용자가 필수 항목에 동의하지 않을 경우, "개인정보 수집에 동의하셔야만 회원가입이 가능합니다."라는 경고 메시지를 표시합니다.

Type 2: 상세페이지 (새창 또는 모달 팝업)

1. 개인정보 수집 클릭: 사용자가 개인정보 수집 항목을 클릭합니다.
2. 상세페이지 (새창 또는 모달 팝업): 클릭 시 새창 또는 모달 팝업으로 상세페이지가 열립니다.
3. 미동의 시 Alert: 사용자가 필수 항목에 동의하지 않을 경우, "개인정보 수집에 동의하셔야만 회원가입이 가능합니다."라는 경고 메시지를 표시합니다.

예시 UI 흐름

Type 1

1. 약관 동의 및 개인정보 수집 동의 페이지
   • 필수 이용약관 (스크롤 영역)
   • 선택 이용약관 (스크롤 영역)
   • 개인정보 수집 및 이용동의 (스크롤 영역)
2. Alert 메시지 (필수 항목 미동의 시)
   • "약관에 동의하셔야만 회원가입이 가능합니다."
   • "개인정보 수집에 동의하셔야만 회원가입이 가능합니다."

Type 2

1. 약관 동의 및 개인정보 수집 동의 페이지
   • 필수 이용약관 (클릭 시 새창/모달 팝업)
   • 선택 이용약관 (클릭 시 새창/모달 팝업)
   • 개인정보 수집 및 이용동의 (클릭 시 새창/모달 팝업)
2. Alert 메시지 (필수 항목 미동의 시)
   • "약관에 동의하셔야만 회원가입이 가능합니다."
   • "개인정보 수집에 동의하셔야만 회원가입이 가능합니다."

이와 같은 흐름을 통해 사용자가 필수 약관과 개인정보 수집 동의를 반드시 확인하고 동의하도록 유도할 수 있습니다.

 

회원가입 기획

  

회원가입 flow

---

 

기획은 검정색입니다.

"졸업 가운의 색이 검정인 이유는 검정이 성취와 권력의 색이기 때문입니다."

 

질문 환영합니다. 댓글 남겨주세요.
thinkhub