For the complete documentation index, see llms.txt. Markdown versions of documentation pages are available by appending .md to the page URL.
メインナビゲーション
Theme
Codex

Codex use case

Liquid Glass の導入

Codex を使い、iOS 26 の API と Xcode 26 で既存の SwiftUI アプリを Liquid Glass に移行します。

Difficulty Advanced
Time horizon 1h

Codex と Build iOS Apps プラグインを使って、既存の iPhone・iPad 向け UI を点検し、独自に重ねたぼかしやマテリアルをネイティブの Liquid Glass に置き換えます。iOS 26 の API が使えるかどうかをコードで判定し、シミュレータで動作を検証しながら安全に移行を進めます。

Best for

  • 大まかなデザイン方針だけでは足りず、iOS 26 の Liquid Glass への具体的な移行計画が必要な既存の SwiftUI アプリ
  • 独自のカード、シート、タブバー、ツールバー、アクションボタンの点検と、その結果に基づく段階的な移行を Codex に任せたいチーム
  • 旧バージョンの iOS もサポートしており、外観を一律に変更せず、`#available(iOS 26, *)` で従来の表示も維持する必要があるアプリ

Contents

    ← All use cases

    Liquid Glass の導入

    Codex を使い、iOS 26 の API と Xcode 26 で既存の SwiftUI アプリを Liquid Glass に移行します。

    Codex と Build iOS Apps プラグインを使って、既存の iPhone・iPad 向け UI を点検し、独自に重ねたぼかしやマテリアルをネイティブの Liquid Glass に置き換えます。iOS 26 の API が使えるかどうかをコードで判定し、シミュレータで動作を検証しながら安全に移行を進めます。

    Advanced
    1h

    Codex と Build iOS Apps プラグインを使って、既存の iPhone・iPad 向け UI を点検し、独自に重ねたぼかしやマテリアルをネイティブの Liquid Glass に置き換えます。iOS 26 の API が使えるかどうかをコードで判定し、シミュレータで動作を検証しながら安全に移行を進めます。

    Advanced
    1h

    Best for

    • 大まかなデザイン方針だけでは足りず、iOS 26 の Liquid Glass への具体的な移行計画が必要な既存の SwiftUI アプリ
    • 独自のカード、シート、タブバー、ツールバー、アクションボタンの点検と、その結果に基づく段階的な移行を Codex に任せたいチーム
    • 旧バージョンの iOS もサポートしており、外観を一律に変更せず、`#available(iOS 26, *)` で従来の表示も維持する必要があるアプリ

    Skills & Plugins

    • SwiftUI Liquid Glass、SwiftUI の UI パターン、シミュレータでのデバッグに対応するスキルを使って、iOS の画面を刷新します。ネイティブのガラスエフェクトを取り入れ、iOS 26 シミュレータで仕上がりを確認します。
    Skill Why use it
    Build iOS Apps SwiftUI Liquid Glass、SwiftUI の UI パターン、シミュレータでのデバッグに対応するスキルを使って、iOS の画面を刷新します。ネイティブのガラスエフェクトを取り入れ、iOS 26 シミュレータで仕上がりを確認します。

    Starter prompt

    Build iOS Apps プラグインと、その SwiftUI Liquid Glass スキルを使って、このアプリで利用頻度の高い操作フローを 1 つ選び、Liquid Glass に移行してください。 制約 - iOS 26 と Xcode 26 への移行として進めてください。`#available(iOS 26, *)` で分岐し、旧バージョンの iOS ではガラスエフェクトを使わない表示を維持してください。 - まず操作フローを点検してください。独自の背景、重ねたぼかし、チップ、ボタン、シート、ツールバーのうち、ネイティブの Liquid Glass に置き換える箇所を挙げてください。エフェクトを加えず、コンテンツをそのまま表示する箇所も明示してください。 - 独自のぼかしよりも、システム標準のコントロールや `glassEffect`、`GlassEffectContainer`、`glassEffectID`、`.buttonStyle(.glass)`、`.buttonStyle(.glassProminent)` などのネイティブ API を優先してください。`glassEffectID` と `@Namespace` の併用は、要素の形状が滑らかに変化することで操作の流れがわかりやすくなる場合に限ってください。 - `glassEffect` はレイアウトや外観を調整するモディファイアの後に適用し、形状に一貫性を持たせてください。`.interactive()` は実際にタッチに反応するコントロールにのみ使用してください。 - XcodeBuildMCP でアプリをビルドし、iOS 26 シミュレータで実行して、移行した操作フローのスクリーンショットを撮影してください。使用したスキームとシミュレータ、実施した確認項目を具体的に記載してください。 成果物 - 対象の操作フローに絞った簡潔な移行計画 - 対象範囲に Liquid Glass を実装したコード - iOS 26 より前のバージョンを搭載した端末でのフォールバック動作 - シミュレータで実施した検証の手順と、検証に使用したスクリーンショット
    Build iOS Apps プラグインと、その SwiftUI Liquid Glass スキルを使って、このアプリで利用頻度の高い操作フローを 1 つ選び、Liquid Glass に移行してください。 制約 - iOS 26 と Xcode 26 への移行として進めてください。`#available(iOS 26, *)` で分岐し、旧バージョンの iOS ではガラスエフェクトを使わない表示を維持してください。 - まず操作フローを点検してください。独自の背景、重ねたぼかし、チップ、ボタン、シート、ツールバーのうち、ネイティブの Liquid Glass に置き換える箇所を挙げてください。エフェクトを加えず、コンテンツをそのまま表示する箇所も明示してください。 - 独自のぼかしよりも、システム標準のコントロールや `glassEffect`、`GlassEffectContainer`、`glassEffectID`、`.buttonStyle(.glass)`、`.buttonStyle(.glassProminent)` などのネイティブ API を優先してください。`glassEffectID` と `@Namespace` の併用は、要素の形状が滑らかに変化することで操作の流れがわかりやすくなる場合に限ってください。 - `glassEffect` はレイアウトや外観を調整するモディファイアの後に適用し、形状に一貫性を持たせてください。`.interactive()` は実際にタッチに反応するコントロールにのみ使用してください。 - XcodeBuildMCP でアプリをビルドし、iOS 26 シミュレータで実行して、移行した操作フローのスクリーンショットを撮影してください。使用したスキームとシミュレータ、実施した確認項目を具体的に記載してください。 成果物 - 対象の操作フローに絞った簡潔な移行計画 - 対象範囲に Liquid Glass を実装したコード - iOS 26 より前のバージョンを搭載した端末でのフォールバック動作 - シミュレータで実施した検証の手順と、検証に使用したスクリーンショット

    iOS 26 への移行と標準 UI の確認

    Liquid Glass の導入では、まず iOS 26 と Xcode 26 への移行に取り組みます。iOS 26 SDK でアプリをビルドし直し、SwiftUI の標準コントロールにどのような変更が自動で反映されるかを確認します。そのうえで、まだ平板に見える、重たい印象がある、あるいはシステム標準の UI になじまないカスタム要素の再設計を Codex に依頼します。

    以前のバージョンの iOS も引き続きサポートする場合は、その条件を最初に明示してください。Build iOS Apps プラグインの SwiftUI Liquid Glass スキルを使う際は、#available(iOS 26, *) でバージョンを確認し、iOS 26 以降でのみガラス効果専用の新しい API を使うよう指示します。古いデバイスでも見やすい代替表示を維持します。

    iOS プラグインの活用

    SwiftUI の UI 変更からシミュレータでの検証までを Codex に依頼するには、Build iOS Apps プラグインを使います。Liquid Glass への移行では、まず 1 つの操作フローを点検し、その中のいくつかの UI 要素を移行するよう Codex に依頼します。対象を広げる前に、移行後のアプリを iOS 26 シミュレータで起動し、スクリーンショットを撮影してもらいます。

    このプラグインに含まれる SwiftUI Liquid Glass スキルの基本方針は、プロンプトにも盛り込むとよいでしょう。

    • 独自のぼかしビューよりも、標準の glassEffect、GlassEffectContainer、ガラスのボタンスタイル、glassEffectID を使ったトランジションを優先します。
    • レイアウトや見た目を調整するモディファイアの後に .glassEffect(...) を適用し、意図した最終形状に沿ってマテリアルが描画されるようにします。
    • 複数のガラス要素を同時に表示する場合は、関連する要素を GlassEffectContainer でまとめます。
    • .interactive() は、実際にタッチ操作に反応するボタン、チップ、コントロールにのみ使います。
    • 要素ごとに異なるガラス表現を使わず、機能全体で角の形状、色の付け方、間隔を統一します。
    • iOS 26 より前のバージョン向けには、ガラス効果を使わない代替表示を残します。

    プラグインやスキルのインストール方法については、プラグインとスキルのドキュメントを参照してください。

    WWDC の参考セッション

    本番アプリの操作フローのリファクタリングを Codex に依頼する前に、次の WWDC25 セッションを参照してください。

    移行計画の依頼と範囲を絞った実装

    Liquid Glass への移行は、「どこにガラス効果を使うか」の検討と「今すぐすべてのコードを書く」作業を分けて Codex に依頼すると進めやすくなります。まず簡単な点検を依頼し、次に、それだけで完結する範囲を 1 つ選んで、実装からシミュレータでの検証までをエージェントに任せます。

    実践のヒント

    ガラス効果を使う箇所の見極め

    Liquid Glass の役割は、コンテンツの上に操作用のレイヤーを設け、両者を見分けやすくすることです。すべてのカードを光るパネルにする必要はありません。システム標準のマテリアルと調和しない背景装飾は取り除き、読みやすさを優先する箇所ではコンテンツをシンプルに表示するよう Codex に依頼します。色を付けるのは、意味の違いを際立たせる箇所や主要なアクションに限るよう伝えます。

    利用頻度の高いフローからの移行

    通常は、アプリ全体を一度に移行するよりも、タブのルート画面、詳細画面、シート、検索画面、オンボーディングフローなどから 1 つを選んで着手する方が適しています。レビューしやすくなり、Liquid Glass の設計のうち、どの部分を再利用可能なコンポーネントのパターンとして採用すべきかも判断しやすくなります。

    フォールバックの動作確認

    デプロイメントターゲットが iOS 26 より前のバージョンの場合は、Liquid Glass を使う実装とフォールバックの実装を並べて示すよう Codex に依頼してください。両方をレビューすれば、古い iOS で使えない API を誤って呼び出す箇所を見つけられ、最新のシミュレータでしか動作しない状態でのリリースを防げます。

    Tech stack

    Need

    Liquid Glass の UI API

    Default options

    SwiftUI の glassEffect、GlassEffectContainer、ガラスエフェクトのボタンスタイル

    Why it's needed

    このスキルでは、これらのネイティブ API を優先します。Codex はマテリアルの仕組みを独自に再現することなく、既存のぼかしレイヤーを取り除けます。

    Need

    移行の前提となる開発環境

    Default options

    iOS 26 と Xcode 26

    Why it's needed

    Liquid Glass は iOS 26 SDK から利用できます。Codex には Xcode 26 でコンパイルし、旧バージョンの OS 向けにフォールバックを明示的に実装するよう指示します。

    Need

    シミュレータでの検証

    Default options

    XcodeBuildMCP

    Why it's needed

    UI の外観を変更するときは、ビルドと起動、スクリーンショットの撮影、ログの確認が重要です。特に、画面の状態や端末のサイズを変えて表示を確認するときに役立ちます。

    Need Default options Why it's needed
    Liquid Glass の UI API SwiftUI の glassEffect 、 GlassEffectContainer 、ガラスエフェクトのボタンスタイル このスキルでは、これらのネイティブ API を優先します。Codex はマテリアルの仕組みを独自に再現することなく、既存のぼかしレイヤーを取り除けます。
    移行の前提となる開発環境 iOS 26 と Xcode 26 Liquid Glass は iOS 26 SDK から利用できます。Codex には Xcode 26 でコンパイルし、旧バージョンの OS 向けにフォールバックを明示的に実装するよう指示します。
    シミュレータでの検証 XcodeBuildMCP UI の外観を変更するときは、ビルドと起動、スクリーンショットの撮影、ログの確認が重要です。特に、画面の状態や端末のサイズを変えて表示を確認するときに役立ちます。

    Related use cases