WWDC2025でiOS26が発表され、OS全体のデザインが Liquid Glass という新たなコンセプトで刷新されることが明らかになりました。
オッと思ったのが、Safari のUIが紹介された時。以下が新しいSafariです。ステータスバーはほぼ透過して主張が弱くなり、画面最下部には表示中サイトのドメインが表示されています。
(Apple公式iOS26のページから)
広々としてますね。Apple は Liquid Glass というデザインを「コンテンツに一段と集中できるように」することを目的として開発したようでした。
コンテンツに没入できるブラウザUIが抱えるジレンマ
開発中のブラウザアプリでは「コンテンツへの集中」を重視しています。過去にも幾つか投稿しました。
ブラウザUIは極力排除し、フルスクリーンでコンテンツが見れるべきであると。
それはまぁそうなのですが、実はUIを無くすと「他のサイトに移動できないよね？」「戻ったり進んだりは？」など、ブラウザが備えるべきUIをどうするか問題にぶち当たることになります。
戻るなどの操作はジェスチャーで回避できますが、全部が全部ジェスチャーというわけにはいきません。ブラウジングの基本操作とかぶってしまう可能性を考えれば、ジェスチャーの操作もそれほど多用できるものではないのです。
(と言いつつ多数のジェスチャーを定義できるようになってはいるのですがw)
ブラウザ開発でコンテンツを重視しようとすると、「便利にする→UIがいる→コンテンツを阻害する」というループというかジレンマは不可避ですね。ブラウザアプリの宿命なのかも…と、作っては壊しを繰り返して行き着いた先で、開発中のブラウザでは一つの解を見出していました。
それが以下の画面。
(画面最下部にツールバー。iPhoneミラーツールのBezelでキャプチャ)
iOS26のSafariと少し似てませんか？😁
元より既存のタブ型UIでは限界があると感じていました。なので、フローティング＆ブラーで存在感を無くしつつ、ブラウジング中には極力表示されず、それでいて使いたい時には表示されるようなブラウザUI実装に舵を切っていたんですね。
これがいみじくも、今回発表された新しい Safari に似ていなくもない形だっだと…。Appleはもう何年も前から Liquid Glass のデザインに着地していた筈ですが、Apple と近しいことを考えていたのかも知れないと思うと普通に嬉しいですよね😊
で、このUI、ちゃんと動きます。現状こんな感じ。
(ブラー効果の程度も設定できる。存在感は極少に。積極的に消えてくれて、使いたい時にまた現れる)
発案は昨年。実装を始めたのが年始頃。形になって TestFlight で先月から配信して、意外に使い易いかもねー良いですねー、なんて話をしていたのでした。ユーザは現在4人だけなのですけどね😅 (サーバ担当の@t0shiya、iOSアプリは@hitonomichiさん, ロゴ関係でメタ・グラマーの@kasydmkさん、そしてPdMである僕の4人)
メンバー全員が、今回の WWDC2025 動画を見て思わず笑ってしまったのでした。
そんな新しいブラウザUIを僕らは バーデッキ と呼んです。
バーデッキのご紹介
バー(Bar)が並ぶところ、という意味でバーデッキ(BarDeck)です。
現Safariを含め多くのブラウザアプリで邪魔に感じてたのは、ツールバーだけではありません。ステータスバーもアドレスバーも同様。コンテンツをめいいっぱい楽しもうとすると不要に思える「バー」が多いのです。必要なものではあるけど画面に居座って欲しくないのですよね。
(以前の投稿で言及した、ブラウザUIの画面占有率の考察画像。画面全体の20%を占めている)
それらのバーを一箇所に集約し、必要なタイミングで切り替えられるようにしてみたというわけです。こんな感じで動きます。
(見易さのためにDark系ブラーに変更した(これも設定から変更できる)。左右スワイプでバーを切り替える)
常にツールボタンが見えて欲しいわけじゃないし、時間やバッテリーのステータスもいつも見えてなくて別に良い。URLだってそうです。なので、手元でスッスッと左右スワイプして、見たいもの使いたいものを切り替えられたら便利かなと。表示領域を共有するので画面も無駄に占有しなくなります。
実際にUI検証した評価は、画面占有率を最小化しつつ必要十分なブラウザUIも提供するという二律背反な要件を両立させるちょうど良い着地点かなぁ…という感じ。なので、これを基本路線としました。
面白いのは、このバーデッキというUIをブラウザUI(バー)の入れ物だと捉えると、色んなアイディアが湧いてきたこと。元はと言えばタブがフローティングになっただけですのにね。
- 「ツールバーを何個も並べれても良いのでは？」
- 「ならばツールバーに色んな便利ボタンがあっても良いのでは？」
- 「ステータスバー・ツールバー・アドレスバー以外のバーも考えられるのでは？」
などなど。そうして生まれたのはこんな設定画面です。
(ツールバーが2つあっても良い。ツールバーが複数置けるなら色んなブラウズ支援ボタンがあっても良い)
実際に動き出すと、発想がさらに広がるもんですね。発散するとも言いますが。
まぁこんな感じで、作っては壊し、ハマれば、そこに新たなアイディアが生まれてまたやることが増えていく…を繰り返すのでいつまで経っても完成しないというわけです(笑)
iOS26 の Liquid Glass というデザインとそれに伴う基本UIの刷新をうけ、ご紹介したこのUIもまた調整余地が生まれる可能性もあります。本アプリが iOS26 以前にリリースされる筈もありませんし。やはり永遠のベータなのかも知れません😅
ということで、今回は開発中ブラウザアプリの個性的なUIバーデッキについてのご紹介でした。まだまだ気になることもありながら常用できるかも？🤔な状態になってきた気もしてまして、TestFlight の配信範囲を徐々に広げていけると良いなーなんてこともボチボチ考えています。