イラストレーターを使ったiTunesConnect提出用スクショの作成

iTunesConnectの提出用のスクショは画像サイズの種類が多くて、

画像を用意するの大変ですよね。

そこで僕がやってる方法を紹介します。

僕自身がイラレを使い慣れているので、この方法が一番楽に感じます。

テンプレートを用意しました。

イラレで開いてみてください。(イラレのバージョンはCS5です）

ss_temp.ai

見ると画面サイズごとのアートボードが設定してあります。

アートボードとはアートボード内の画像を切り出してくれる便利機能です。

噂によると最近photoshopもこの機能がついたとか。

実はphotoshopのことはよく知らないですが…

まあ他のツールでも似たようなことできるかもしれません。

そしてアプリのスクショを１枚用意します。

サイズは１種類だけでよいです。

それをイラレに貼り付けます。

このとき画像はイラレファイルに埋め込んでおくと良いでしょう。

今度は、その貼り付けた画像をアートボードの大きさに調整します。

画面の上に数値を入力する場所を使えば、

正確に合わせることができます。

※テンプレートでは@1xの設定にしています。

なのでアートボードのサイズは

320x480

320x568

375x667

621x1104

と半分の大きさになっています。

後で書き出すときに@2xにしてます。

また、このときに文字や装飾など足したい人は足してください。

サイズ毎に文字サイズやレイアウトを微調整できるので便利です。

はいできました！

では、これを書き出します。

ファイルメニューから「書き出し」を選びます。 

書き出しの際、

・jpgにする(透明情報があるpngだとiTCに怒られるので…）

・各アートボードごとをチェックする。

・書き出すアートボード番号を指定する。

※アートボード番号は画面右下のアートボードウィンドウを見るとわかります。

アートボードウィンドウが見つからない場合は、

「ウィンドウ」メニューから「アートボード」メニューを開いて確認してください。

解像度は144にしてください。

これで@2xの解像度で画像が書き出されます。 

以上です。

画像が出来たでしょうか？

一度このイラレファイルを作っておけば、

後でちょっと変更したいなあ、という場合など、

すぐ対応できるので便利だと思います。