モックアップの書き出し形式を選ぶ

モックアップツールから書き出すものは3つの形式でほぼ賄えます。選択は2つの問いに収れんします。透明部分が必要か、そして送り先が要件を持つストアかどうかです。ここを外すと、却下されるアップロードか、無駄に重いページのどちらかになります。

ストアと透明が要るものには PNG

PNG は可逆でアルファに対応し、どこでも受け付けられます。ストア用スクリーンショット、アプリアイコン、後で別の背景に合成するモックアップに使ってください。弱点は写真的な内容でのファイルサイズですが、グラデーションの上のデバイスはまさに PNG が効率よく扱う種類の画像なので、実際の不利になることはまれです。なおストア用にはアルファを含められないので、形式が許しても書き出し前に統合してください。

ファイルが大きく単色が支配的なら JPEG

JPEG はアルファを持たず情報を失いますが、高品質なら多くの製品レンダリングでは見分けがつかず、容量は数分の一になり得ます。大きなフィーチャーグラフィックや、輪郭の完全さより帯域が重要なウェブ画像には適した選択です。滑らかなグラデーションのバンディングには注意してください。劣化はそこに最初に現れます。そして JPEG から JPEG を書き出さず、必ず元データに戻ってください。

ウェブには WebP、ただし代替の用意を

WebP は同等の品質で両者より小さいファイルになり、透明にも対応するので、自社サイトの既定として理にかなっています。ストアへのアップロードでは受け付けられないので、その書き出しは分けて管理してください。ブラウザのツールから書き出すなら、素材ごとに PNG のマスターを1つ残し、サイト用に WebP へ変換しておくと、デザイン変更時のために可逆の原本が残ります。