ハイライト
WWDC25 では Liquid Glass マテリアル、Icon Composer によるレイヤード アイコン制作フロー、SF Symbols 7 の Draw アニメーション システムが発表され、iOS / iPadOS / macOS のビジュアル言語が統一的に刷新されました。
主要内容
iOS 7 のとき、Apple はスキューモーフィズムを捨ててフラット デザインへ舵を切りました。それから 10 年が経ち、フラット デザインの代償が顕在化してきています。階層感の弱さ、コントロール同士の物理的な関係性の欠如、半透明マテリアルをいくら重ねても結局は紙を一枚貼っているだけに見えてしまう問題などです。WWDC25 が出した答えが Liquid Glass です。これは下層のコンテンツを屈折させるマテリアルで、明るい背景では冷たい光沢を、暗い背景では暖かみを帯び、スクロール中はコンテンツに追従してリアルタイムに反応します。これまで開発者が手書きしてきたカスタムの半透明コントロールは、いま一度見直す必要があります。システム マテリアルが実現できる質感を、自前の実装で同じレベルまで引き上げるのはまず難しいでしょう。
アイコン システムも合わせてルールが変わりました。これまでは 1024x1024 の画像を 1 枚提出すれば済んでいましたが、新しいフローでは「構造」を提出することが求められます。フォアグラウンド、バックグラウンド、ハイライトをレイヤー単位で Icon Composer に渡すと、システム側が Light / Dark / Tinted / Liquid Glass の 4 つのモードでの最終的な見た目を組み立ててくれます。SF Symbols 7 では Draw アニメーション システムが導入され、シンボルが彩色の変化によって進捗、ステータス、接続プロセスを表現できるようになりました。以前は Lottie を持ち出さないと作れなかったような細かなマイクロ インタラクションが、システム シンボルだけで実現でき、しかも周囲のコントロールとビジュアル言語が自然に揃います。この一連の変化の狙いはひとつ、App をシステムと一緒にアップデートさせることであり、システムが刷新されるたびに開発者が手作業で追従するという構図から脱却することです。
詳細
このセッションはデザインの全体像を扱う概要回で、コード スニペットは公開されていません。フォーカスはマテリアル(Liquid Glass)、アイコン(Icon Composer)、シンボル(SF Symbols 7)の 3 点です。
Liquid Glass の物理特性。これは下層のピクセルに反応する光学マテリアルであり、静的な半透明レイヤーではありません。Apple は Meet Liquid Glass の中で、屈折、鏡面反射、ライティング計算のロジックを解説しています。開発者側で shader を書く必要はなく、SwiftUI、UIKit、AppKit のシステム コントロールはすでに新しいマテリアルをデフォルトで使っています。Xcode をアップデートして再ビルドするだけで効果を確認できます。
新しいアイコン制作フロー。Icon Composer は新しいアイコン システムに合わせてリリースされたデスクトップ ツールです。入力はレイヤー付きのソース ファイル、出力は .icon パッケージで、その中にすべての外観バリエーションが含まれます。これまで複数の PNG を書き出していたワークフローは、「一度デザインすれば複数のレンダリングが生成される」方式に置き換わりました。具体的な操作については Create icons with Icon Composer を参照してください。
SF Symbols 7 の Draw アニメーション。SF Symbols 7 はシンボルのストロークを分解し、パスに沿ってアニメーションで描画したり、ステータスに応じて色を変化させたりできるようにしています。ダウンロード アイコンはグラデーションで進捗を表せますし、Wi-Fi アイコンは段階的に色を載せて接続プロセスを表現できます。詳細な API については What’s new in SF Symbols 7 で解説されています。
セッションの最後では、開発者に向けて次のような呼びかけがなされています。まずは Xcode をアップデートして一度ビルドし、システム コントロールが自動的にどう変わるかを見てください。第一印象は「悪くないな」となるはずですが、よく観察すると、いくつかのカスタム コントロールが新しいスタイルから浮いて見える箇所が出てきます。そこが優先的に対応すべきポイントです。
重要ポイント
-
Xcode 26 で一度リビルドし、不協和なコントロールを洗い出す: なぜ価値があるか — 新しいマテリアルと新しいシェイプはすでにシステム コントロールに対して標準で適用されており、もっとも素早い影響評価の方法は「どこが浮いているか」を見ることだからです。どこから始めるか — 最新の Xcode でプロジェクトを開き、主要フローを一通り走らせてスクリーンショットを撮り、カスタム コントロールとシステム コントロールを並べて比較し、対応リストを作成します。
-
.ultraThinMaterialなどの手動マテリアル指定を見直す: なぜ価値があるか — 多くのカスタム マテリアルは当初、システム コントロールの柔軟性が足りなかったために生まれたものですが、システム コントロールの能力が強化された今、カスタム実装の方がかえって脆弱になっています。どこから始めるか —Material、UIVisualEffectView、NSVisualEffectViewをプロジェクト全体で検索し、システム デフォルトの挙動に戻せるかを 1 件ずつ判断していきます。 -
アイコンの移行は急がなくてよいが、ソース ファイルのレイヤー化は今のうちに: なぜ価値があるか — アイコン リニューアルは一度きりでもコストが高い作業ですが、ちょうど App の新バージョン リリースのタイミングで実施するのが最も費用対効果に優れています。どこから始めるか — Icon Composer のレイヤー要件に合わせてデザイナーがソース ファイルを管理するようにし、リリース前に Icon Composer で新フォーマットへ書き出して、駆け込みのやり直しを防ぎます。
-
Liquid Glass を無効化して旧来の見た目を保とうとしない: なぜ価値があるか — ユーザーがシステムをアップデートすればすべてのネイティブ App が新しいスタイルになるため、古いスタイルを維持している App はかえって浮いて見えてしまうからです。どこから始めるか — 「旧来のビジュアルを保つ」というプロダクト要件はリストから削除し、その分の労力をカスタム コントロールの適応に振り向けます。
関連セッション
- Meet Liquid Glass — Liquid Glass の物理特性、光学的な振る舞い、適用シーン。
- Get to know the new design system — 新しいデザイン システムにおける情報アーキテクチャ、コンポーネント、デバイス間の一貫性に関する全体像の変化。
- Say hello to the new look of app icons — 新しいアイコン外観(Light / Dark / Tinted / Clear)のデザインとガイドライン。
- What’s new in SF Symbols 7 — SF Symbols 7 の Draw アニメーション システムと追加シンボル。
- Create icons with Icon Composer — Icon Composer ツールの使い方とエクスポート フロー。
コメント
GitHub Issues · utterances