macOS Big Sur風のアプリアイコンを作ってみよう

macOS Big Surのアイコンは賛否両論、というより否定的な意見がほとんどだが一部では「macOS Big Sur風のアイコンを作りmacOS CatalinaなどのアイコンをBig Sur風に変更する」というカスタマイズを行うユーザーも出てきている。

現状ではmacOS Big Surデベロッパーベータにおいてもアイコンが変更されたのはApple製のアプリやシステムアイコンのみで、サードパーティーアプリはまだmacOS Big Surのデザインに準じたものではなく、独自のアイコンを採用しているものがほとんどだ。

ここではmacOS Big Sur風のアイコンを実際に自作(というより既存アイコンを加工)してmacOS Catalina上でサードパーティアプリのアイコンを変更してみたので、その行程を紹介する。

作るのが面倒な場合、クリエイターの制作したアイコンを利用する

画像出典 Monterey

もしmacOS Big Sur風のアイコンにしたいもののアイコンの自作が面倒、あるいは加工や編集を行う環境がない場合は既に多数のクリエイターがmacOS Big Sur風のアイコンを制作しているので、クリエイターの公式サイトやRedditなどのフォーラムで配布されているアイコンパックを利用するのも手だ。

参考 icons macOSReddit検索

ただし、Redditなどで配布されているアイコンファイルの中にはmacOS Big Surからそのまま抜き出したアイコンも多数あり、Appleの規約的に問題がある他、マルウェアが混入している可能性もゼロではないためそういったアイコンファイルには注意してほしい。

macOS Big Surのアイコンの変更は困難な模様

なお、前述のアイコンを作ったクリエイター自身の報告ではmacOS Big Surのアイコンを変更するには新たな「承認済みrootモード」でのSIPの無効化に加えて「.CARファイル」を編集する必要があり、CatalinaまでのmacOSと違ってアイコンの変更が一段と困難になっているようだ。

参考 Monterey Icon Pack, for everyone in the beta hating the new iconsReddit

本記事はあくまでmacOS CatalinaまでのアイコンをmacOS Big Sur風に変更するという趣旨なので、macOS Big Surのアイコン変更方法についてはパブリックベータ、あるいは正式版リリース時に改めて記事に書こうと思う。

macOS Big Sur風アイコン作りの工程

今回は動画プレイヤーの「IINA」のアイコンを例にmacOS Big Sur風のアイコンを自分で加工・編集して変更する行程を解説していく。

見ての通り現時点での「IINA」はmacOS Big Surのような「角丸アイコン」ではなく独自のサークルアイコンであるため、macOS Big Surのデザインには準じていない。

既存のアプリアイコンからPNGファイルを書き出す

macOS上のアプリはほとんどの場合においてそのアプリアイコンはパッケージの中にICNSファイルとして内包されているため、自由に書き出すことが可能だ。

まずはデザインの土台となるアプリのアイコンを画像編集ソフトなどで利用できるように書き出そう。

まずアイコンを取り出したいアプリを右クリックし「パッケージの内容を表示」をクリック。

「Contents」>「Resources」と辿っていくと大抵のアプリの場合「Appicon.icns」という名前のICNSファイルがあるので右クリックして「プレビュー」アプリで開こう。

プレビューアプリでICNSファイルを開いたらメニューバーの「ファイル」から「書き出す」をクリック。

フォーマットをPNGに変更して保存しよう。

以上でアイコンの書き出しは完了だ。

画像編集ソフトで加工する

続いては画像編集ソフトなどでアイコンの土台となる「角丸」の図形を描く。

今回はAffinity Photoを使用したが大して高度なことはしていないので大半の無料アプリケーションでも同様のことが行えるだろう。

また、角丸の図形を描くのが困難な場合は冒頭で書いたクリエイターなどが制作したアイコンを編集してしまうのも手だ。

Affinity Photoの場合は「角丸図形ツール」で「コーナータイプ」を「丸み付け」にして丸み具合を「24%」程度に変更すると上記のようなmacOS Big Sur風の角丸図形が作れる。

なお、土台の角丸図形には上記画像では影を付けているが、実際のmacOS Big Surのデフォルトアイコンの角丸図形には影は付いていないのでお好みでいいだろう。

続いて先ほど書き出したアイコン(ここではIINAのアイコン)を読み込み、土台の角丸図形に合わせて配置する。

macOS Big Surのアイコンの特徴は角丸であることと独特の影が付いていることなのでアイコンの影をmacOS Big Sur風に変更していこう。

また、macOS Big Surのアイコンは照明効果を施したような物もあるため、お好みで「照明ツール」などでスポットライト効果などを与えてもいいだろう。

影や照明効果が満足の行く仕上がりになったらPNGファイルとして書き出そう。

シャドウカラーやぼかし、光彩を調整して柔らかな雰囲気を出す

ちなみにこれは同時進行で加工していたMicrosoft Edgeのアイコンだが、元のアイコンの色合いによってはシャドウカラーの変更やぼかし、光彩を駆使するとmacOS Big Surのアイコン特有の「ふんわり」とした色合いも出せる。

アイコンの元々の持ち味を活かして色々と編集してみると楽しい。

LiteIconでアイコンを変更する

編集したアイコンをPNGファイルとして書き出したら続いては手軽にアイコンを変更するために「LiteIcon」という無料のアイコン変更用アプリをダウンロードしよう。

「LiteIcon」を用いなくても手動でアイコンファイルを置き換えたり「情報を見るウィンドウ」にアイコンをドラッグアンドドロップするという方法もあるがLiteIconを使用した方が遥かに手っ取り早い。

LiteIconを起動したら上記のようなウィンドウが開くのでアイコンを変更したいアプリケーションに先ほど作ったアイコン(PNGファイル)をドラッグアンドドロップする。

一覧から目的のアプリケーションを探す際はサーチボックスにアプリケーション名を入力すると早いだろう。

アイコンをアプリケーションにドラッグアンドドロップするとLiteIcon上のアイコンが置き換わる。

LiteIcon上にアイコンの変更が反映されたら「Apply Changes」をクリックしてmacOS全体に適用しよう。

あとは当該アプリを一度起動すればアイコンが変わるはずだ。

なお、一度アイコンを変更したのならLiteIconは起動している必要はない。

DockやLaunchpadなどでアイコンの変更を確認したら完了。

なお、今回のように加工・編集したアイコンを自分で利用する分にはいいが、不特定多数にアイコンファイルという形で配布するのはアプリの規約に違反する可能性があるのでやめておこう。

システムアイコンを変更する場合、SIPを無効にする必要がある

なお、macOSのシステムアイコンなどを変更する場合はmacOSのプロテクト「System Integrity Protection」を無効にする必要がある。

SIPの無効化やシステムアイコンの詳しい変更方法は下記記事を参照して頂きたい。

Macでアプリのアイコンを任意の画像に変更する方法

なお、前述の通りmacOS Big SurではSIPの無効化に加えて.CARファイルを編集する必要もあり、現状ではアイコンの変更がかなり困難である。

まとめ macOS Big Surでアイコン自作ブーム到来?

同時進行で加工したMicrosoft Edgeのアイコン

海外では日に日に「macOS Big Sur風にアイコンを変更する(あるいはmacOS Big Surのアイコンを好みのデザインに変更する)」という動きが加速しており、一種のアイコン自作ブームのような動きも一部で見られる。

前述のようにmacOS Big Surのアイコンを変更するのは現時点ではかなり手間がかかるようだが、macOS CatalinaまでのmacOSを利用している人でmacOS Big Surのアイコンデザインを体験してみたいという場合は本記事の方法でアイコンを加工・編集・変更してみるといいだろう。