世界を動かす技術を、日本語で。

Appleはウェブコンテンツに「Liquid Glass」効果を追加するためのプライベートCSSプロパティを持っています

概要

  • WebKitのGitHubリポジトリの changelog を追うという夏の趣味
  • WKWebView におけるService Workerや新機能への興味
  • Liquid Glass などiOS 26の新UI要素とwebviewとの関連性
  • Apple独自のCSSプロパティ -apple-visual-effect の発見と制限
  • シームレスなwebview統合がアプリ体験を左右するという考察

WebKitのchangelogを追う理由

  • WebKitの changelog を定期的に確認する習慣
  • モバイルアプリ内の webview 開発に従事
  • iOSの次期バージョンの新機能を事前に把握する目的
  • WWDCでの Service Worker サポート発表待望
  • 現状は自力で調査・情報収集が必須

Liquid GlassとWebviewの接点

  • WWDC 2025で話題となった Liquid Glass UI
  • iOS 7以来の大きなUI変革
  • ネイティブUI中心の話題だが、 webview にも影響
  • WebKitのプルリクエストで -apple-visual-effect CSSプロパティを発見
  • iOS 26では -apple-system-glass-material でLiquid Glass利用可能
  • 旧バージョンでも -apple-system-blur-material-thin 等の標準マテリアル利用可

実際の利用と制限事項

  • Safariや通常のWebでは -apple-visual-effect は動作しない
  • WKWebViewでもデフォルトでは利用不可
  • WKPreferencesuseSystemAppearance を有効化する必要
  • この設定は プライベートAPI であり、App Store審査に非対応
  • 開発者による非公式手法で動作確認は可能
    • CSS例:
      .toolbar {
        border-radius: 50%;
        -apple-visual-effect: -apple-system-glass-material;
        height: 75px;
        width: 450px;
      }
      
  • @supports でLiquid Glass対応/非対応の分岐も容易

アプリ内Webviewの評価と考察

  • 一般開発者が -apple-visual-effect を利用できない現状
  • しかしAppleがこの機能を開発した以上、社内で何らかの用途があると推察
  • シームレスなwebview統合 がアプリ体験を向上させる要因
  • 違和感のないwebviewはユーザーに気付かれない
  • 実は日常的にiOS内でwebviewを利用している可能性

まとめと今後の展望

  • Webviewの進化により ネイティブとWebの境界 が曖昧化
  • Apple独自機能の一般開放に期待
  • 今後も changelog を追うことで最新動向を把握
  • シームレスなUI体験の実現がwebviewの評価を左右

Hackerたちの意見

アップルがこの機能を開発したのは、使っていないわけがないからだよね。どこで使ってるかは全然わからないけど、どこかで使ってるはず。私たちがその場所に気づいていないってことは、日常的にiOSを使っている中で、ウェブビューと関わっているってことだと思う。これが私にとってのポイントだった。ウェブビューを疑ったことはなかったし、今思い浮かぶ場所もないな。

Apple.comで使うんじゃないかな。以前のiOSでフロストガラスをシミュレートするためにバックドロップフィルターを使ってたのと同じように。

設定の中、特にアカウント/iCloudのセクションがウェブビューだと疑ってることが多いよ。ページが開いた後にアイコンがちょっと遅れて表示されるからね。

App Storeアプリは、ウェブビューをかなり使ってるみたいだね。

Mailとカレンダーも、まずはウェブビューを使ってるよ。

Apple StoreアプリやApp Storeの一部には、ウェブビューを取り入れてるアプリがたくさんあると思う。これがそのためだろうね。多分、ニュースや音楽、ゲームアプリの一部もそうだと思う。

Apple Musicはかなりウェブビューを使ってるんじゃないかな。

OSの機能をファーストパーティのプログラムだけに提供するのは、明らかに反競争的な行為だよね。携帯電話や携帯電話のOSという市場での特権的な立場を利用して、競合他社からは隠しているスマートフォンアプリの市場で優位に立つのは、教科書通りのケースだよ。

Appleに対して怒りたかったけど、正直言って無理だわ。WinAPIのドキュメントを読んで、例えば「予約済み」パラメータを数えてみてよ。OS開発者は、内部使用のために機能を作ることがよくあるんだ。確かに、これは単なるUIの調整だから、プライベートにする必要があるかは疑問だけど、ずっとそれを維持したくないだけなんだろうね。

UIのテキストを読みにくくするのが利点だと思うならね。

待って、非標準のCSS属性は全部「反競争的」なの?これはちょっと大げさじゃない?Googleの「-webkit-tap-highlight-color」も反競争的なの?現在のプロプライエタリCSS属性を出荷する慣行を禁止すべき?それを標準化の提案をしながらやってるのは本当に読みにくいクレームだと思う。

コンピュータハードウェアがもっと制限されていることについてどう思う?例えば、ゲーム機はすべてのコードが暗号的に署名されている必要があって、サードパーティはコンソールメーカーの承認なしにソフトウェアを公開できないんだよね。

企業が越えてはいけないラインがあると思う。アプリを企業のものに見せるために、ロックダウンされた外観設定を使うこと。例えば、電話の端にある光るライトが、ストックアプリや企業アプリだけで点灯して、セキュリティのためにそのアプリが企業のものであることを示すような場合、それは許容範囲だと思う。デザインや外観は機能とは考えないな。YMD。

確かに、これはウェブ技術で実装されたひどい設定パネルのイノベーションを殺してるね。

他のChromeスレッドを見てると、AppleがiOSのブラウザで独占を維持する必要があるってことがわかるよね。そうだよね?そうだよね?! :P

このコメント、Apple信者を引き出してる感じがして最高だわ。みんな本当にAppleを「いいやつ」だと思ってるの?テック業界にはもういいやつなんていないよ。

競争を妨げるのが悪いのか、統一基準が良いのか、どっちもどっちだね。M3/M4のMac見てみ?あれはすごいマシンだよ、ハードウェアも統一されてるから。

法的に「明らかに反競争的」とは言えない気がする。アメリカでは、反競争的行為に関する法律はシャーマン法とクレイトン法だよ。反競争的とされるには、裁判所は「パーセイルール」と「合理的ルール」を使うんだ。「パーセイ」ルールは、法律で具体的に反競争的とされているもの(例えば価格固定)をカバーしてる。これはそのリストには入ってないから、「合理的ルール」でカバーされる必要がある。実際に競争に対する害を示さなきゃいけないし、その害が違法な行為から直接流れ出ていて、何かの競争促進的な利益で補償されていないこと、そして制約の少ない代替手段がないことを示さなきゃならない。CSSプロパティが競争に対する実際の害の基準を満たすとは思えないな、特に自分でリキッドグラスCSSを作るのを誰も止めてないしね(私が見る限りでは)。

このリキッドゼリーがトレンドにならないことを祈ろう。

同じ気持ちだよ。そうならないことを願ってるけど、たぶんそうなると思う。アップルがやってるから、他の企業も同じ流れに乗るだろうね。

若い世代はAero/Glassやその時代の美学に夢中だね。これがトレンドになるのは確実だと思う。そうじゃなくても、Appleがやったからっていう理由で、業界は「Appleがやることを真似する」以外の革新を失っちゃったし。

もうあるよ

リキッドグラスが好きでも嫌いでも、"UIのクロームはアプリコンテンツのラッパー"から"UIはアプリコンテンツの上に重ねられる"というパラダイムシフトは未来を感じる。ARともよく合ってるし、異なる画面サイズのためにUIレイアウトとコンテンツをより分けている。最初の実装については中立的だけど(良いところもあれば悪いところもある)、このアプローチはほとんどみんなに受け入れられると思う。君にとって良いニュースは、オーバーレイUIモデルが必ずしも透明である必要はないってこと。多分不透明だけど浮いてるものもあるだろうね。

もっとバウンドしたり揺れたりしないようにしてほしいな。全体がガラスっぽく見えるのが、ゼリーの塊みたいに見えちゃう。

WKPreferencesの中にuseSystemAppearanceっていう設定を切り替えなきゃいけないんだけど、これはプライベートなんだ。だから、これを使うとApp Storeの承認とはお別れだよ。これって本当?iOS開発についてはあまり詳しくないけど、さまざまな内部APIを使ってアニメーションホームスクリーンウィジェットを提供しているアプリの逆コンパイルを見た記憶があるんだ。

それはApp Storeの審査プロセスを通過しないだろうね。

youtube.com/watch?v=NdJ_y1c_j_Iのことを考えてる?

「アラステアのアプリ内ウェブビューの大理論」が好きだな。アプリ内のウェブビューが悪い評判を持っている主な理由は、シームレスに統合されているウェブビューには気づかないからだと思う。

その中には、目立たないけどなんか違和感があるウェブビューについての補足もあるよね。例えば、MacOSの設定アプリがそれを使ってるかもしれないって誰か言ってたけど、アイコンの読み込みが遅すぎるかららしい。ちょっとだけ残念に思っちゃうな。Appleは昔はすごく洗練されてたのに。初代Macの丸い画面の角を作った時の考え方を考えると、ほんとにクレイジーで、尊敬するよ。

「全てのウィッグは偽物に見える。偽物じゃないって分かるウィッグを見たことがない。」

たぶん、次の二つのグループに分かれると思う。- ウェブビューの道を進んで、うまくやるのがどれだけ難しいか知ってる人たち - 自分のウェブアプリをネイティブアプリに簡単にパッケージできるって言われた人たち どっちのグループに人が多いか、想像つくよね。

たぶん、これが追加された理由はまさにそれだね。誰かがサードパーティのUIツールキットを使っているかどうかを安く見分ける方法は、システムテーマをいじって、アプリがスケーリングや色の変更に正しく従うかを見ることだよ。この場合、Appleが提供するアプリの一部がテーマに従っていなかったから、プライベートCSSプロパティを追加して修正したんだ。他のOSベンダーは、テーマコントロールをほとんど削除して、半端な放置されたツールキットの山を修正しなくて済むようにしたんだろうね。

シームレスに統合されたウェブビューを一つでも挙げられたら譲歩するよ。一般の人は気づかないかもしれないけど、ここでたくさんの記事が出てるはずだよ。ウェブビューの議論では「Fooはウェブビューとして実装されてるから、できるはずだ」っていうのが標準的な反論になるだろうし。

いい発見だね!Appleの新しいガラスUIは結構批判されてるけど、実は…ちょっと好きかも?OSにまた個性が戻ってきた感じがする。平坦でつまらないだけじゃなくなったし、クリックターゲットのサイズも視覚的にわかるようになった。ボタンもテキストとちゃんと区別できるようになったし、これは歓迎すべき変化だと思う。「ノスタルジー」だけじゃなくて、実際に役立つしね。iOS 26 Betaをインストールして、自分が管理してるウェブサイトでいくつかテストしてみたけど、いくつか問題はあるものの、OSにもっと個性を戻す方向性はいいと思う。一般の人たちも気に入るはず。

ガラスの効果や美しさは好きだけど、アプリの機能性は前より良くない気がする。簡単にアクセスできたボタンがメニューに隠れてしまって、見つけにくくなってる。

クリックターゲットのサイズも視覚的にわかるようになった。ボタンもテキストとちゃんと区別できるようになった 期待値が高いね

私は「この見た目はひどい!」派に入るよ。「Apple、何考えてるの?!」って感じ。ほんと最悪。

自分の予想では、一般の人たちはこれをあまり好まないと思う。主に、オペレーティングシステムに「個性」が必要だと思っているのは技術者だけだから。普通の人はそんな風に考えないし、ほとんどの人はこれらのシステムを目的達成の手段として見てる。だから、それに役立たないものは、せいぜい最初の数日間だけの面白い気晴らしに過ぎない。液体ガラスで一番嫌なのは、すべての公式アプリに挿入された新しいボトムタブバーだ。Apple Musicが一番ひどい。検索インターフェースと残りの4つのタブ(ホーム、新着、ラジオ、ライブラリ)の間を「移動」するのに、追加のクリックが必要になった。検索をクリックしたら、キーボードを出すためにもう一度検索ボックスをクリックしなきゃいけない。これらの操作は、非常に洗練された遅いアニメーションがついていて、例えばホームにいる時にライブラリをクリックすると、タブバーを超えてバブルがスライドして、途中のタブや下のコンテンツを映し出すような、非常に気が散るだけの目的のないものになってる。最新のリリースでは、透明度を下げるや動きを減らす設定はこれらのアニメーションには全く影響しない。実際、多くのAppleの公式アプリは、透明度を下げるや動きを減らす設定がアクセシビリティオプションとして存在することをすっかり忘れているか、せいぜいその実装を中途半端にしている。例えば、動きを減らす設定を有効にすると、Apple Musicでアルバムをクリックした時にもっと控えめなアニメーションが出る(良いね)。戻るボタンをクリックすると、その同じ控えめなアニメーションが使われる(良いね)。でも、左からスワイプして戻ると、動きを減らす設定をオフにした時の華やかで無駄なアニメーションが出てくる。Apple Podcastsも同じ問題がある。iMessageは、自分が見た限りでは、動きを減らす設定を完全に無視していて、何も変わらないし、透明度を下げる設定も他のアプリのように透明度を和らげるのではなく、透明度があったアイテムの上に#000000の黒背景を重ねている。iOS全体に何十もの例があって、リリースまであと数日なのに、Apple NotesやApple Newsのハンバーガーメニューのようなドロップダウンは、動きを減らす設定の下でアニメーションが少なくなるべきなのに、そうなってない。キーボードでボタンが無効になる時(例えば、Apple News -> 検索 -> 空の検索ボックス)には、エンターキーが間違った、ほとんど読めない色でグレーアウトされるのは、透明度を下げる設定が有効な時だけだ。まだまだ続くよ。

Appleがこの機能を開発したのは、使っていないわけがないからだよね。どこで?全然わからないけど、どこかで使ってるはず。なんでどこかで使ってる必要があるの?一般的なソフトウェアには死にかけのコードや機能がたくさんあるからさ。これを通じて方向転換を5回くらいしてるかもしれないし、CSSプロパティは2回目に登場して4回目には使われなくなったりしてる…

Appleがこの機能を開発したのは、使っていないわけがないからだよね。どこで?全然わからないけど、推測するなら、設定アプリのiCloud設定の中かな。あとはApp StoreやMusic、TVのアカウントページ(アプリの右上のアバターをタップすると出てくるやつ)。そのページの中には、ネイティブのように見せかけたウェブビューが結構隠れていて、主にiTunesのバックエンドサービスから読み込んでる。リンクを長押しするとウェブページのプレビューが出るのがその証拠だね。Tipsアプリの中のユーザーガイドでも使われてるかも。少なくとも、そこを見てみるつもり。

もしかしたら、まだ誰にも使ってほしくないのかも?最新のOSリリースで、たくさんの人がすぐに使いたがるのはわかってるだろうし、まずは内部での公開利用を調整したいのかも?このスレッドでも根拠のない疑惑がいくつか出てるし、もしかしたら彼らが正しいのかも?間違ってるのかも?

USDとタグでやろうとしていることもひどいね。