harublog 
maharu
この記事はiOSアプリアイコンの作成と設定方法について説明していきます。
なんだか難しそう。素材探しやサイズの変更とかも大変そう。
haru
maharu
最初はどうして良いかわからなかったので、詳細に説明していきます。
クリックできる目次
動作環境
| Item | Version |
|---|---|
| Xcode | 12.5 |
| MacOS | Big Sur 11.4 |
アイコンのダウンロード
無料で使えてアイコンに最適なサイトがありますので、ダウンロードする手順を説明していきます。下記ボタンを押すと別タブでFLAT ICON DESIGNのサイトが開かれます。
①時計と入力（今回は砂時計を検索するため。他に好きなキーワードでもOK）
②検索をクリック
①砂時計の画像を選択
①、②、いずれかの画像を選択
①サイズを選択
②ファイル名を選択
③背景あり、背景なし、影のみのいずれかを選択
④表示中の画像をダウンロードをクリック
①メニューバーのFinderを選択
②ダウンロードされた画像
ダウンロードした画像の編集
Keynoteを使用して下記の手順で画像を編集していきます。
①メニューバーのKeynoteを選択
②新規書類を選択
③ホワイトを選択
④作成を選択
①初期設定でスライドにテキストが2つあるので、shiftを押しながら2つ選択し、deleteで削除
②ダウンロードした画像をスライドへドラッグ&ドロップ
③下記画像のようにアイコンをスライドの中央へ配置
① 
を選択
②色を選択
③command＋shift＋４を押しながら画像を切り取るように正方形にスクリーンショットを撮影すると、下記のように画像が保存されます。これは妥協策ですので、有料のイラストレーター等で正確な正方形を作成することができる方は、妥協せずに作成していただければと思います。
App Icon Generatorでアプリアイコンサイズを変更しXcodeへの設定
Xcodeに設定する画像は18枚の画像(サイズは20×20px〜1024×1024px)が必要になります。画像を1個ずつ変更するのが面倒という方のために、App Icon Generatorというサイトで画像を変更し、アプリアイコンへの設定方法を説明していきます。下記にリンクを貼っておきます。
①画像を②の枠内へドラッグ&ドロップ
③Generateをクリック
①メニューバーのFinderを選択
②ダウンロードされたZIPファイル
③ZIPファイルを解凍
④AppIcon.appiconsetをダブルクリック
⑤Xcodeに設定するための各サイズの画像一覧が表示
Xcodeでダウンロードされた画像をアイコンに設定する方法
実際にXcodeを起動し、アイコンの設定を行っていきます。プロジェクトの作成後の初期画面から説明しますので、Xcodeのワークスペースの名称について、下記にリンクを貼っておきます。
【Xcode】新規プロジェクトを作成する方法とGitHubからクローンを作成する方法について
① 
Show the Project navigatorを選択
②Assets.xcassetsを選択
①初期に表示されているAppIconを選択しDeleteで削除する
②AppIcon.appiconsetを①が表示されていた箇所のスペースにドラッグ&ドロップ
③各サイズの画像が設定される
設定されたアイコンの確認
下記画像のようにアイコンが設定されました。
まとめ
Keynote等を使用して画像を組み合わせたり、背景色を変える等、ご自身で色々試してみると面白いと思います。
