Android 12の変更により、異なるOEMに対してさまざまなUI仕様があり、Androidデバイスでの画像の表示方法に違いが生じています。画像の外観は、デバイスの幅やデバイスのOEMによって異なる場合があります。プッシュ通知の理想的なアスペクト比は以下の通りです。
画像の理想的なアスペクト比
Pixel、Xiaomi、Asusの電話はタイプAデバイスに分類されます。画像の理想的なアスペクト比は、さまざまなプッシュテンプレートに対して以下の表に詳述されています。
| テンプレートタイプ | 画面サイズ | 理想的な画像サイズ/アスペクト比 |
|---|---|---|
|
スタイライズされた基本、カルーセル、タイマー (プッシュテンプレートにボタンが存在する場合)
|
小さな幅のスクリーン |
2.33 |
|
最も一般的な画面サイズ |
2.85 | |
|
大画面、テーブル、フォルダブル |
3.11 |
|
|
スタイライズされた基本、カルーセル、タイマー (プッシュテンプレートに存在するボタン付き)
|
小さな幅のスクリーン |
1.77 |
|
最も一般的な画面サイズ |
2.17 | |
|
大画面、テーブル、フォルダブル |
2.37 | |
|
プログレスバー付きタイマー
(プッシュテンプレートにボタンが含まれています) |
小さい幅のスクリーン |
2.00 |
|
最も一般的な画面サイズ |
2.45 | |
|
大画面、テーブル、フォールダブル |
2.67 |
|
|
プログレスバー付きタイマー
(プッシュテンプレートにボタンはありません) |
小さい幅の画面 |
1.58 |
|
最も一般的な画面サイズ |
1.93 | |
|
大画面、テーブル、折りたたみ式 |
2.11 | |
|
画像バナー (プッシュテンプレートにボタンが存在する) |
小さな幅のスクリーン |
1.26 |
|
最も一般的な画面サイズ |
1.55 | |
|
大型スクリーン、テーブル、フォルダブル |
1.69 |
|
|
イメージバナー (プッシュテンプレートにボタンがない場合) |
小さい幅の画面 |
1.06 |
|
最も一般的な画面サイズ |
1.3 | |
|
大画面、テーブル、フォルダブル |
1.42 |
Samsung、OnePlus、Oppo、Vivo、Realme、その他の電話はタイプBデバイスに分類されます。画像の理想的なアスペクト比は、さまざまなプッシュテンプレートに関する次の表に詳述されています。
| テンプレートタイプ | 画面サイズ | 理想的な画像サイズ/アスペクト比 |
|---|---|---|
|
スタイライズされた基本、カルーセル、タイマー (プッシュテンプレートにボタンが存在する)
|
狭い幅の画面 |
2.61 |
|
最も一般的な画面サイズ |
3.13 | |
|
大画面、テーブル、フォルダブル |
3.39 | |
|
スタイライズされた基本、カルーセル、タイマー (プッシュテンプレートにボタンが含まれています)
|
小さな幅の画面 |
2.24 |
|
最も一般的な画面サイズ |
2.69 | |
|
大画面、テーブル、折りたたみ式 |
2.91 | |
|
プログレスバー付きタイマー
(プッシュテンプレートにボタンが含まれています) |
小さな幅のスクリーン |
1.42 |
|
最も一般的な画面サイズ |
1.7 | |
|
大画面、テーブル、フォルダブル |
1.84 | |
|
タイマーとプログレスバー
(プッシュテンプレートにボタンが存在しない場合) |
小さい幅のスクリーン |
1.99 |
|
最も一般的な画面サイズ |
2.38 | |
|
大画面、テーブル、折りたたみ式 |
2.58 | |
|
イメージバナー (プッシュテンプレートにボタンが存在する) |
小さい幅のスクリーン |
1.76 |
|
最も一般的な画面サイズ |
2.12 | |
|
大画面、テーブル、フォルダブル |
2.29 | |
|
イメージバナー (プッシュテンプレートにボタンが存在しない場合) |
小さい幅のスクリーン |
1.19 |
|
最も一般的な画面サイズ |
1.43 | |
|
大画面、テーブル、折りたたみ式 |
1.55 |
ベストプラクティスと推奨事項
複数のデバイス用に異なる画像を作成することが不可能であるため、MoEngageは、プッシュ通知がさまざまなデバイスで一貫して表示されるように、以下の画像スケーリングアプローチを採用することを推奨します。
-
クリエイティブはいつクロップされるべきではないか
デバイスタイプAの最も一般的な画面サイズに指定されたアスペクト比に従って、プッシュ通知を作成してください。 画像コンテナにフィットさせる を 画像スケーリング セクションで使用して、クリエイティブが切り取られないようにしてください。横または縦に白いスペースが見える場合があります。
-
あなたのクリエイティブが両端に意味のあるコンテンツを持っていない場合(各側から10%のマージン)
画像コンテナを埋める オプションをテンプレート作成時の 画像スケーリング セクションで使用し、画像にマージンを追加します。これにより、極端な場合でも、意味のあるコンテンツが切り取られることは決してなくなります。たとえマージンが切り取られているのが見えたとしても。