🍎
Icon Composerの導入方法と注意点
Icon Composerとは
Icon Composerでは、1つのデザインからLiquid Glassでレイヤーによって構成されたアイコンをiPhone、iPad、Mac、Apple Watch用に作成できます。新しいマルチレイヤー形式のアイコンでは、Liquid Glassのプロパティを簡単に調整したり、動的なライティングエフェクトをプレビューしたり、複数の外観モード全体に注釈を付けたりできます。Icon ComposerはXcodeとシームレスに連携するように設計されており、マーケティングやコミュニケーションのニーズに合わせてアイコンをフラット化し、エクスポートするオプションも用意されています。
導入方法
- macOS 15.3以降にアップデートする
- Xcode 26以降にアップデートする
- Icon Composerをインストールする
- Icon Composerでアイコンを作成する
- Icon Composerファイルを保存する
- 保存したファイルをXcodeのProject Navigatorにドラッグ&ドロップする
- Xcodeで
General>App Icons and Launch Screen>App Iconで保存したIcon Composerファイル名（拡張子不要）を設定する - ビルドして確認する
注意点
導入における注意点
- macOSのバージョンが不足しているとIcon Composerを使えません
- Xcode 26にしないとXcodeでIcon Composerファイルを読み込めません
- Assetsにファイルを追加するのではなくProject Navigatorにドラッグ&ドロップする必要があります（他の方法もあるかもしれないですが）
作成における注意点
特定のモードのときは別の値を使いたいときは設定項目のアイコン部分にホバーする必要があり、現在選択中のモードに対して上書きする値を設定することができます。
最後に
FigmaやIllustratorで自分でエフェクトを追加しなくてもIcon Composerで読み込めば勝手にいい感じのLiquid Glassのエフェクトが設定されるので、楽ちんで楽しいです。
App Storeでアプリを公開している方々は、とりあえず既存のアイコンをそのまま読み込んで試してみるといいと思います！
| Before | After |
|---|---|
 |
 |
Discussion