1つのプロジェクトで、両ストアに対応。
Flutterの強みは「1つのコードベースで2つのストア」という点にあります。ところが、ほとんどのスクリーンショットジェネレーターはその思想を共有していません — iPhoneのアスペクト比とAndroidのアスペクト比で、デザインを2回作り直す必要があります。Screenshotifyはマルチプラットフォームの現実を前提に設計されています。ターゲットとするデバイスを選んで、マルチパネルコンポーザーで一度デザインし、プラットフォーム → デバイス → ロケールの構成でZIPとしてエクスポートできます。
Flutterのスクリーンショットワークフロー
- 実機またはシミュレータでアプリを起動します。ヒーローショット、メイン機能、使いどころが伝わるシーンなど、必要なパネルをキャプチャしてください。
flutter screenshotはコマンドラインから実行できます。 - Screenshotifyを開きます。PNGのスクリーンショットをドロップしてください。オートフィット機能が画像のアスペクト比を選択したデバイスフレームに合わせるので、レターボックスは発生しません。
- カルーセルを組み立てます。キャプション付きで3〜5パネル構成にし、連結レイヤー(グラデーションバーなど)はパネルをまたいで適用できます。
- 両ストア向けのデバイスを選択します。iPhone 16 Pro Max(App Store 6.9")とPixel 8 Pro(Play Store)。タブレット対応アプリならiPad 13"も追加してください。
- 対象ロケールに翻訳します — FlutterアプリはApp Storeの39言語とPlay Storeのグローバル市場すべてを対象にすることが多いです。
- ZIPとしてエクスポートします。フォルダ構成は 6.9"/、iPad 13"/、Pixel/、Galaxy/ の各フォルダにロケール別サブフォルダが入ります。
Flutterエコシステムの代替手段
screenshot pubパッケージは、実行中のアプリからウィジェットのスクリーンショットをそのまま取得します。ソースフレームのキャプチャには便利ですが、マーケティング用オーバーレイの追加はできません。これはiOS側のFastlane snapshotと同じトレードオフです — 実機キャプチャか、デザインされたマーケティングカルーセルか、という選択になります。
多くのFlutterチームが落ち着く組み合わせは、実アプリからパネルをキャプチャするためのflutter screenshotまたはscreenshot pubパッケージと、マーケティング合成およびローカライズエクスポートのためのScreenshotifyです。
iOSとAndroidのデザイン規約への対応
ベゼルの厚み、ノッチの形状、AndroidのナビゲーションバーといったUI規約の違いから、同じアプリのスクリーンショットでもiPhoneフレームとPixelフレームでは見た目が変わります。Screenshotifyはどちらも正確にレンダリングします。iOSのステータスバー(9:41表示)のオン・オフ切り替えや、デバイスクラスごとの傾き角度の調整も可能で、両ストアにまたがってカルーセルの一貫性を保てます。