ダークモードテーマ

ダークモードは、ユーザーにシステム全体のカラープリファレンスを設定する機会を提供します（Android 10およびiOS 13で導入されました）。”ダーク “テーマは、アプリ開発者にダークカラーテーマを実装する方法を提供する一方で、バッテリー寿命を節約し、ユーザーの目への負担を軽減することを意図している。

Brazeアプリ内メッセージは、ユーザー群の好みに応じて適切な色のメッセージを配信し、アプリのデザインとの一貫性を維持するために、代替のDarkテーマの追加をサポートしている。

ダークモードの仕組み

Android 10 以降または iOS 13 以降のバージョンを使用しているユーザーは、デバイスの設定でダークモードのオン / オフを切り替えることができます。

ダークモードが有効になっている場合、デバイスのネイティブメニューと画面（プッシュ通知、デバイス設定など）はダークグレーに変更されます。また、アプリのコードで代替テーマを指定することにより、アプリでダークモードをサポートすることもできます。

ダークモードテーマの設定

アプリ内メッセージの作成時にDesignタブにあるDark Modeを使えば、端末をDark Modeにしているユーザー向けに別のカラーテーマを追加できる。

このオプションをイネーブルメントにすると、カラーピッカーを使用してアプリ内メッセージのダークテーマカラーを選択するか、既存のカラープロファイルを選択して既存のダークまたはライトテーマを再利用することができる。

ダークモードを一貫して使用する

すべてのアプリ内メッセージにダークモードを使用するには、テンプレート > アプリ内メッセージテンプレート に移動します。

そこから、ドロップダウンからカラー プロファイルを作成を選択します。ダークモードのテーマに合わせたカラープロファイルを作成します。次に、アプリ内メッセージのダークモードバージョンを作成するたびに、そのカラープロファイルを選択して、アプリ内メッセージの外観を一貫性のあるものに保つことができます。

互換性

• お客様はiOSデバイスのバージョン13以上、またはAndroidデバイスのバージョン10以上である必要があります。
• Braze iOS SDK v3.21.0+ Braze Android SDK v3.8.0+ が必要です。

アプリ内メッセージでHTMLを使用する

HTMLのアプリ内メッセージにダークテーマとライトテーマを作成するには、ユーザーの好みを検出するためにprefers-color-schemeCSSメディア機能を使用できます。

以下に例を示します。

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;
  }
}