「現実の模倣」から「体験の設計」へ：UIデザインの歴史と未来を読み解く
2025年2月27日、グランフロント大阪ナレッジサロンで開催された「木曜サロン」にて、「UI（ユーザーインターフェース）デザイン」をテーマにお話ししました。
私たちが日々操作しているスマートフォンやPCの画面。そこには、半世紀以上にわたる試行錯誤の歴史と、「人間がいかにして機械と意思疎通を図るか」というデザインの知見が詰まっています。今回は、UIデザインの誕生から近年のトレンドまで、その変遷の裏側にある「メタファー（比喩）」の役割を中心に紐解きました。
1. UI/UXの再定義：デザインが扱う「接点」の領域
UI（ユーザーインターフェース）とは、一般的に「接点」や「境界面」を意味します。ハードウェア、ソフトウェア、そして人間が情報をやり取りする際に接する部分すべてがデザインの対象です。
よく混同されるUX（ユーザーエクスペリエンス）は、その接点を通じて得られる「体験」そのものを指します。デザインの領域は、単なる記号や製品（第1・第2層）から、インタラクションやシステム（第3・第4層）へと拡大しています。
参考：デザインの4つの領域について
デザインが扱う領域の広がりについては、「経営戦略としてのデザイン領域｜4つの次層と英雄の旅」の記事でも詳しく触れています。
2. UIデザインの歩み：メタファーが繋いだ人間と機械
UIの歴史は、人間がいかに「見慣れない機械」を「直感的な道具」に変えてきたかの歴史でもあります。
黎明期とGUIの誕生
1961年のマウスの誕生、1963年のSAGEシステムを経て、1973年にXerox Altoで最初のGUI（グラフィカル・ユーザーインターフェース）が産声を上げました。その後、1983年のLisaや1984年のMacintosh 128Kが登場し、ディスプレイの中に「机の上（デスクトップ）」というメタファーを持ち込むことで、一般の人々でもコンピュータを操作できるようになりました。
スキューモーフィズム：現実の質感を持ち込む
1990年代から2000年代にかけて主流となったのが、スキューモーフィズム（Skeuomorphism）です。本物の電話のようなダイヤルや、革の質感を模したカレンダーなど、現実世界の物体を模倣することで、ユーザーに「何ができるか」を直感的に伝えました
参考：スキューモーフィズムの成り立ち
この手法の起源や設計指針については、「GUIの歴史からみるスキューモーフィズムの成り立ちと設計指針」で詳しく分析しています。
3. 脱・模倣から「デジタルの身体性」へ：フラットデザイン以降
2010年代に入ると、ユーザーがデジタル操作に習熟したこともあり、過剰な装飾を削ぎ落としたフラットデザインへとシフトします。Windows Phone（Metro UI）やiOS 7の登場がその象徴です。
しかし、単に写実的な表現を削ぎ落としフラットにするだけでは、どこがボタンなのか、どの要素が重なっているのかという「手がかり」が失われてしまいます。そこで登場したのが、以降のUIトレンドと言えるものです。
✔️ Material Design (2014〜):
影や奥行きの概念を導入し、紙が重なっているような論理的な構造を持たせる。
✔️ Fluent Design (2017〜):
透過性や光の表現を取り入れ、環境との調和を目指す。
✔️ Glassmorphism (2021〜):
すりガラスのような表現で、階層構造を視覚的に分かりやすく提示する。
4. 優れたUIデザインの原則：ユーザーに「考えさせない」
UIデザインの変遷を見ていくと、時代やトレンド、デザインのスタイルが変化しても、変わらない「本質」が見えてきます。それは、「ユーザーに考えさせない（Don’t make me think）」ということです。
講演では、ヤコブ・ニールセンが提唱した「ユーザビリティ10原則」を引用しながら、優れたUIに共通する条件を整理しました。
1. システムの状態を可視化する
2. 現実世界とシステムをマッチさせる
3. ユーザに操作の主導権と自由を与える
4. 一貫性を保ち標準に倣う
5. エラーを防止する
6. 思い出させるのではなく認識させる
7. 柔軟性と効率性をもたせる
8. 最小限の美しいデザインにする
9. ユーザーが認識、診断、回復ができるようにする
10. ヘルプとマニュアルを用意する
こうした原則は、AI時代の新しいインターフェースを設計する際にも不可欠な「補助線」となります。
おわりに：道具としての美しさと機能性
UIデザインを学ぶことは、人間が情報をどのように捉え、どのように意思決定を行うかという心理的プロセスを理解することに他なりません。Balloon Inc.では、最新のトレンドを追うだけでなく、こうした歴史的な背景と普遍的な原則に基づき、ビジネスを加速させるための「使い心地」を設計しています。 今回のサロンでの対話を通じて、UIデザインが持つ「言葉に頼らないコミュニケーション」の可能性を再確認することができました。ご参加いただいた皆様、ありがとうございました。
本記事で触れたUIの変遷や普遍的な原則は、Balloon Inc.が考えるクリエイティブの土台となっています。あわせて、最新のテクノロジーやデザインの視点についての考察もご覧ください。
✔️「回答」ではなく「補助線」：デザインの解像度を一段上げるAIとの距離感
AIを単なる「答えを出す機械」としてではなく、人間の思考を深め、デザインの解像度を一段引き上げるための「補助線」として捉えるための向き合い方について説明しています。
✔️ 資産としてのブランドを設計する：ブランド定義の類型化とエクイティ構築の構造
様々な組織が定義する「ブランド」の意味合いを集め類型化し、中長期的な価値を構築するための論理的な構造について考察した内容です。
✔️ ブランディングの理論と実践
ブランディングにまつわる記事をまとめた、Balloon Inc.のブランディングの考え方のポータルサイトです。
執筆者プロフィール：志水 良（Shimizu Ryo）
Balloon Inc. CEO / アートディレクター
OUZAK Design、キーエンスでのデザイン経験を経て、現在はブランディング、UI/UX、工業デザイン、グラフィックデザインまで幅広くカバー。JAGDA・JIDA正会員、German Design Award、A’ Design Award、Graphis Brandingなどを受賞。TEDx Kyotoへの参画など、デザインを通じた社会実装を推進している 。
・Balloon Inc. 公式サイト: lloon.jp
