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

macOS アイコンの歴史

概要

AppleはmacOS 26で Liquid Glass という新しいUIデザインを発表 アイコンが より丸みを帯びたガラス風 デザインに刷新 アイコン要素が 枠外にはみ出せなくなった 仕様変更 この大規模なビジュアル刷新を記念し、 システムアイコンの進化 を記録 SNSで 随時コレクションを公開・更新 予定

macOS 26の新UI「Liquid Glass」概要

  • Apple によるmacOS 26の新UI「 Liquid Glass」発表
  • アイコンデザインが 従来のソリッド感から、柔らかく光沢のあるガラス調 に変化
  • Rounded rectangle (角丸長方形)の形状がさらに丸みを帯びる仕様
  • アイコン要素が アイコン枠外に拡張できない 新ルール
    • 例:GarageBandやPhoto Booth、Dictionaryなど従来のアイコンで見られた表現の廃止
  • macOS史上でも 最も劇的なビジュアル刷新 の一つ

システムアイコン進化の記録コレクション

  • macOSの システムアイコンの進化 を記録するコレクション企画
  • 過去から現在までのデザイン変遷 を比較・紹介
  • SNS(ソーシャルメディア)で 順次公開・アップデート 予定
  • 夏にかけて ゆっくりとコレクションを拡充 予定
  • Appleデザインの 変遷を楽しむコンテンツ として展開

今後の展望

  • 新しい Liquid Glassデザイン に関する反響・評価の収集
  • コレクションの 継続的な更新・拡張 方針
  • ユーザーやデザイナーからの意見 も取り入れる予定

Hackerたちの意見

2025年版は2025年以前のバージョンよりも見た目がいいと思うから、全体的には改善されてるね。でも、2014年のデザインの方が通常はずっと良いと思う(もっとクリアで分かりやすい)。だから、少しずつは改善されてるけど、歴史的にはまだ劣ってるかな。

ゲームセンターは、正直言って悪化した唯一の例かも。一般的に言えば、他のほとんどの例はデザインのトレンドに合わせて進化してるけど、ゲームセンターは最初のバージョン以降、意味がなくなっちゃった。文脈がないと、あの4つのバブルが何を表してるのか全然分からないよ。

そうだね、macOS/iOSの美学は2013-14年頃がピークだったと思う。ハードウェアも似たような感じで、2012年のMacBook Proは今まで買った中で一番素晴らしいハードウェアだった。あの感覚が懐かしいな。Appleが今の方が13年前よりも印象的な会社だとは思えないよ、市場価値は別として。

そうそう、ミニマリズムとスキューモーフィズムのバランスを取ろうとしてるのが好きだな。少ないもので多くを表現しようとしてることが多いよね。Photo Boothのアイコンがいい例だと思う。カメラは置いといて、フォトブースのストリップに焦点を当てよう(実際の写真は小さいサイズだとごちゃごちゃしちゃうから使わない)。このアプローチが時にはもっと詳細を加えたり、全く違うデザインにしたりすることもあれば、時には詳細が少なくなることもある。まるで、詳細のレベルやコントラスト、明るさを標準化するための正規化みたいな感じだね。

自由な形のアイコンは時々本当にデザインが悪くて、見た目がひどくなることがあるのは理解してるけど、Appleの特徴の一つは高品質なアイコンだったんだよね。それはAppleデバイスをターゲットにした他のソフトウェア会社にも伝わってた。アイコンを見ただけで、ソフトウェアがMac専用に作られたものか、ただ移植されたものかが高い確率で分かった。今はすべてが悲しい丸みを帯びた四角になっちゃったね。

今はすべてがこの悲しい丸みを帯びた四角形になっちゃったね。こういうの、クリーンなラインやシャープなエッジ、テクスチャーや深みがない「現代主義」デザインでよく見るよね。どの業界でもそう。例えば、Thumaの家具なんかは高い値段で、デザインがいいって言われるけど、全然そうじゃない。意味も場所の感覚も欠けてるし、素材の質も低くて特定の出所もないし。それから、普通のドローンのライトショーなんかも、自分たちが自由の女神の絵を描いてると思い込んでるけど(ドローンが広告をやった後にね、地元の自動車ディーラー提供の)それがいいものだとされてるのが残念。花火の鮮やかさや輝きの代わりにね。Appleもこの方向に進んでるよ。あそこにはデザイナーがいないんじゃないかな。計算機アプリを見てみて。完璧ってのは、足すものが何も残ってないときじゃなくて、引くものが何も残ってないときだって言うけど、どんどん引きすぎると、意味や目的のないものが残っちゃうんだよね。これを日常生活で見始めると、もう見えなくなることはないよ。これを読んだ人には、先に謝っとくね。この現象に敏感になっちゃうかもしれないから。

僕の仮説だけど、少なくともVisionOSでは、いくつかのアプリが3Dオブジェクトで溢れかえってるというか、ほとんど散らかってる状態で、Appleは目が「UIがどこにあるか」に簡単に飛べるようにするために、ユーザーがアクションボタン(アプリを起動するボタンも含めて、要するにこれらのアプリアイコンがそうだよね、特にモバイルOSでは)を3Dオブジェクトと視覚的に区別できる必要があると感じたんだと思う。これを実現するために、アクションボタンは常にボタンの形をしているようにして、任意のオブジェクトの形にはさせなかったんだ。UXデザインのこのパラダイムでは、ボタンのアイコンは独自の形を持つスタンドアロンのオブジェクトであってもいいけど(例えば、StickiesやGame Centerのアイコンを見てみて)、そのスタンドアロンオブジェクトは「アプリアイコン」のガラスに「包まれている」必要があるんだ(まるで何かを注げる樹脂のパックに包むみたいに)。そうすることで、このオブジェクトが機能的にはボタンであることが視覚的に明らかになるんだ。単なるランダムな3Dオブジェクトではなくてね。面白いことに、これはアクションボタンと2Dコンテンツを視覚的に区別する問題のほぼ正反対なんだ。2D UIでは、アクションボタンを周りの2Dコンテンツよりも3Dっぽく見せて、目立たせるようにしたい。だから、Windows XPやmacOS 9時代の「ゼリー」ボタンみたいに、画面に向かって膨らんで見えるようにして、コンテンツから浮き上がらせて、タッチを可能にしてた。だけど、すべてが3Dで任意の方法で浮き上がっていると、オーバーレイされたアクションは、あまり3Dでない方が目立つんだ。「HUDの上にある」っていうのが明確になるから。そういうオブジェクトは文字通り2Dでもいいし、ちょっと変わった中間のスタイルを選んでもいい。例えば、「液体ガラス」が実現するような2.5Dのペーパーカット・ジオラマ風の見た目とかね。

これについてコメントしに来た。なぜ、どこにでもある丸みを帯びた長方形にこだわるんだろう?これを企業がみんな同じようにやってる理由があるはずだよね。

この「ボタンをアイコンにする」インターフェースの利点は、マウスでクリックするエリアが予測できることだね。今のmacOSでは、アイコンが占めるエリアをクリックしないと、ターゲットを外しちゃう。各アイコンには、クリックするためのユニークなエリアがあるかもしれない。

フリーウェアの時代(App Storeの「無料」以前)では、ソフトウェアの品質はアイコンの質でだいたいわかったよね。

でも、Appleの特徴の一つは高品質なアイコンだったよね。2007年にOS Xに切り替えたとき、これがすごく好きだった。Photo BoothやPages、Previewなんかは本当に美しかったし、アイコンでアプリを区別するのも簡単だった。今はみんな似たような見た目になっちゃったし、もっと遊び心があったよね。Adiumのインスタントメッセンジャーは緑の鳥のロゴがアイコンだったし、新しいメッセージが来るとDockの鳥アイコンが羽ばたいてた(これはネイティブ通知の前だけど、AdiumはすでにGrowlに対応してたかも)。アプリを起動すると目も開いてたと思う。

2025年以降のアイコンスタイルは見分けるのが難しいと思う。コントラストが低くてぼやけてる感じがして、アイコンが自分の好みに合わないくらい muted になっちゃってる。

ただ muted なだけじゃなくて、見てると本当に視力が悪くなってる気がする。巨大で美しい高DPIのディスプレイを持ってるのに、アイコンがもうシャープに見えないんだ。まるで誰かがダウンサンプリングしてからガウシアンブラーでアップサンプリングしたみたい。昔は「Retina」解像度を誇ってた会社なのに、すごく変な選択だよね。Appleのアイコンデザインのピークは2014年頃だったと思う。高解像度で、アプリケーションが何かをはっきり示してた。それ以降は、すべてがぼんやりした抽象的なヒエログリフに向かってる感じ。

もしMicrosoftのアイコンのスタイルを真似たらどうなるんだろう?あそこのアイコンはみんな同じに見えるから。今でも、仕事のコンピュータで間違って違うOfficeのアイコンをクリックしちゃうことがあるよ、みんな似すぎてるから。

実際に使うと、アイコンは重なっていて、平らにしたときよりも視覚的に分離されてるんだ。まだ君の懸念には対処できないかもしれないけど、サイトが現在それを正確に示しているとは思わないな。

アイコンのリストをざっと見るときは、目を細めたりぼやけさせたりしてみて。これは周辺視野や部分的な視覚の近似だと思って。新しいアイコンの中には良いものもあれば、泥のようにごちゃごちゃしたものもある。ガラスのメタファーはアイコンデザインで一貫して使われてない気がするし、半透明のギアは単純におかしいよね、たとえそれが美的基準に沿っていても。

SIP前のFinderのプラグインが懐かしいな。組み込みのをオーバーライドして、リソースフォークに基づかない特別なフォルダ用のカスタムアイコンを追加してたやつ。

よくできてるね。ウェブサイトのことね。原則への追悼みたいな感じ。アイコンが好きな人には、僕の無料のMacスクリーンセーバー「Iconic」を宣伝しちゃうよ。「Aqua Icons」のスクリーンセーバーリメイクで、知らなかったアイコンを見せたり、Macの歴史の中で注目すべきアイコンを強調したりしてるんだ。https://github.com/Rezmason/iconic

macOS 9の見た目が大好きだったし、今も好き。メニューのインタラクションも全部いい感じ。個人用や開発以外のコンピューティングのために、戻ろうかなって考えてる。ブラウザとかでいくつかの課題があると思うけど、すべて克服できるかはわからない。現代のmacOSには喜びを感じない。BeOSのUIにも似たような愛情を抱いてたし、Haikuが順調に動いてるのを見るのは嬉しい。

OS Xのデザイン言語が恋しいな。上から平らな面に置かれているように見える視点で、でもちょっと奥行きがある感じ。そういうデザインのものは大体美しく見えたし、そうじゃないもの(Internet Explorer)は目立ってた。iPhotoやStickies、Mailのアイコンはすごく美しかった。

関係ないけど、いつかMacが「全く新しい」クラシックな古いMacスタイルのUIをリリースしてほしいな。そうなったら、みんながいつも通り真似して、現代のUIの世界にちょっとした常識が戻ると思う。

私のお気に入りは、Think Differentのテキストが入ったTextEditのアイコンだね。