会員証デザイン編集（ランク別カラー・ロゴ・ライブプレビュー）

Apple Wallet Google Wallet 会員証デザインランクロゴライブプレビュー会員ランク

Wallet 会員証のデザインは、店舗管理画面のデザイン編集ツールから、ランクごとに背景色・ロゴ・テキスト色をライブプレビューを見ながら編集 できます。プラスチックカードのように刷り直す必要はなく、デザインを変更すると Apple Wallet と Google Wallet の両方にすぐ反映されます。

本記事では、デザイン編集画面の使い方、ランクごとのデザイン管理、画像の推奨スペック、公開後の既存カードへの反映の仕組みをご案内します。

編集画面を開く

店舗管理画面 →「ストアアプリ」→「会員証」→「デザイン編集」を開きます。左側にカラーと画像の設定パネル、右側に Apple Wallet と Google Wallet のライブプレビューが並んで表示されます。

編集できる項目

背景色 — カードの主色です。店舗様のブランドカラーを設定してください
テキスト色 — 店舗名・会員番号・ランク名などのテキスト色です。背景色とのコントラストを十分に確保してください
ラベル色 — 「会員番号」「ランク」などの小さなラベル文字の色です。本文テキストとは別に設定できます
ロゴ画像 — カード左上に表示される店舗様のロゴです（後述の推奨スペック参照）
ストリップ画像（任意） — カード上部に表示される横長の帯画像です。店舗の外観写真・キャンペーンビジュアルなどを設定できます
アイコン — 通知や Wallet 一覧で表示される小さなアイコンです。ロゴと同じ画像を流用できます

ランクごとに別々のデザイン

会員ランク（例: 一般・シルバー・ゴールド・プラチナ）ごとに、それぞれ異なるデザインを設定できます。お客様のランクが上がると、Wallet 上の会員証も自動でデザインが切り替わります。

典型的なデザイン例：

一般 — 店舗のブランドカラー（例: 白地に黒文字）
シルバー — 銀色やライトグレー
ゴールド — ゴールド（#D4AF37 など）に濃いめのテキスト
プラチナ — 黒地にゴールドのアクセント

ランクごとに「特別感」を演出すると、お客様のランクアップへのモチベーションにつながります。

ライブプレビュー

右側のプレビューは、設定を変更すると即座に反映されます。Apple Wallet と Google Wallet の両方の表示を並べて確認できるため、両 OS で違和感のない仕上がりにできます。

プレビューには、お客様の名前と会員番号がサンプルデータで表示されます。実際の発行時には、お客様の登録情報が入ります。

ロゴ・画像の推奨スペック

ロゴ画像
- 推奨サイズ：480×150 px（縦横比 3.2:1）
- 形式：PNG（透過背景推奨）または JPEG
- ファイルサイズ：1 MB 以下
ストリップ画像
- 推奨サイズ：1125×432 px（縦横比 2.6:1）
- 形式：PNG または JPEG
- ファイルサイズ：2 MB 以下
アイコン
- 推奨サイズ：87×87 px 以上（正方形）
- 形式：PNG（透過背景推奨）
- ファイルサイズ：500 KB 以下

解像度の高い画像をアップロードした場合は、レシートローラー側で自動的にリサイズと最適化を行います。元画像はそのまま保持されるため、後から再生成も可能です。

カラー設計のヒント

背景色とテキスト色のコントラストを確保 — 屋外や暗い店内でも会員番号が読み取りやすいよう、十分なコントラストを設けてください
ロゴはカードの背景色とコントラストが出る色を選ぶ — 白いロゴは濃い背景に、濃いロゴは明るい背景に
ランクごとに「視覚的なジャンプ」を作る — 一般とゴールドが似た色だと、ランクアップの達成感が伝わりにくくなります
店舗様のブランドカラーを基本に — 既存の店舗看板・ロゴ・パッケージと合わせると、お客様にとって「同じお店」と認識しやすくなります

変更を公開する

編集が完了したら、画面右上の「公開」ボタンを押します。公開すると：

新規に発行される会員証は、すぐに新しいデザインで発行されます
既存のお客様の Wallet 内の会員証も、自動的に新しいデザインに更新されます（Apple / Google のサーバー経由でプッシュ更新されます）

既存の会員証を更新するのに数分から数十分かかる場合があります（Apple / Google 側のプッシュ配信タイミングによります）。お客様が手動で更新する必要はありません。

下書き保存

「公開」を押すまでの編集内容は、下書きとして自動保存されます。後で続きを編集できるため、デザインを試行錯誤しても既存のお客様の会員証には影響しません。

始め方

店舗管理画面 →「ストアアプリ」→「会員証」→「デザイン編集」を開きます
編集したいランクを左側のタブで選択します
背景色・テキスト色・ラベル色を設定します（カラーピッカーまたは HEX 値で指定）
ロゴ画像とストリップ画像（任意）をアップロードします
右側のプレビューで Apple Wallet・Google Wallet 両方の見た目を確認します
他のランクも同様に編集します
「公開」ボタンを押して反映します