iPhone/iPadアプリに必要なサイズのアイコンを一括生成するバッチを作りました

  • iOS

ios-appicons

アイコンはiPhone/iPadアプリに必須なものですが、iOS5~7でRetinaディスプレイも対応となると意外に多くのサイズのアイコン画像が必要になります。

そこでiPhone/iPadアプリに必要なアイコンのサイズ一覧をまとめ、複数のサイズのアイコンを一括で生成するバッチを作ってみたのでメモします。

iPhone/iPadアプリに必要なアイコンのサイズ一覧

iOS5~7までのiPhone/iPadアプリに必要なアイコン画像のサイズ一覧です。アプリそのものだけでなく「設定」アプリ用のものやSpotlight用のものも用意する必要があるため、とても数が多いです。

デバイス 適用箇所 サイズ サイズ(Retina)
iPhone 設定アプリ用(iOS 5-7)
Spotlight用(iOS 5,6)
29×29 58×58
Spotlight用(iOS 7) 80×80
アプリ用(iOS 5,6) 57×57 114×114
アプリ用(iOS 7) 120×120
iPad 設定アプリ用(iOS 5-7) 29×29 58×58
Spotlight用(iOS 5,6) 50×50 100×100
Spotlight用(iOS 7) 40×40 80×80
アプリ用(iOS 5,6) 72×72 144×144
アプリ用(iOS 7) 76×76 152×152
その他 AppStore用 1024×1024

上記のサイズはAsset Catalogでも確認することができます。
Asset Catalog アイコン一覧

iPhoneかiPadどちらか一つであれば多少数が減りますが、ユニバーサルアプリ(iPhone/iPad両対応のアプリ)では全てのサイズが必要となります。

iPhone/iPadアプリに必要なサイズのアイコンを一括生成するバッチ

アイコンを作成する際は、AppStore申請時に必要なサイズ(1024 * 1024)で作成することが多いと思います。そこで縦横1024pxのPNG画像を用意するだけでアプリに必要なサイズのアイコンを全て生成するバッチを作りました。内容と使い方をご紹介します。

バッチの内容

画像のリサイズにはMacの画像処理用の標準コマンドsipsを使っています。以下はバッチの中身(シェルスクリプト)です。

#!/bin/bash

# カレントディレクトリをファイルの場所に変更
cd `dirname $0`

#ファイル名の入力を待つ
echo -n "縮小元となる 1024x1024 アイコンのファイル名(拡張子なし):"
read filename

#アイコンサイズ一覧(px)
array=(29 40 50 57 58 72 76 80 100 114 120 144 152)

for i in "${array[@]}"
do
	sips -Z $i ${filename}.png --out ${filename}_${i}x${i}.png
done

縮小元となる画像を読み込み、sipsコマンドを使ってあらかじめ定義してあるサイズに一括で変換をかけるだけの簡単な仕組みです。ソフトのインストール等は必要ありません。適宜改変すれば縮小サイズや出力ファイル名を変えることも可能です。

sipsコマンドについては以下のサイトが参考になりました。
参考サイト:画像の一括リサイズをコマンドラインで! Macなら標準sipsコマンドで可能だった。

バッチの使い方

バッチはこちらのリンクからダウンロード可能です。ZIPファイル形式(491B)です。

解凍するとMacでダブルクリックで実行可能な.command形式になっています。

バッチファイルの配置

バッチファイルIconResize.commandを、縮小元とする画像と同じフォルダに置きます。縮小元の画像の大きさは1024pxが適当ですが、それ以下のサイズでも152px以上の正方形であればOKです。
iOSアプリアイコン一括生成 バッチ配置

バッチファイルに実行権限を付与

Macでは実行権限を付与しないと*.commandファイルが実行できないため、ターミナルでバッチファイルのフォルダまでcdで移動したあと、chmodコマンドで実行権限を付与します。

chmod u+x IconResize.command

iOSアプリアイコン一括生成 実行権限付与

バッチの実行

バッチファイルIconResize.commandをダブルクリックで実行します。実行するとターミナルが起動しますが、もし起動しない場合は「右クリック」→「このアプリケーションで開く」→「ターミナル.app」を選択して実行します。
iOSアプリアイコン一括生成 実行

実行すると縮小元ファイルの名前を聞いてくるため、拡張子無しのファイル名を入力します。Icon.pngが縮小元ファイルの場合、Iconを入力するといった具合です。
iOSアプリアイコン一括生成 ファイル名指定

ファイル名を入力し終わるとアイコンの一括生成が始まります。
iOSアプリアイコン一括生成 生成中

アイコンの一括生成が完了すると、バッチファイルと同じ場所に各種サイズのアイコン画像が出力されています。
iOSアプリアイコン一括生成 出来上がり

Finderで「大きさ」を確認すると、ファイル名に記載のものと同じ大きさになっているはずです。
iOSアプリアイコン一括生成 出来上がり確認

生成されたアイコンはAsset Catalogにセットする等して使用します。
アイコンをAsset Catalogにセット

おわりに

Mac標準のコマンドだけで画像の縮小ができるのには驚きました。他にも良いやり方がありそうな気もしますが、これで複数サイズアイコン作成の大変さからは解放されそうです。