食べログにおけるLiquid Glass対応事例

Transcript

1. ⼤規模なUIKitアプリと新しいSwiftUIアプリ、それぞれの互換モード脱却 ⾷べログにおける Liquid Glass対応事例 株式会社カカクコム ⾷べログカンパニー 開発本部 技術部 アプリ基盤チーム ⼤澤 由憲 2026年6⽉17⽇(⽔)
2. ⾃⼰紹介 ⼤澤 由憲 X: @osawa-yoshi 株式会社カカクコム ⾷べログ iOSアプリ基盤開発担当 [経歴] ヤフー株式会社（現 LINEヤフー株式会社）、暗号資産系ベンチャーを経 て現職 ⼤規模決済アプリの⽴ち上げ、iOSリードを経験 現在は⾷べログのiOSアプリの基盤開発を牽引 [プライベート] 1歳と3歳の⼦供の育児に奮闘中
3. 互換モードの猶予期間 約1年 なぜ今、互換モードを外すのか 2025年9⽉：iOS 26 / Xcode 26 正式リリース 暫定回避策「UIDesignRequiresCompatibility」の導⼊ 約1年だけの特例措置 永続的な解決策ではなく、あくまで期限付きの猶予 2026年4⽉：App Store要件の変更 Xcode 26必須化に伴い、実質的なタイムリミットが到来 結論：今すぐ外す対応が必要 技術負債を溜めず、速やかな移⾏を完了させる必要がある
4. Liquid Glassの理想と既存アプリの現実 Liquid Glass：浮かぶ操作レイヤー 標準コンポーネントは⾃動で新OSに適応され る 既存アプリでは独⾃UIの崩れや、新旧OSをま たいだ確認負荷が壁に 完璧を⽬指さず、まずは破綻しない状態を作る https://developer.apple.com/jp/design/new-design-gallery-2026/ 操作要素をコンテンツ上に軽く浮かせ、画⾯の 奥⾏きと主役感を両⽴できる
5. 今回の対応⽅針 スコープの限定 全⾯刷新はせず、標準の変 化を受け⼊れる。崩れる箇 所を優先。 OS差分の許容 iOS 18以下と26で極端な差 が出ない落とし所を探る。 影響範囲の絞り込み ユーザー接触の多い箇所を 優先。確認範囲を絞って進 める。
6. ⾷べログアプリの対応 歴史ある⼤規模UIKitアプリの現実と⾒極め
7. ⾷べログアプリ（国内版）について UIKitベースの⼤規模アプリ ⻑年運⽤してきたUIKitベースの巨⼤なコード ベース 独⾃UIが多く、完全なLiquid Glass化は現実的 ではない 変える箇所∕従来デザインに寄せる箇所を⾒極 めて対応 新しいユーザビリティを早く届けるため、ベー タバージョンの段階から準備し、2025年12⽉ に互換モードを外してリリース
8. 事例1：FAB（フローティングアクションボタン） Liquid Glassの恩恵を活かす 「FAB」は新デザインとの親和性が極めて⾼い 低コストで「新しさ」を出しやすい箇所 既存体験を維持しつつ視覚的な効果を最⼤化 floatingActionButton.configurationUpdateHandler = { button in var configuration: UIButton.Configuration if #available(iOS 26.0, *) { configuration = .glass() } else { configuration = .plain() configuration.background.backgroundColor = .white configuration.cornerStyle = .capsule } button.configuration = configuration }
9. 事例2：ナビゲーションバー上のボタン あえて「変えすぎない」判断 既存デザインとの整合性を最優先 全画⾯に及ぶデザイン確認の負荷を回避 デザイナーと協議し、ナビゲーションバーの技術的 制約を考慮し、従来のUIによる⼀貫性を優先し調整 class NoLiquidGlassBarButtonItem: UIBarButtonItem { @available(iOS 26.0, *) override var hidesSharedBackground: Bool { get { true } set {} } }
10. 事例3：タブバーの独⾃バッジ View構造の変化による不具合 標準タブバーに独⾃Viewでバッジを表⽰する実 装で問題が発⽣ OSによるView構造の変化で、バッジViewの 挿⼊に失敗 現状の構造を解析し、挿⼊ロジックを再構成 して復旧 教訓： デザインを正としつつも、⾮標準API 利⽤によるOS変更時のリスクを常に認識
11. ⾷べログ多⾔語版アプリの対応 SwiftUIベースの新基盤アプリにおける実践
12. ⾷べログ多⾔語版アプリについて SwiftUIベースの新しいアプリ 訪⽇旅⾏者向けの⾷べログ多⾔語版アプリ 昨年秋にリリース（※⽇本のApp Storeでは⾮ 公開） ⽐較的新しいSwiftUIベースのアプリであって も、Liquid Glass対応に向けた調整は必要 2026年5⽉に互換モードを外してリリース
13. 事例4：シートの背景⾊と透過 「透過」が意図しない差分を⽣む これまでは未指定でも⽩背景として表⽰されて いた iOS 26では背景が透過し、下のコンテンツが露 出 ViewModifierを作成して⼀律付与することで対応 修正前: sheetの背景⾊が透過 修正後: sheetの背景⾊を設定 「意図した⽩」かの再確認と、⾊の再定義を実施
14. 事例5：タブバーとSafe Area フルスクリーン表⽰の再適合 地図(ignoresSafeArea)と重なる独⾃Viewの調 整 iOS 26でのタブバー余⽩定義の変化に対応 標準の変化に合わせ、Safe Areaとの付き合い ⽅を泥臭く再計算。単純な定数変更では済まな い、細かな座標調整を要した
15. まとめ：互換モードを外すために 1. 猶予期間を意識する 互換モードは約1年間の特例措置。期限が迫 る前に破綻箇所を潰す戦略が重要。 2. スコープを絞る 全⾯刷新ではなく「破綻しない最⼩対応」 を。標準の変化を受け⼊れ、効果的な対応を 実施する
16. ご清聴ありがとうございました フィードバックやご質問をお待ちしています
17. Appendix：⾷べログアプリの実例集 Xcode 26 / iOS 26 対応の技術的詳細 テックブログにて具体的な実装事例を公開中 ‧UIKit Appearance APIの統⼀による表⽰破綻の解消 ‧FABなど独⾃UIへのLiquid Glass機能の部分適⽤ ‧⾮標準API利⽤（タブバーバッジ）のView構造復旧 📖 Tech Blog 「詳細なコード解説はこちら 」 ⾷べログアプリ(国内版)での、UIKitにおけるLiquid Glass対応の実践的な技術事例をまとめています。