Macアプリ アイコン作成・変更方法 SKETCH.appデータなど
category：general
Mac OSのDockに並ぶよく使うソフトのアイコンたち、使い勝手以上に何より見た目を気にしてしまう人も多いと思います。
ブラウザのアイコンも顕著ですが、Yosemite以降よりフラット化されたデザインのアイコンのを多く見かけます。
WEB開発系のツールなどはどれも洗練されてポップなアイコンも多いのですが、中にはそうでないものやスキュアモーフィックなアイコンなど浮いて見えてしまうこともありますよね。
MacのFinderには、アプリのアイコンの変更は基本的な編集機能として備わっておりますし、アイコンの作成は1つの画像から基本ソフトのみてできます。
また、SKETCH.appなど使っていれば世界中のクリエイター作成したデータが扱えたり、自分でゼロから作成することも簡単です。
今回はMacのアイコンに関して取り上げたいと思います。
アイコンの変更
今回はCodaを例にして紹介します。
MacのFinderで『アプリケーション』フォルダまで移動します。
（Dock内のアプリを右クリックして、「オプション→Finderに表示」が便利です）
目的のアイコンを選択して、 ⌘ (コマンド) ＋ I か右クリックで『情報を見る』を選択。
このようなウインドが立ちがるので、赤枠のところに〜.icnsファイルをドラック＆ドロップすればアイコンが変更されます。
（パスワードを求められたらMacのユーザーアカウントのパスワードを入力）
※いつでも元のアイコンに戻せるように、赤枠の部分を ⌘ (コマンド) ＋ C でコピーし、『プレビュー』のアプリを立ち上げて ⌘ (コマンド) ＋ N で新規ファイル作成でクリックボード内のアイコンが表示されますので保存してバックアップをとっておくことをオススメします。
過去投稿Link：「Macアプリケーションのアイコン画像を摘出する方法。」
画像からアイコンデータの作成
Retina対応にするため1024px×1024px以上の正方形の画像を用意します。
そしてフォルダを1つ作成、名前を“xxx.iconset”にします。
（xxxは任意でアプリの名前など 例：coda.iconset）
画像をフォルダの中にいれ、コピペして合計10個の画像ファイルにします。
そして各ファイルのサイズとネーミングをプレビューなどを使用して以下のようにします。
- icon_512x512@2x.png
- icon_512x512.png
- icon_256x256@2x.png
- icon_256x256.png
- icon_128x128@2x.png
- icon_128x128.png
- icon_64x64@2x.png
- icon_32x32@2x.png
- icon_32x32.png
- icon_16x16.png
@2xがついているファイルは、倍のサイズを用意し、解像度(ppi)を144に設定。
（icon_512x512@2x.pngだと、1024px×1024px ppi：144）
面倒ですがもうちょっとです。
画像が揃ったら今度は『ターミナル』を立ち上げます。
コマンドラインツールですが、入力することは簡単！
起動したらまずは先ほどの“xxx.iconset”がある同じ階層まで移動します。
（例：デスクトップ上に“coda.iconset”フォルダを作成した場合）
cd Desktop/
移動したら、下記のコマンドを入力して対象のフォルダを.iconファイルにします。
iconutil -c icns xxx.iconset
すると、移動した階層を見てみると（例：デスクトップ上には）“xxx.iconset”という名前のファイルが出来上がっています。
このファイルを先ほどの手順で差し替えればアイコンが切り替わります。
「Yoios」のアイコンパック
iOS 8風アイコンパック「[Yoios(https://github.com/mmarfil/yoios/)]」がGithubで公開されています。
YoiosにもSKETCH.appのデータファイルが入っていますが、SKETCH.app sourcesにも数々のアイコンデータが公開されています。
Codaのアイコンもこのようにフラットな感じで作成したり…。
（Codaはやっぱり瑞々しいシズル感のあるアイコンの方が魅力的かもしれませんが…）
今回作成したアイコンをオリジナルと合わせてダウンロードできますので、試しに変えてみてください。
0