한국어
각 앱 또는 조직의 로그인 경험을 어떻게 맞춤화할 수 있나요?
다중 앱 및 다중 테넌트 비즈니스를 위한 맞춤 로그인 경험 설정 방법.
Guamian
Product & Design
Product & Design
다중 앱 및 다중 테넌트 비즈니스를 위한 맞춤 로그인 경험 설정 방법.
앱에 대한 로그인 흐름을 설정하는 것은 매우 일반적이지만 때때로 다소 복잡한 시나리오를 만나게 될 것입니다.
가장 쉬운 접근법은 모든 앱과 조직에 대한 보편적인 로그인 환경을 유지하는 것입니다. 예를 들어, HubSpot은 다양한 제품을 제공하지만, 그들의 로그인 경험은 모든 제품에서 일관성을 갖습니다. 이는 HubSpot과 같은 모 브랜드를 강조하는 데 도움이 되며, Marketing Hub과 같은 개별 제품보다는 모 브랜드를 강조합니다.
일부 기업은 다중 제품 전략을 따르지만 단일 사용자 풀을 유지하는 것을 선호합니다. 예를 들어, 잘 알려진 SaaS 기업인 Atlassian은 Jira와 Confluence 같은 여러 소프트웨어 제품을 제공합니다. 여기 그들의 로그인 화면이 있습니다.
로그인 URL에는 ?bundle=jira-software 매개변수가 포함되어 있어 Jira 제품에 대한 로그인 인터페이스임을 나타냅니다.
로그인 URL에는 ?bundle=confluence 매개변수가 포함되어 있어 Confluence 제품에 대한 로그인 인터페이스임을 나타냅니다.
앱 간의 로그인 UI 차이점:
그러나 주요 인증 방법은 모든 앱에서 일관성을 유지합니다. 이것은 사용자들이 더 효과적인 아이덴티티 관리를 위해 식별자(이메일, 소셜 계정) 및 인증 요소(예: 비밀번호)를 포함한 통합된 프로파일을 가질 수 있게 보장합니다.
또 다른 예로는 서로 다른 클라이언트가 별도의 워크스페이스를 호스팅할 수 있는 다중 테넌트 앱인 Notion이 있습니다. 예를 들어,
"Silverhand"가 워크스페이스 이름이라면 Notion은 조직별 로그인 UI를 표시할 것입니다. 유일한 차이점은 로고이며, 나머지는 동일합니다.
먼저, 구축할 기반으로서의 아이덴티티 및 인증 솔루션이 필요합니다. Logto를 예로 들어 솔루션을 설명하겠습니다. Logto는 이를 달성하기 위한 다양한 옵션을 제공합니다:
로고와 버튼 색상만 사용자 정의하고 싶을 경우에 가장 빠르고 쉬운 솔루션입니다.
"앱 수준의 로그인 경험"을 활성화함으로써 각 앱에 대한 특정 브랜딩 및 색상을 설정할 수 있습니다. 앱 수준 브랜딩이 활성화된 앱에서 로그인 시작 시, 로그인 경험은 앱 수준 브랜딩 설정에 따라 사용자화됩니다. 그렇지 않으면 범용 로그인 경험 설정으로 기본값이 설정됩니다.
앱 수준 브랜딩은 밝은 모드와 어두운 모드 설정 모두 가능합니다. 어두운 모드 설정은 범용 로그인 경험 설정에서 어두운 모드가 활성화된 경우에만 적용됩니다.
그런 다음 로그인을 트리거할 때, organization_id 매개변수를 사용하여 Logto에 표시할 조직 로고를 지정할 수 있습니다. 예를 들어, 조직 ID 123456에 대한 조직 로고를 표시하려면:
signIn 메서드의 extraParams 객체 내에 organization_id 매개변수를 전달할 수 있습니다.organization_id 매개변수를 전달할 수 있습니다.여기 Logto 브라우저 SDK를 사용하여 signIn 메서드에 organization_id 매개변수를 전달하는 방법의 예가 있습니다:
로고 및 색상 사용자 정의로 충분하지 않은 경우—예를 들어, 특정 소셜 로그인 옵션을 숨기거나 외관을 완전히 바꾸고 싶은 경우—Logto Cloud에 나만의 UI를 업로드할 수 있습니다.
앱 또는 조직을 기반으로 다른 UI를 표시하려면 검색 매개변수에서 organization_id 및 app_id를 사용하세요. 그런 다음 이러한 매개변수를 기반으로 UI를 제어하는 스크립트를 작성하세요. 자세한 내용은 "나만의 UI 사용하기" 튜토리얼을 참조하세요.