다크 모드 테마

다크 모드는 사용자가 시스템 전체에 색상을 설정할 수 있는 기능을 제공합니다( Android 10 및 iOS 13에 도입됨). ‘어두운’ 테마는 배터리 수명을 절약하고 사용자의 눈의 피로를 줄이는 동시에 앱 개발자에게 사용자가 선호하는 어두운 색상 테마를 더 쉽게 구현할 수 있는 방법을 제공하기 위한 것입니다.

Braze 인앱 메시지는 대체 다크 테마를 추가하여 사용자의 선호도에 따라 적절한 색상 메시지를 전달하고 앱 디자인과 일관성을 유지할 수 있도록 지원합니다.

다크 모드 작동 방식

Android 10 또는 iOS 13 이상 버전을 사용하는 사용자는 기기 설정에서 다크 모드를 켜거나 끌 수 있습니다.

다크 모드가 활성화되면 기기의 기본 메뉴와 화면(푸시 알림, 기기 설정 등)이 짙은 회색으로 변경됩니다. 앱 코드에서 대체 테마를 지정하여 앱이 다크 모드를 지원하도록 선택할 수도 있습니다.

어두운 모드 테마 설정

The new Dark Mode option, located in the Style tab when creating an in-app message, lets you easily add an alternate color theme for users who are in Dark Mode on their device.

When this option is enabled, you can choose dark theme colors for your in-app message using the color picker, or by selecting existing Color Profiles to re-use existing Dark or Light themes.

지속적으로 다크 모드 사용

모든 인앱 메시지에 다크 모드를 사용하려면 템플릿 > 인앱 메시지 템플릿으로 이동하세요.

From there, select Create Color Profile from the dropdown. 다크 모드 테마에 맞는 색상 프로필을 만듭니다. 그런 다음 인앱 메시지의 다크 모드 버전을 만들 때마다 해당 색상 프로필을 선택하여 인앱 메시지의 모양을 일관되게 유지할 수 있습니다.

호환성

• 사용자는 iOS 기기 버전 13 이상 또는 Android 기기 버전 10 이상을 사용 중이어야 합니다.
• Braze iOS SDK v3.21.0+ Braze Android SDK v3.8.0+가 필요합니다.

HTML 인앱 메시지 사용

HTML 인앱 메시지에 대한 다크 및 라이트 테마를 만들려면 prefers-color-scheme CSS 미디어 기능을 사용하여 사용자의 선호도를 감지할 수 있습니다.

예를 들어, 다음과 같습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
@media (prefers-color-scheme: dark) {
  body {
    background: #333;
    color: white;
  }
}

@media (prefers-color-scheme: light) {
  body {
    background: white;
    color: #555;
  }
}