透明なモックアップ：ストア以外のどこでも役に立つ

背景を透明にして書き出したモックアップは、どのページにも、どのスライドにも、どの色の区画にも置けて、そこに属しているように見えます。作れる中で最も再利用しやすい素材であり、同時に両ストアが受け付けない形式でもあります。

透明が効く場所

区画の背景を CSS で定義しているサイトのヒーロー。資料ごとに色が変わるスライド。同じデバイス画像が3つの区画に登場するマーケティングページ。背景を制御できないメール。いずれの場合も、透明な PNG や WebP なら背景ごとに書き出す代わりに1つで済み、ブランド刷新にもレンダリングし直さずに耐えます。

影の問題

接触影はデバイスではなく背景に属します。したがってアルファ付きで書き出すと、影が失われるか、暗い背景では不自然に見える半透明の汚れが焼き込まれます。実務的な答えは2つです。影をアルファに含め、レンダリング時と明度の近い背景にだけ置くか、影なしで書き出して CSS で足すかです。大きく異なる背景で使い回すなら後者が安全です。

ストアには決してアルファを送らない

App Store のスクリーンショットと Play のフィーチャーグラフィックにはアルファチャンネルを含められません。他は完璧な素材が、透明な角ひとつで検証に落ちます。しかもエラーメッセージが原因を明示するとは限りません。素材ごとに2つの書き出しを持っておいてください。自社用の透明なマスターと、ストア用の統合済みバージョンです。