상세화면설계 - 소셜로그인 관련 유의사항 (로그인, 마이페이지 등)

서비스를 개발하다 보면 불가피하게 마주치는 기능 중 하나가 바로 '로그인'입니다. 특히 요즘은 개인정보 입력의 번거로움을 줄이고 사용자 경험을 향상시키기 위해 소셜로그인을 도입하는 경우가 많아졌습니다.

하지만 단순해 보이는 이 기능 뒤에는 생각보다 복잡한 설계 고려사항들이 숨어 있습니다. 소셜로그인은 편리함 뒤에 숨겨진 여러 함정이 있어 설계 시 꼼꼼한 검토가 필요한 영역입니다.

---

소셜로그인의 이해

소셜로그인이란 카카오, 네이버, 구글, 애플 등 이미 사용자가 계정을 가지고 있는 플랫폼의 인증을 활용하여 별도의 회원가입 절차 없이 서비스에 로그인할 수 있게 하는 기능입니다.

소셜로그인을 도입함으로써 사용자는 새로운 아이디와 비밀번호를 기억할 필요가 없고, 서비스 제공자는 회원가입 단계에서의 이탈률을 낮출 수 있다는 장점이 있습니다.

제가 과거 금융 서비스를 기획했을 때, 회원가입 단계에서 약 40%의 사용자가 이탈했던 것을 소셜로그인 도입 후 22%로 줄일 수 있었습니다. 수치로 보면 확실히 효과적인 방법이지만, 그만큼 고려해야 할 사항도 많습니다.

---

소셜로그인 설계 시 주요 고려사항

1. 제공할 소셜로그인 플랫폼 선정

모든 소셜로그인 플랫폼을 지원하는 것이 이상적으로 보일 수 있지만, 실제로는 타겟 사용자층과 서비스 성격에 맞는 플랫폼을 선별적으로 제공하는 것이 중요합니다.

국내 서비스라면 카카오와 네이버는 기본으로 고려하되, 글로벌 사용자를 대상으로 한다면 구글, 페이스북, 애플 등을 추가해야 합니다. 특히 iOS 앱이라면 애플 로그인은 필수 요소가 되었습니다.

진행했던 프로젝트에서 타겟 사용자층이 40대 이상이었을 때, 카카오와 네이버 로그인만 제공했더니 사용성 테스트에서 "왜 구글은 없나요?"라는 피드백이 많았습니다. 결국 타겟층이라고 생각했던 사용자들의 실제 사용 패턴은 우리의 예상과 달랐던 것이죠. 사용자 리서치는 정말 중요합니다.

---

2. 로그인 흐름 설계

소셜로그인의 흐름은 생각보다 복잡합니다. 기본적인 흐름은 다음과 같습니다:

1. 소셜 플랫폼 선택
2. 해당 플랫폼의 인증 화면으로 이동
3. 인증 완료 후 서비스로 복귀
4. 필요한 추가 정보 수집 (선택적)
5. 로그인 완료

여기서 중요한 것은 사용자가 인증 과정에서 취소하거나 오류가 발생했을 때의 대응 방안도 설계해야 한다는 점입니다.

예를 들어, 카카오 로그인 중 사용자가 '취소'를 눌렀을 때 어떤 메시지를 보여줄 것인지, 어디로 리다이렉트할 것인지 등에 대한 세부 기획이 필요합니다.

또한 처음 로그인하는 사용자와 이미 소셜계정으로 가입한 사용자를 구분하여 각각 다른 흐름을 제공해야 합니다.

---

3. 필수 정보와 선택 정보 구분

소셜로그인을 통해 얻을 수 있는 정보와 서비스에 필요한 정보 사이에는 차이가 있을 수 있습니다. 예를 들어, 이커머스 서비스라면 배송지 주소가 필요하지만 소셜로그인만으로는 이 정보를 얻을 수 없습니다.

따라서 소셜로그인 후 추가 정보를 수집하는 단계를 설계해야 하는데, 이때 필수 정보만 최소한으로 요구하는 것이 중요합니다. 불필요한 정보 요청은 사용자 이탈의 원인이 됩니다.

과거 한 프로젝트에서 소셜로그인 후 추가 정보 입력 화면에 10개 이상의 항목을 넣었던 적이 있습니다. 결과적으로 해당 단계에서의 이탈률이 60%에 달했고, 결국 필수 정보 3개만 남기고 나머지는 마이페이지에서 선택적으로 입력하도록 변경했습니다. 그 결과 이탈률이 25%로 크게 감소했던 경험이 있습니다.

---

4. 계정 연동 및 통합 문제

가장 까다로운 부분 중 하나가 바로 계정 연동 문제입니다. 다음과 같은 시나리오를 고려해야 합니다:

• 이미 일반 이메일로 가입한 사용자가 동일한 이메일의 소셜계정으로 로그인하려는 경우
• 여러 소셜계정을 하나의 서비스 계정에 연결하려는 경우
• 소셜계정을 변경하거나 연결 해제하려는 경우

이러한 시나리오에 대한 처리 방법을 명확히 설계해야 합니다. 예를 들어, 동일 이메일로 가입된 계정이 있는 경우 "이미 가입된 이메일입니다. 계정을 연동하시겠습니까?"와 같은 안내와 함께 계정 통합 옵션을 제공할 수 있습니다.

한 SNS 서비스 기획 시, 이 부분을 간과하여 사용자들이 여러 개의 계정을 생성하게 되었고, 나중에 데이터 통합 문제로 큰 어려움을 겪었던 적이 있습니다. 초기 설계 단계에서 이런 시나리오를 고려하는 것이 중요합니다.

---

마이페이지 내 소셜로그인 관련 기능

마이페이지는 사용자가 자신의 계정 정보를 관리하는 공간으로, 소셜로그인과 관련하여 다음과 같은 기능을 제공해야 합니다:

1. 연결된 소셜계정 확인 및 관리

사용자가 현재 어떤 소셜계정이 연결되어 있는지 확인하고, 필요에 따라 연결 해제하거나 다른 계정으로 변경할 수 있는 기능이 필요합니다.

이때 중요한 것은 모든 소셜계정을 한 번에 연결 해제할 수 없도록 제한해야 한다는 점입니다. 적어도 하나의 로그인 방법은 유지되어야 사용자가 계정에 접근할 수 있습니다.

한 프로젝트에서 이 부분을 간과하여, 사용자가 모든 소셜계정 연결을 해제한 후 로그인할 방법이 없어 고객센터로 문의가 쇄도했던 경험이 있습니다. 이런 상황을 방지하기 위해 "적어도 하나의 로그인 방법이 필요합니다"라는 안내와 함께 마지막 남은 계정은 해제할 수 없도록 설계해야 합니다.

---

2. 추가 소셜계정 연동

사용자가 새로운 소셜계정을 기존 계정에 연동할 수 있는 기능도 중요합니다. 이때 새로운 소셜계정이 이미 다른 서비스 계정에 연결되어 있는 경우의 처리 방법도 고려해야 합니다.

일반적으로는 "이 소셜계정은 이미 다른 계정에 연결되어 있습니다. 기존 연결을 해제하고 현재 계정에 연결하시겠습니까?"와 같은 안내와 함께 선택권을 제공합니다.

이 과정에서 사용자 데이터가 어떻게 처리될지에 대한 명확한 안내도 함께 제공해야 합니다. 예를 들어, "기존 계정의 데이터는 유지되지만 현재 계정으로 로그인할 수 없게 됩니다."와 같은 정보를 제공하는 것이 좋습니다.

---

3. 계정 삭제 시 고려사항

소셜로그인으로 가입한 계정을 삭제할 때도 몇 가지 고려해야 할 사항이 있습니다:

• 소셜계정 연결 해제와 서비스 계정 삭제의 차이점을 명확히 안내
• 계정 삭제 시 소셜플랫폼에 대한 권한도 함께 해제되는지 여부
• 데이터 백업 또는 이전 옵션 제공

특히 소셜로그인의 경우, 서비스 계정을 삭제해도 소셜플랫폼에 대한 권한 동의는 자동으로 해제되지 않는 경우가 많습니다. 따라서 "계정 삭제 후에도 [소셜플랫폼] 설정에서 권한을 직접 해제하실 수 있습니다."와 같은 안내를 제공하는 것이 좋습니다.

한 프로젝트에서 이 안내가 없어 계정을 삭제한 사용자들이 여전히 앱에 권한이 있다고 오해하여 불만이 제기된 적이 있습니다. 작은 안내 하나가 사용자 경험과 신뢰에 큰 영향을 미칠 수 있습니다.

---

소셜로그인 관련 보안 고려사항

소셜로그인은 편리함을 제공하지만, 보안 측면에서도 몇 가지 중요한 고려사항이 있습니다:

1. 토큰 관리

소셜로그인은 OAuth 토큰을 기반으로 작동하며, 이 토큰의 안전한 저장과 관리는 매우 중요합니다. 기획 단계에서 다음과 같은 내용을 개발팀과 협의해야 합니다:

• 토큰의 저장 위치 및 방법
• 토큰 만료 시 자동 갱신 프로세스
• 보안 취약점 발생 시 대응 방안

이는 기술적인 내용이지만, 기획자도 기본적인 이해를 갖고 있어야 사용자 경험에 미치는 영향을 고려할 수 있습니다.

예를 들어, 토큰이 만료되었을 때 사용자에게 어떤 메시지를 보여줄 것인지, 자동으로 재로그인을 시도할 것인지 등에 대한 UX 설계가 필요합니다.

---

2. 개인정보 동의 및 관리

소셜로그인을 통해 어떤 개인정보를 수집할 것인지, 이에 대한 동의를 어떻게 받을 것인지 명확히 설계해야 합니다.

특히 국내 서비스의 경우 개인정보보호법과 정보통신망법을 준수해야 하므로, 법적 요건을 충족하는 동의 프로세스를 설계해야 합니다.

동의 화면은 소셜플랫폼에서 제공하는 기본 화면을 사용하게 되지만, 서비스 내에서도 어떤 정보가 수집되고 어떻게 사용되는지 투명하게 안내해야 합니다.

개발을 진행하면서 추가 항목에 대한 접근이 필요한 경우, 초기설계에서 미리 요청 항목을 정의하고, 부득이하게 접근권한을 재요청하거나 추가 권한을 요청하는 경우를 재현해볼 수 있도록 시나리오를 추가 작성하여 설계 진행하는 것 또한 필요합니다.

---

3. 소셜플랫폼 정책 변경 대응

소셜플랫폼의 정책이나 API가 변경되는 경우에 대한 대응 방안도 고려해야 합니다. 예를 들어, 페이스북이나 구글의 API 정책이 변경되면 로그인 기능이 작동하지 않을 수 있습니다.

따라서 정기적인 모니터링과 업데이트 프로세스를 기획에 포함해야 하며, 긴급 상황 시 사용자에게 안내할 내용도 준비해야 합니다.

"현재 [소셜플랫폼] 로그인 서비스에 일시적인 문제가 발생했습니다. 다른 로그인 방법을 이용하거나 잠시 후 다시 시도해주세요."와 같은 안내 메시지를 미리 준비해두는 것이 좋습니다.

---

소셜로그인 설계 시 팁과 모범 사례

1. 사용자 테스트 진행

소셜로그인은 기술적으로 복잡한 기능이므로, 실제 사용자를 대상으로 한 테스트를 통해 문제점을 발견하고 개선하는 과정이 매우 중요합니다.

특히 다음과 같은 시나리오를 테스트해볼 것을 권장합니다:

• 처음 소셜로그인을 사용하는 경우
• 이미 가입한 사용자가 다른 소셜계정으로 로그인을 시도하는 경우
• 소셜계정 연결을 해제하고 다시 연결하는 경우
• 여러 기기에서 동시에 로그인하는 경우

이러한 테스트를 통해 발견된 문제점을 설계에 반영하면 더 안정적인 서비스를 제공할 수 있습니다.

---

2. 명확한 안내 문구 작성

소셜로그인과 관련된 모든 안내 문구는 사용자가 이해하기 쉽게 작성해야 합니다. 기술적인 용어보다는 일상적인 언어를 사용하고, 필요한 경우 추가 설명이나 도움말을 제공하는 것이 좋습니다.

예를 들어, "OAuth 토큰 인증에 실패했습니다"보다는 "로그인에 실패했습니다. 소셜계정 연결을 확인하고 다시 시도해주세요."와 같이 사용자 친화적인 문구를 사용합니다.

또한 사용자의 행동이 미치는 영향에 대해서도 명확히 안내해야 합니다. "이 소셜계정 연결을 해제하면 해당 계정으로 더 이상 로그인할 수 없게 됩니다. 계속하시겠습니까?"와 같이 구체적인 결과를 알려주는 것이 중요합니다.

---

3. 대체 로그인 방법 제공

소셜로그인만 제공하는 것보다는 이메일/비밀번호 로그인과 같은 대체 방법도 함께 제공하는 것이 좋습니다. 소셜플랫폼 서비스에 문제가 발생하거나 사용자가 소셜계정을 사용하지 않는 경우에도 서비스에 접근할 수 있도록 해야 합니다.

또한 소셜로그인 사용자에게도 비상용 로그인 방법(예: 이메일 인증)을 설정할 수 있는 옵션을 제공하면 더욱 안정적인 서비스 경험을 제공할 수 있습니다.

한 게임 서비스에서 소셜로그인만 제공하다가 해당 플랫폼에 장애가 발생했을 때 사용자들이 서비스에 접근할 수 없었던 사례가 있습니다. 이후 대체 로그인 방법을 추가하여 비슷한 상황에 대비할 수 있었습니다.

---

4. 소셜로그인 버튼 디자인 가이드라인 준수

각 소셜플랫폼은 자사의 로그인 버튼에 대한 디자인 가이드라인을 제공합니다. 이를 준수하는 것은 단순히 규정을 따르는 것을 넘어 사용자에게 익숙한 경험을 제공하는 데 중요합니다.

예를 들어, 카카오의 노란색 버튼, 네이버의 녹색 버튼 등은 사용자들이 이미 학습된 패턴이므로, 이를 변경하면 혼란을 줄 수 있습니다.

또한 소셜로그인 버튼의 배치 순서도 중요한데, 일반적으로 사용 빈도가 높은 순서대로 배치하는 것이 좋습니다. 국내 서비스라면 카카오, 네이버, 구글 순으로 배치하는 경우가 많습니다.

---

5. 에러 상황에 대한 상세 설계

소셜로그인 과정에서 발생할 수 있는 다양한 에러 상황에 대한 설계도 중요합니다. 대표적인 에러 상황은 다음과 같습니다:

• 네트워크 연결 문제
• 소셜플랫폼 서버 장애
• 권한 거부 (사용자가 필요한 권한을 거부한 경우)
• 계정 정보 불일치 (이미 다른 방식으로 가입된 경우)

각 상황별로 적절한 에러 메시지와 대응 방안을 설계해야 합니다. 예를 들어, 네트워크 문제의 경우 "인터넷 연결을 확인하고 다시 시도해주세요."와 함께 재시도 버튼을 제공할 수 있습니다.

소셜 API와 연동 시 버튼 영역을 사용하게 되는데, 소셜로그인 사용 시 체크해줘야 하는 영역 외에 크게 "로그인 버튼 영역"과 "로그인 시도" 단계, "로그인 완료" 후 액션으로 구분해서 생각해보면 좋습니다.

또한 로그인 후 최초 들어온 사용자라면 소셜 로그인을 통해 어떤 정보를 받아와서 활용 할 것인지에 대한 정책설계가 중요합니다.

---

6. 소셜로그인 통계 및 분석 설계

소셜로그인 사용 패턴을 분석할 수 있는 지표를 설계하는 것도 중요합니다. 다음과 같은 지표를 추적하면 서비스 개선에 도움이 됩니다:

• 소셜플랫폼별 사용 비율
• 소셜로그인 완료율 vs 이탈률
• 소셜로그인 후 추가 정보 입력 완료율
• 소셜계정 연동/해제 패턴

이러한 데이터를 기반으로 어떤 소셜플랫폼이 사용자들에게 더 선호되는지, 어떤 단계에서 사용자 이탈이 발생하는지 등을 파악하여 지속적으로 서비스를 개선할 수 있습니다.

제가 진행했던 프로젝트에서는 소셜로그인 통계를 분석한 결과, 예상과 달리 구글 로그인의 완료율이 가장 높았고 이탈률은 가장 낮았습니다. 이를 바탕으로 구글 로그인 버튼을 가장 앞에 배치하는 등의 개선을 통해 전체 로그인 완료율을 높일 수 있었습니다.

---

소셜로그인은 단순해 보이지만 사용자 경험과 서비스 안정성에 큰 영향을 미치는 중요한 기능입니다. 기획 단계에서 충분한 시간을 들여 다양한 시나리오를 고려하고, 개발팀 및 디자인팀과 긴밀히 협업하여 완성도 높은 소셜로그인 경험을 제공할 수 있도록 해야 합니다.

무엇보다 소셜로그인은 사용자에게 편의성을 제공하기 위한 기능이므로, 항상 사용자 관점에서 생각하고 불필요한 복잡성은 제거하는 방향으로 설계하는 것이 중요하다고 생각합니다.

로그인은 서비스의 첫인상을 결정짓는 중요한 요소이니, 사용자가 서비스를 처음 만났을 때 좋은 경험을 제공할 수 있도록 신중하게 설계해보시길 바랍니다.

---

Jay Kim
웹/앱 서비스기획 26년차
현대경제연구원 IT분야 전문 컨설턴트
프로필 http://bit.ly/3E1OGQB
프로젝트 문의: mailside@gmail.com (카카오톡, 지메일)