Human Interface Guidelinesに帰ってきたデザイン原則を読む
WWDC26開催に合わせて、Human Interface Guidelines(HIG)のページにデザイン原則(Design principles)が追加されました。6月9日時点ではまだ日本語版は確認できていませんが、下記URLからアクセスできます。
また、合わせてデザイン原則を紹介する動画も公開されました。
さて、追加されたと書きましたが、実際のところは「戻ってきた」と書いたほうが正しいでしょう。HIGが現在のバージョンにアップデートされたのは2022年の6月でしたが、このタイミングで以前のHIGにあったデザイン原則は取り除かれていました。
リニューアル当時、「デザイン原則って削除して大丈夫なんだ」と驚いた記憶があります。自分のデザイン原則に対する印象は「システムやプラットフォームの意思表明」なので、ドキュメントとして軸を失ったように感じていました。寂しい気持ちもありつつも、なくした意図もあるはずで、当時は「HIGがプラットフォーム(端末)を横断する形式に整理されたから、原則はエッセンスとして分散させたのかな」と考えていました。デザイン原則は意思表明に限らず、ドキュメントに人間らしさや温度感を与えていたと(勝手に)思っていたので、今回戻ってきて嬉しいです。
では、その戻ってきたデザイン原則はどのようなものなのか。読んでみたいと思います。まだ日本語版がないので、内容に関してはツールによる翻訳と動画の日本語字幕を参照しています。ただ字幕のテキストにはやや不自然さが残る("エージェンシー"よりも"主体性"が適切だろう、など)ので、そのあたりは適宜意訳しています。内容の正確性に関しては、日本語版のページができたら合わせて読んでもらえたらと思います。また、手元に2012年発行の日本語版HIGがあったので、そちらとの比較も挟んでいきます。内容はリニューアル直前とほぼ変わらない(むしろテキスト量的には多い)ため以降は「旧版」と呼称し、合わせて2026年版は「新版」と呼称します。
まずは原則の各セクションタイトルを見ていきます。新版では
- 目的(Purpose)
- 主体性(Agency)
- 責任(Responsibility)
- 親しみやすさ(Familiarity)
- 柔軟性(Flexibility)
- シンプルさ(Simplicity)
- クラフト(Craft)
- 喜び(Delight)
となっています。一方で旧版は
- 外観の整合性
- 一貫性
- 直接操作
- フィードバック
- メタファ
- ユーザによる制御
となっています。第一印象はやはり項目が増えた点でしょうか。また、旧版よりも抽象度が上がっており、対象範囲も広がっています。逆に言えば、旧版は直接操作やフィードバックなど、ややシステム寄りの原則であることに気が付きます。しかし旧版の項目が消滅したかと言うとそうではなく、例えば旧版の『フィードバック』は新版の『親しみやすさ』の中に『明確なフィードバックを提供する』として含まれています。
新版と旧版はテキスト量にも違いが見られます。新版はひとつのセクションに項目が複数ある代わりに、ひとつひとつの文量は最低限に抑えられています。一方、旧版はひとつのセクションで完結しています。例えば『フィードバック』に関して新版では
アプリを利用する中で何が起きているのかを明確に伝えましょう。操作可能な状態を示し、コンテンツの変化を知らせ、システム標準のパターンを用いて警告や選択肢を提示してください。一貫したフィードバックは、人々が状況を理解し、主体的に行動する助けになります。
とコンパクトにまとめられていますが、旧版では以下のように細かい挙動にまで言及した詳細なテキストが書かれています。
フィードバックは、アクションを受け付けたことをユーザに知らせたり、処理が発生していることをユーザに確信させたりします。ユーザは、コントロールを操作しているときは即座のフィードバックを期待し、処理時間が長くかかっているときには状況の最新情報が得られると助かります。iOSに標準で組み込まれているアプリケーションは、何らかの目に見える変化によって、ユーザの1つ1つのアクションに反応します。たとえば、ユーザがリスト項目をタップすると、そのリスト項目が短時間ハイライトされます。2~3秒以上継続して処理が行われる場合、コントロールはその間、経過進捗を表示し、妥当と考えられる場合には、アプリケーションが説明メッセージを表示します。 ちょっとしたアニメーションは、ユーザのアクションがもたらした結果を理解しやすくする、意味のあるフィードバックをユーザに与えます。たとえば、リストでは、ユーザが変化を視覚的に追いやすくなるよう、新しい行の追加をアニメーション化できます。サウンドもユーザにとって有用なフィードバックを与えることができます。しかし、ユーザは音が聞こえない場所や音を出せない場所でデバイスを使用する可能性があるため、サウンドをフィードバックの主要な、または唯一の仕組みとして使用しないでください。
こうしたテキストを踏まえると、旧版がシステム寄りである印象がより増します。
『目的』が持つメッセージ性
HIGに限らず、デザイン原則の多くは自分たちがもっとも伝えたいメッセージを最初に用意している印象があります。それに倣うと、新版で『目的』という抽象的でありながら強度のあるメッセージが置かれているのは、あたらしいデザイン原則が旧版と同様に長期間の運用を見越して制作された痕跡のようにも感じられます。
そんな『目的』には3つの項目が内包されており、それぞれ以下のようなことが書かれています。
価値を生み出す。優れたデザインは、製品を本当に役立つものにする要素へと絶えず意識を向けています。開発のあらゆる段階で、製品の目的は何か、そしてデザインがその目的に貢献しているかを問い続けましょう。焦点を絞る。人々がどのように使いたいかに沿って、アプリの最も重要な機能を優先しましょう。そして、それらの機能を本当に優れたものにすることへ集中してください。用途が明確な製品ほど、人々の目標達成を効果的に支援できます。新しい解決策を見つける。既存の解決策を調査し、それを単に作り直すことは避けましょう。自分たちの製品を特徴づけるものは何かを定義し、その違いをデザインでどのように表現できるかを考えてください。
自分はこれを読んだとき、ああ、これは丁寧に考えて書かれているものなのだなと強く感じました。『目的』として最初に語られるのが「価値を生み出す」であることは、強いメッセージ性を含んでいます。
「新しい解決策を見つける」もとても素敵です。サービスや製品を考えるうえでは必須のマインドセットですが、意外と表明しているデザイン原則はないのでは?と思います。これはプラットフォーマーであるAppleだからこそ含めることのできた内容だと言えるかもしれません。
ほかのセクションもそうですが、あたらしいデザイン原則は「未来と、そこに至る現在地」の両方に意識を向かわせる印象を受けます。
また『優れたデザインのための原則』の冒頭では『目的』に関して以下のように述べられています。
Appleにとってデザインとは、意図をもってものを作ることです。人々にとって最も重要なことに焦点を当てることです。人々が本当に価値を感じるものを作るためです。製品に加える機能はすべて使う人に何かを求めます。時間と注意と信頼を求めます。これらは大切なものなので、無駄にするわけにはいきません。何を作るかを選ぶことは、何を含めないかを決めることでもあります。スケッチを1枚描く前に、コードを1行書く前に、作ろうとしているものに目的があるかを考えてください。
HIGのテキストと合わせて読むと、『目的』で語られている内容はデザインするうえでの大原則を端的にあらわしているように思えます。これらを心に留めてプロダクトに向き合おうという、指針となるメッセージだと感じました。
主体性・責任・柔軟性
ほかのセクションに目を向けてみます。『目的』の次にあるのが『主体性』です。このセクションは旧版の『ユーザによる制御』(以下に引用)に近い内容となっています。
アクションは、アプリケーションではなく、ユーザが開始し、制御するべきです。アプリケーションはアクションの道筋を示唆したり、危険な影響に関して警告したりできますが、アプリケーションが意思決定をユーザから奪うことは通常、適切ではありません。優れたアプリケーションは、必要な能力をユーザに与えることと、危険な結果をユーザが回避する手助けをすることとの正しいバランスを見つけています。ユーザは、動作や制御になじみがあり、予測可能である場合に、よりアプリケーションを制御していると感じます。そして、アクションが単純かつ簡単なものであれば、ユーザはアクションを容易に理解し記憶できます。ユーザは、処理が開始される前にその処理をキャンセルする十分な機会があることを期待し、害を及ぼす可能性のあるアクションを実行する意思を確認する機会が得られることを期待します。最後に、ユーザは、進行中の処理を支障なく停止できることを期待します。
新版では動作・制御・処理といったシステム寄りの語彙は使われず、平易な言葉で伝わりやすくなっています。またセクションタイトルからもわかるように「いかにしてユーザーにコントロールさせるか」というよりは「いかにユーザーに主導権を渡し、自由さを感じてもらえるか」といった、よりポジティブなニュアンスを感じます。これはほかのセクションにも言えることですね。比較してみると旧版は全体的に堅苦しいニュアンス、ややドライな印象を受けがちですが、新版は読んだ人のモチベーションが上がるような、ポジティブなニュアンスを感じます。語彙の選択やセクションの細分化が寄与しているのでしょう。
『主体性』の次は『責任』ですが、ここは『柔軟性』と合わせて見るのがよさそうです。というのも、この2つではセキュリティやプライバシー、アクセシビリティについて言及されているからです。これらは旧版では言及されていなかったため、時代の変化に対応したアップデートと言えます。特にアクセシビリティは「最初から最優先事項(priority from the start)として扱うべき」と、原則全体の中でも際立った記述があります。現在のAppleはセキュリティやアクセシビリティに関する発信・対応を積極的におこなっているため、それがデザインにもきちんと降りてきたということなのでしょう。ユーザーのために製品はどうあるべきか、それを作る人はどうあるべきか、を細分化・具体化して漏れなく伝えようという意思を感じます。
一貫性は親しみやすさへ
UIデザインを学び始めた人の多くが最初に学び、UIデザインの奥深さを知ったのが「一貫性」の概念ではないでしょうか。かくいう自分もそうでした。ただ画面をその場その場で適当に作るのではなく、全体を通して一貫性を確保する。部品はコンポーネントと呼ばれ、再利用性によって一貫性に寄与する。この感覚を理解したとき、UIをデザインするとはどういうことなのか、その端緒をつかめたような気がしました。旧版のデザイン原則にも一貫性のセクションが存在します。
インターフェイスの一貫性を保つことで、ユーザは自身の知識やスキルを、あるアプリケーションから別のアプリケーションへと持ち越せるようになります。一貫性のあるアプリケーションとは、他のアプリケーションをやみくもに模倣するということではなく、ユーザにとって心地よい標準規格やパラダイムを取り入れたアプリケーションということです。アプリケーションが一貫性の原則に従っているかどうかを判断するには、以下の問いに対する答えを考えてみます。・アプリケーションはiOSの標準との整合性がとれているか。システムが提供するコントロール、ビュー、アイコンを正しく使用しているか。デバイスの機能を信頼できる方法で組み込んでいるか。・アプリケーションは、アプリケーション内での一貫性が保たれているか。テキストは均一な用語とスタイルを使用しているか。同じアイコンは常に同じことを意味しているか。ユーザが同じアクションを別の場所で実行するときに、何が起きるかを予測することができるか。独自のUI要素の外観と動作は、そのアプリケーション全体を通じて同一になっているか。・アプリケーションは、理にかなう範囲で、それよりも前のバージョンとの一貫性を保っているか。用語とその意味が変わらないままであるか。基本的な概念が本質的に変わらないままであるか。
さて、新版には一貫性のセクションがありません。ではAppleは一貫性を捨てたのか?というとそうではなく、『親しみやすさ』の項に多くの影響を見て取れます。
人々がすでに知っている概念を活用する。人々は現実世界の仕組みへの理解と、他のソフトウェアで学んだ慣習を新しい体験にも持ち込みます。その両方を活用し、親しみやすく直感的なインターフェイスを実現しましょう。ビジュアルとインタラクションを一貫させる。要素の見た目や振る舞いを定めたら、それをデザイン全体で統一して適用しましょう。一貫性は学習を容易にし、新しい操作も期待どおりに機能するという安心感を与えます。明確なフィードバックを提供する。アプリを利用する中で何が起きているのかを明確に伝えましょう。操作可能な状態を示し、コンテンツの変化を知らせ、システム標準のパターンを用いて警告や選択肢を提示してください。一貫したフィードバックは、人々が状況を理解し、主体的に行動する助けになります。
この構造から、Appleは「一貫性をソフトウェアに持たせることが親しみやすさにつながる」と考えていることが読み取れます。このセクションに限らず、デザイン原則全体を見渡してみると、旧版の内容は新版ではどれも前提、当たり前の位置づけになっており、その先を新版では提示しているような印象を受けます。そう考えると、なぜHIGリニューアルのタイミングでデザイン原則が除かれたのか、なぜ帰ってきたのかの背景が垣間見えるような気がします。
シンプルさ
シンプルさのセクションについては、正直なところ取り立てて言及する箇所はないように思います。それくらい、まっすぐにわかりやすいメッセージだと思います。
必要なものだけを含める。シンプルであることは、最小限であることを意味しません。重要なものを手の届く場所に置き、それ以外を自然に後景へ退かせる、焦点の定まった有用な体験を目指しましょう。平易な言葉で簡潔に伝える。最もシンプルな言い方を見つけたとき、それは多くの場合、最も普遍的で役立つ表現になります。概念を伝えたり操作要素に名前を付けたりする際には、平易で必要十分な言葉を選びましょう。明確な階層をつくる。形と機能がすぐに理解できれば、人々は目的の結果へ到達する方法を把握できます。認識しやすい操作要素を優先し、自分がどこにいて次に何が起こるのかを理解できる一貫した構造を提供しましょう。
クラフト(こだわり)とデライト(喜び)
この2つが原則の最後を務めます。冒頭に、デザイン原則はドキュメントに人間らしさや温度感を与えていたと書きましたが、この2つはそれをよく体現しているセクションだと思います。個人的にとても好きなセクションですし、Appleらしくもある。原則が『目的』ではじまり『喜び』で終わるというのも詩的で、美しさを感じます。
内容に目を向けてみると、まず『クラフト』に関しては、原則のページ冒頭の概要がセクション全体をよく言い表しています。
細部にまで気を配る。あなたのデザインは、あなたがどれほど心を込めているかの表れです。それは、人々に最高の体験を届けようとするあなたの献身的な姿勢を示すものです。時間をかけて、丁寧に仕事に取り組んでください。
興味深いのは、セクションの詳細を読むと、単にビジュアルなどを作り込む職人的こだわりのニュアンスにとどまらず、プロセスに対する言及が多くを占めている点です。
品質がすべてを決める。デザインのあらゆる要素は、どれだけ心を込めているかを人々に伝えます。ひとつひとつの判断を意図的に行い、息をのむようなビジュアル、流れるようなアニメーション、的確な言葉遣い、そして細部まで考え抜かれたサウンドを追求しましょう。実験し、改善を繰り返す。早い段階でプロトタイプを作成し、新しいアプローチを試し、うまく機能しないものは潔く捨ててください。すべての機能に高い基準を設け、磨き上げ、再び試しましょう。実際の利用環境で製品を検証し、耐久性・信頼性・高いパフォーマンスを確認してください。こだわりを維持し続ける。リリースはゴールではありません。インターフェイスを最新のプラットフォーム機能やデザインパターンに対応させ続け、品質基準を高く保ちましょう。デザインとは、継続的な取り組みです。
個々の要素を作り込むこと、反復したプロセスによってそれらを磨き上げること、そして運用によって維持することがひとつのセクションで語られているのは現代的なアップデートだと言えそうです。
プロトタイピングやリリース後の運用改善は、言ってしまえば単体で読むと当たり前の内容ではあるのですが、それが『こだわり』のセクションに含まれることでプラスの意味が生まれているのが構成の妙だなと思わされます。
欲を言えば、プロダクトに尋常ならざる「こだわり」を持っているAppleだからこそ生まれる言葉やメッセージがあればもっと魅力的になるのにな、とは思いました。全体のトーンからは外れてしまいそうですが。
最後が『デライト』です。
呼び起こしたい感情を明確にする。すべてのソフトウェアが同じ感覚を与えるわけではありません。フィットネスアプリは活力を与え、瞑想アプリは心を落ち着かせ、ゲームは興奮をもたらすかもしれません。ユーザーに感じてほしい感情を把握し、それがデザイン全体を形づくるようにしましょう。印象に残る瞬間をつくる。あらゆるインタラクションは、そのソフトウェアが何を大切にしているかを示す機会です。シンプルなボタン操作からエラーメッセージまで、それぞれの瞬間がデザインの精神を反映した個性を添える機会になり得るかを考えてみてください。デライトを装飾と混同しない。ユーザーは目的を達成しようとしていることを忘れてはいけません。デライトを追求すること自体を目的にして、プロダクトの本来の目的を妨げないようにしましょう。全体的な美的方向性についても考えてみてください。丁寧に考え抜かれた実用的な表現のデザインもあれば、遊び心が合うデザインもあります。適切なバランスを見つけるために試行錯誤しましょう。全体として捉える。デライトは、製品に込めた思いやりの積み重ねから生まれます。それは、ユーザーが利用中に経験するすべての要素の集積です。自由に行動できること、安心して探索できること、馴染みのあるメタファーによる心地よさ、そして状況に応じてシームレスに移行できる柔軟性。意図と集中、そして細やかな配慮をもってデザインすると、人々が自然と心地よさを感じるプロダクトが生まれます。
『優れたデザインのための原則』の中で、デライトとは「製品に込めた思いやりの総和」であり「すべてのデザイン原則を正しく実行した自然な結果」だと言われています。原則の結びとして、これまでの集大成を「喜び」として提示するのは美しい流れだと言えます。また、旧版との比較では『外観の整合性』の痕跡を感じ取れます。
外観の整合性は、アプリケーションがどれだけ美しいかを示す尺度ではなく、アプリケーションの外観がその機能とどれほど整合しているかを示す尺度です。たとえば、生産的なタスクを実行するアプリケーションは一般に、標準のコントロールや動作を提供することでタスクに目が向くようにする一方で、装飾的な要素は控えめにして背景に溶け込むようになっています。こうしたアプリケーションは、その目的やアイデンティティについて、明確で統一されたメッセージをユーザに与えます。一方、奇抜だったり、真面目には見えないUIの中で生産的な作業を実行するようなアプリケーションでは、ユーザはこの矛盾をどのように解釈したら良いか分からなくなる可能性があります。同様に、ゲームなどの没入型のアプリケーションでは、楽しさを約束してくれて、発見のありそうな美しい外観をユーザは期待します。ゲームでは真面目な作業や生産的な作業を実行することは期待されませんが、見た目と体験が一体化していることは期待されます。
旧版では外観という表層的な面に限定されていますが、新版では抽象度が上がり、端的に伝えようとしています。また、外観の重要性を低めているというよりは「装飾と混同しない」とあるように、単に飾り付けをすることが喜びに直結するわけではない、という最低ラインの提示に転換している印象があります。
デザインに喜びをもたらす方法は、紙吹雪を加えることではありません。プロセスの最後に装飾を後付けすることでもありません。喜びをもたらすインターフェイスを作るには、ユーザーに感じてほしい感情を特定することです。リラックス、自信、興奮。そして、デザインを通じてそれを強化する機会を見つけましょう。
ユーザーがサービスや製品を通して得る体験は複雑で多層的です。だからこそ、作業の結果が目に見えやすい装飾に逃げず、広い視野で製品とユーザーの結びつきを探求することを示唆しているのだと思います。
というわけで、ざっくりですが新しいデザイン原則を読んでみました。全体的な感想としては、旧版を土台にした増改築ではなく、あたらしい土台を作ったうえで旧版のエッセンスを散りばめつつ、耐用年数の長さと現代的なアップデートが施された内容だと感じました。各セクションは具体的なアプローチや技術への入口として機能しており、かつ人間らしい温かみも感じさせるもので、初学者にも経験者にも有用な羅針盤と言えるでしょう。
個人的には、この原則がどういった経緯やプロセスで作られたかの裏側や、各セクションをより具体的に深掘りしたセッションや記録が公開されたら嬉しいなと感じます。
2017年に何が語られていたか
ここまで書いて、そういえば過去にHIGに関するWWDCのセッション動画があったな、と思い出しました。
日本語字幕はなかったものの、字幕ファイルをツールで日本語訳したところ導入で話されている内容が「めちゃくちゃいいこと言ってるな」と心に響いたので、自分用のメモも兼ねて以下に引用します。
「ユーザー(user)」という言葉には、やや無機質で匿名的なニュアンスがあります。人をインターフェースとの関係だけで狭く定義してしまいます。「ヒューマン(human)」という言葉は、私たちがデザインしている相手についての、より豊かなイメージを呼び起こします。「私はただの人間だから」と言うとき、それは自分に欠点や不完全さがあることを認めることです。しかし「ヒューマン」という言葉は、私たちの最も崇高な資質を表す言葉でもあります。誰かの「人間性」を認めることは、その人の優しさ、思いやり、寛大さ、善良さを認めることです。インターフェースをデザインすることは、根本的に他の人間に奉仕することです。目標は美しいアプリ、整理されたアプリ、シンプルなアプリ、フォーカスされたアプリを作ることではありません。これらはすべて重要ですが、本当の目標ではありません。本当の目標は、あなたが作るアプリを使う人々の人生にポジティブな影響を与えることです。本当に重要なのは、あなたのアプリが、デザインしている人々の感情的・実際的なニーズをどれだけ満たせるかです。人間には、安全と予測可能性へのニーズがあります。知識、意味、理解へのニーズがあります。タスクを達成し、個人的・職業的な目標を達成するニーズがあります。そして美しさや喜びを体験するニーズがあります。よくデザインされたアプリはこれらを提供します。アクションの結果を予測しやすくし、安定感・信頼感を与えます。明確で役立つ情報を提供し、人々が情報に基づいた選択をできるよう助けます。合理化・簡略化されたワークフローで効率的にタスクを達成できるようにします。そして、美的に心地よく、楽しく、さらには喜びをもたらすような体験を提供します。これらの品質を持つアプリを使うとき、アプリを作った人々が自分のニーズをしっかりと考慮してくれたことが伝わってきます。どうすれば素早く成功裏に物事を成し遂げられるかを考えるために、どれほどの時間と努力が注がれたかが感じられます。すべてに意味があり、すべてが理解できる。それはとても「人間的」な感じがします。アプリがそう感じさせてくれるとき、私たちはデザインした人々の人間性を感じます。では、あなたのアプリのデザインはどうすればそれを実現できるのでしょうか?デザインについて話すとき、私たちはよくテクニックやプロセスに注目しがちです。これらは重要な考慮事項ですが、それだけでは優れたデザインには繋がりません。優れたデザインは、デザインとは何かについての、より根本的で人間的なレベルの深い理解に導かれています。これがデザイン原則の提供するものです。デザイン原則は、私たちが世界をどう知覚し、情報をどう処理し、意思決定をどう行い、コミュニケーションをどう取るかについての核心的な真実を表現しています。これらの真実は普遍的かつ永続的です。あらゆる種類のグラフィックデザイン、建築、インテリアデザイン、リテールデザイン、ランドスケープデザイン、自動車デザイン、そして他のあらゆるデザインに適用されます。デザイン原則は「どうするか」ではなく「なぜそうするか」を教えてくれます。優れたデザインの上に築かれる基盤として機能するのです。
これを読むと、原則はただリニューアルされたわけではなく、Appleの姿勢や哲学は連綿と続いているのだなと思わされます。新版に合わせて公開されたセッションの抜粋です、と言われても違和感がまったくありません。すごい。ひょっとすると、新版の制作にあたりこのビデオも参考にされているのかもしれません。
WWDC26開催に合わせて、Human Interface Guidelines(HIG)のページにデザイン原則(Design principles)が追加されました。6月9日時点ではまだ日本語版は確認できていませんが、下記URLからアクセスできます。
また、合わせてデザイン原則を紹介する動画も公開されました。
さて、追加されたと書きましたが、実際のところは「戻ってきた」と書いたほうが正しいでしょう。HIGが現在のバージョンにアップデートされたのは2022年の6月でしたが、このタイミングで以前のHIGにあったデザイン原則は取り除かれていました。
リニューアル当時、「デザイン原則って削除して大丈夫なんだ」と驚いた記憶があります。自分のデザイン原則に対する印象は「システムやプラットフォームの意思表明」なので、ドキュメントとして軸を失ったように感じていました。寂しい気持ちもありつつも、なくした意図もあるはずで、当時は「HIGがプラットフォーム(端末)を横断する形式に整理されたから、原則はエッセンスとして分散させたのかな」と考えていました。デザイン原則は意思表明に限らず、ドキュメントに人間らしさや温度感を与えていたと(勝手に)思っていたので、今回戻ってきて嬉しいです。
では、その戻ってきたデザイン原則はどのようなものなのか。読んでみたいと思います。まだ日本語版がないので、内容に関してはツールによる翻訳と動画の日本語字幕を参照しています。ただ字幕のテキストにはやや不自然さが残る("エージェンシー"よりも"主体性"が適切だろう、など)ので、そのあたりは適宜意訳しています。内容の正確性に関しては、日本語版のページができたら合わせて読んでもらえたらと思います。また、手元に2012年発行の日本語版HIGがあったので、そちらとの比較も挟んでいきます。内容はリニューアル直前とほぼ変わらない(むしろテキスト量的には多い)ため以降は「旧版」と呼称し、合わせて2026年版は「新版」と呼称します。
まずは原則の各セクションタイトルを見ていきます。新版では
- 目的(Purpose)
- 主体性(Agency)
- 責任(Responsibility)
- 親しみやすさ(Familiarity)
- 柔軟性(Flexibility)
- シンプルさ(Simplicity)
- クラフト(Craft)
- 喜び(Delight)
となっています。一方で旧版は
- 外観の整合性
- 一貫性
- 直接操作
- フィードバック
- メタファ
- ユーザによる制御
となっています。第一印象はやはり項目が増えた点でしょうか。また、旧版よりも抽象度が上がっており、対象範囲も広がっています。逆に言えば、旧版は直接操作やフィードバックなど、ややシステム寄りの原則であることに気が付きます。しかし旧版の項目が消滅したかと言うとそうではなく、例えば旧版の『フィードバック』は新版の『親しみやすさ』の中に『明確なフィードバックを提供する』として含まれています。
新版と旧版はテキスト量にも違いが見られます。新版はひとつのセクションに項目が複数ある代わりに、ひとつひとつの文量は最低限に抑えられています。一方、旧版はひとつのセクションで完結しています。例えば『フィードバック』に関して新版では
アプリを利用する中で何が起きているのかを明確に伝えましょう。操作可能な状態を示し、コンテンツの変化を知らせ、システム標準のパターンを用いて警告や選択肢を提示してください。一貫したフィードバックは、人々が状況を理解し、主体的に行動する助けになります。
とコンパクトにまとめられていますが、旧版では以下のように細かい挙動にまで言及した詳細なテキストが書かれています。
フィードバックは、アクションを受け付けたことをユーザに知らせたり、処理が発生していることをユーザに確信させたりします。ユーザは、コントロールを操作しているときは即座のフィードバックを期待し、処理時間が長くかかっているときには状況の最新情報が得られると助かります。iOSに標準で組み込まれているアプリケーションは、何らかの目に見える変化によって、ユーザの1つ1つのアクションに反応します。たとえば、ユーザがリスト項目をタップすると、そのリスト項目が短時間ハイライトされます。2~3秒以上継続して処理が行われる場合、コントロールはその間、経過進捗を表示し、妥当と考えられる場合には、アプリケーションが説明メッセージを表示します。 ちょっとしたアニメーションは、ユーザのアクションがもたらした結果を理解しやすくする、意味のあるフィードバックをユーザに与えます。たとえば、リストでは、ユーザが変化を視覚的に追いやすくなるよう、新しい行の追加をアニメーション化できます。サウンドもユーザにとって有用なフィードバックを与えることができます。しかし、ユーザは音が聞こえない場所や音を出せない場所でデバイスを使用する可能性があるため、サウンドをフィードバックの主要な、または唯一の仕組みとして使用しないでください。
こうしたテキストを踏まえると、旧版がシステム寄りである印象がより増します。
『目的』が持つメッセージ性
HIGに限らず、デザイン原則の多くは自分たちがもっとも伝えたいメッセージを最初に用意している印象があります。それに倣うと、新版で『目的』という抽象的でありながら強度のあるメッセージが置かれているのは、あたらしいデザイン原則が旧版と同様に長期間の運用を見越して制作された痕跡のようにも感じられます。
そんな『目的』には3つの項目が内包されており、それぞれ以下のようなことが書かれています。
価値を生み出す。優れたデザインは、製品を本当に役立つものにする要素へと絶えず意識を向けています。開発のあらゆる段階で、製品の目的は何か、そしてデザインがその目的に貢献しているかを問い続けましょう。焦点を絞る。人々がどのように使いたいかに沿って、アプリの最も重要な機能を優先しましょう。そして、それらの機能を本当に優れたものにすることへ集中してください。用途が明確な製品ほど、人々の目標達成を効果的に支援できます。新しい解決策を見つける。既存の解決策を調査し、それを単に作り直すことは避けましょう。自分たちの製品を特徴づけるものは何かを定義し、その違いをデザインでどのように表現できるかを考えてください。
自分はこれを読んだとき、ああ、これは丁寧に考えて書かれているものなのだなと強く感じました。『目的』として最初に語られるのが「価値を生み出す」であることは、強いメッセージ性を含んでいます。
「新しい解決策を見つける」もとても素敵です。サービスや製品を考えるうえでは必須のマインドセットですが、意外と表明しているデザイン原則はないのでは?と思います。これはプラットフォーマーであるAppleだからこそ含めることのできた内容だと言えるかもしれません。
ほかのセクションもそうですが、あたらしいデザイン原則は「未来と、そこに至る現在地」の両方に意識を向かわせる印象を受けます。
また『優れたデザインのための原則』の冒頭では『目的』に関して以下のように述べられています。
Appleにとってデザインとは、意図をもってものを作ることです。人々にとって最も重要なことに焦点を当てることです。人々が本当に価値を感じるものを作るためです。製品に加える機能はすべて使う人に何かを求めます。時間と注意と信頼を求めます。これらは大切なものなので、無駄にするわけにはいきません。何を作るかを選ぶことは、何を含めないかを決めることでもあります。スケッチを1枚描く前に、コードを1行書く前に、作ろうとしているものに目的があるかを考えてください。
HIGのテキストと合わせて読むと、『目的』で語られている内容はデザインするうえでの大原則を端的にあらわしているように思えます。これらを心に留めてプロダクトに向き合おうという、指針となるメッセージだと感じました。
主体性・責任・柔軟性
ほかのセクションに目を向けてみます。『目的』の次にあるのが『主体性』です。このセクションは旧版の『ユーザによる制御』(以下に引用)に近い内容となっています。
アクションは、アプリケーションではなく、ユーザが開始し、制御するべきです。アプリケーションはアクションの道筋を示唆したり、危険な影響に関して警告したりできますが、アプリケーションが意思決定をユーザから奪うことは通常、適切ではありません。優れたアプリケーションは、必要な能力をユーザに与えることと、危険な結果をユーザが回避する手助けをすることとの正しいバランスを見つけています。ユーザは、動作や制御になじみがあり、予測可能である場合に、よりアプリケーションを制御していると感じます。そして、アクションが単純かつ簡単なものであれば、ユーザはアクションを容易に理解し記憶できます。ユーザは、処理が開始される前にその処理をキャンセルする十分な機会があることを期待し、害を及ぼす可能性のあるアクションを実行する意思を確認する機会が得られることを期待します。最後に、ユーザは、進行中の処理を支障なく停止できることを期待します。
新版では動作・制御・処理といったシステム寄りの語彙は使われず、平易な言葉で伝わりやすくなっています。またセクションタイトルからもわかるように「いかにしてユーザーにコントロールさせるか」というよりは「いかにユーザーに主導権を渡し、自由さを感じてもらえるか」といった、よりポジティブなニュアンスを感じます。これはほかのセクションにも言えることですね。比較してみると旧版は全体的に堅苦しいニュアンス、ややドライな印象を受けがちですが、新版は読んだ人のモチベーションが上がるような、ポジティブなニュアンスを感じます。語彙の選択やセクションの細分化が寄与しているのでしょう。
『主体性』の次は『責任』ですが、ここは『柔軟性』と合わせて見るのがよさそうです。というのも、この2つではセキュリティやプライバシー、アクセシビリティについて言及されているからです。これらは旧版では言及されていなかったため、時代の変化に対応したアップデートと言えます。特にアクセシビリティは「最初から最優先事項(priority from the start)として扱うべき」と、原則全体の中でも際立った記述があります。現在のAppleはセキュリティやアクセシビリティに関する発信・対応を積極的におこなっているため、それがデザインにもきちんと降りてきたということなのでしょう。ユーザーのために製品はどうあるべきか、それを作る人はどうあるべきか、を細分化・具体化して漏れなく伝えようという意思を感じます。
一貫性は親しみやすさへ
UIデザインを学び始めた人の多くが最初に学び、UIデザインの奥深さを知ったのが「一貫性」の概念ではないでしょうか。かくいう自分もそうでした。ただ画面をその場その場で適当に作るのではなく、全体を通して一貫性を確保する。部品はコンポーネントと呼ばれ、再利用性によって一貫性に寄与する。この感覚を理解したとき、UIをデザインするとはどういうことなのか、その端緒をつかめたような気がしました。旧版のデザイン原則にも一貫性のセクションが存在します。
インターフェイスの一貫性を保つことで、ユーザは自身の知識やスキルを、あるアプリケーションから別のアプリケーションへと持ち越せるようになります。一貫性のあるアプリケーションとは、他のアプリケーションをやみくもに模倣するということではなく、ユーザにとって心地よい標準規格やパラダイムを取り入れたアプリケーションということです。アプリケーションが一貫性の原則に従っているかどうかを判断するには、以下の問いに対する答えを考えてみます。・アプリケーションはiOSの標準との整合性がとれているか。システムが提供するコントロール、ビュー、アイコンを正しく使用しているか。デバイスの機能を信頼できる方法で組み込んでいるか。・アプリケーションは、アプリケーション内での一貫性が保たれているか。テキストは均一な用語とスタイルを使用しているか。同じアイコンは常に同じことを意味しているか。ユーザが同じアクションを別の場所で実行するときに、何が起きるかを予測することができるか。独自のUI要素の外観と動作は、そのアプリケーション全体を通じて同一になっているか。・アプリケーションは、理にかなう範囲で、それよりも前のバージョンとの一貫性を保っているか。用語とその意味が変わらないままであるか。基本的な概念が本質的に変わらないままであるか。
さて、新版には一貫性のセクションがありません。ではAppleは一貫性を捨てたのか?というとそうではなく、『親しみやすさ』の項に多くの影響を見て取れます。
人々がすでに知っている概念を活用する。人々は現実世界の仕組みへの理解と、他のソフトウェアで学んだ慣習を新しい体験にも持ち込みます。その両方を活用し、親しみやすく直感的なインターフェイスを実現しましょう。ビジュアルとインタラクションを一貫させる。要素の見た目や振る舞いを定めたら、それをデザイン全体で統一して適用しましょう。一貫性は学習を容易にし、新しい操作も期待どおりに機能するという安心感を与えます。明確なフィードバックを提供する。アプリを利用する中で何が起きているのかを明確に伝えましょう。操作可能な状態を示し、コンテンツの変化を知らせ、システム標準のパターンを用いて警告や選択肢を提示してください。一貫したフィードバックは、人々が状況を理解し、主体的に行動する助けになります。
この構造から、Appleは「一貫性をソフトウェアに持たせることが親しみやすさにつながる」と考えていることが読み取れます。このセクションに限らず、デザイン原則全体を見渡してみると、旧版の内容は新版ではどれも前提、当たり前の位置づけになっており、その先を新版では提示しているような印象を受けます。そう考えると、なぜHIGリニューアルのタイミングでデザイン原則が除かれたのか、なぜ帰ってきたのかの背景が垣間見えるような気がします。
シンプルさ
シンプルさのセクションについては、正直なところ取り立てて言及する箇所はないように思います。それくらい、まっすぐにわかりやすいメッセージだと思います。
必要なものだけを含める。シンプルであることは、最小限であることを意味しません。重要なものを手の届く場所に置き、それ以外を自然に後景へ退かせる、焦点の定まった有用な体験を目指しましょう。平易な言葉で簡潔に伝える。最もシンプルな言い方を見つけたとき、それは多くの場合、最も普遍的で役立つ表現になります。概念を伝えたり操作要素に名前を付けたりする際には、平易で必要十分な言葉を選びましょう。明確な階層をつくる。形と機能がすぐに理解できれば、人々は目的の結果へ到達する方法を把握できます。認識しやすい操作要素を優先し、自分がどこにいて次に何が起こるのかを理解できる一貫した構造を提供しましょう。
クラフト(こだわり)とデライト(喜び)
この2つが原則の最後を務めます。冒頭に、デザイン原則はドキュメントに人間らしさや温度感を与えていたと書きましたが、この2つはそれをよく体現しているセクションだと思います。個人的にとても好きなセクションですし、Appleらしくもある。原則が『目的』ではじまり『喜び』で終わるというのも詩的で、美しさを感じます。
内容に目を向けてみると、まず『クラフト』に関しては、原則のページ冒頭の概要がセクション全体をよく言い表しています。
細部にまで気を配る。あなたのデザインは、あなたがどれほど心を込めているかの表れです。それは、人々に最高の体験を届けようとするあなたの献身的な姿勢を示すものです。時間をかけて、丁寧に仕事に取り組んでください。
興味深いのは、セクションの詳細を読むと、単にビジュアルなどを作り込む職人的こだわりのニュアンスにとどまらず、プロセスに対する言及が多くを占めている点です。
品質がすべてを決める。デザインのあらゆる要素は、どれだけ心を込めているかを人々に伝えます。ひとつひとつの判断を意図的に行い、息をのむようなビジュアル、流れるようなアニメーション、的確な言葉遣い、そして細部まで考え抜かれたサウンドを追求しましょう。実験し、改善を繰り返す。早い段階でプロトタイプを作成し、新しいアプローチを試し、うまく機能しないものは潔く捨ててください。すべての機能に高い基準を設け、磨き上げ、再び試しましょう。実際の利用環境で製品を検証し、耐久性・信頼性・高いパフォーマンスを確認してください。こだわりを維持し続ける。リリースはゴールではありません。インターフェイスを最新のプラットフォーム機能やデザインパターンに対応させ続け、品質基準を高く保ちましょう。デザインとは、継続的な取り組みです。
個々の要素を作り込むこと、反復したプロセスによってそれらを磨き上げること、そして運用によって維持することがひとつのセクションで語られているのは現代的なアップデートだと言えそうです。
プロトタイピングやリリース後の運用改善は、言ってしまえば単体で読むと当たり前の内容ではあるのですが、それが『こだわり』のセクションに含まれることでプラスの意味が生まれているのが構成の妙だなと思わされます。
欲を言えば、プロダクトに尋常ならざる「こだわり」を持っているAppleだからこそ生まれる言葉やメッセージがあればもっと魅力的になるのにな、とは思いました。全体のトーンからは外れてしまいそうですが。
最後が『デライト』です。
呼び起こしたい感情を明確にする。すべてのソフトウェアが同じ感覚を与えるわけではありません。フィットネスアプリは活力を与え、瞑想アプリは心を落ち着かせ、ゲームは興奮をもたらすかもしれません。ユーザーに感じてほしい感情を把握し、それがデザイン全体を形づくるようにしましょう。印象に残る瞬間をつくる。あらゆるインタラクションは、そのソフトウェアが何を大切にしているかを示す機会です。シンプルなボタン操作からエラーメッセージまで、それぞれの瞬間がデザインの精神を反映した個性を添える機会になり得るかを考えてみてください。デライトを装飾と混同しない。ユーザーは目的を達成しようとしていることを忘れてはいけません。デライトを追求すること自体を目的にして、プロダクトの本来の目的を妨げないようにしましょう。全体的な美的方向性についても考えてみてください。丁寧に考え抜かれた実用的な表現のデザインもあれば、遊び心が合うデザインもあります。適切なバランスを見つけるために試行錯誤しましょう。全体として捉える。デライトは、製品に込めた思いやりの積み重ねから生まれます。それは、ユーザーが利用中に経験するすべての要素の集積です。自由に行動できること、安心して探索できること、馴染みのあるメタファーによる心地よさ、そして状況に応じてシームレスに移行できる柔軟性。意図と集中、そして細やかな配慮をもってデザインすると、人々が自然と心地よさを感じるプロダクトが生まれます。
『優れたデザインのための原則』の中で、デライトとは「製品に込めた思いやりの総和」であり「すべてのデザイン原則を正しく実行した自然な結果」だと言われています。原則の結びとして、これまでの集大成を「喜び」として提示するのは美しい流れだと言えます。また、旧版との比較では『外観の整合性』の痕跡を感じ取れます。
外観の整合性は、アプリケーションがどれだけ美しいかを示す尺度ではなく、アプリケーションの外観がその機能とどれほど整合しているかを示す尺度です。たとえば、生産的なタスクを実行するアプリケーションは一般に、標準のコントロールや動作を提供することでタスクに目が向くようにする一方で、装飾的な要素は控えめにして背景に溶け込むようになっています。こうしたアプリケーションは、その目的やアイデンティティについて、明確で統一されたメッセージをユーザに与えます。一方、奇抜だったり、真面目には見えないUIの中で生産的な作業を実行するようなアプリケーションでは、ユーザはこの矛盾をどのように解釈したら良いか分からなくなる可能性があります。同様に、ゲームなどの没入型のアプリケーションでは、楽しさを約束してくれて、発見のありそうな美しい外観をユーザは期待します。ゲームでは真面目な作業や生産的な作業を実行することは期待されませんが、見た目と体験が一体化していることは期待されます。
旧版では外観という表層的な面に限定されていますが、新版では抽象度が上がり、端的に伝えようとしています。また、外観の重要性を低めているというよりは「装飾と混同しない」とあるように、単に飾り付けをすることが喜びに直結するわけではない、という最低ラインの提示に転換している印象があります。
デザインに喜びをもたらす方法は、紙吹雪を加えることではありません。プロセスの最後に装飾を後付けすることでもありません。喜びをもたらすインターフェイスを作るには、ユーザーに感じてほしい感情を特定することです。リラックス、自信、興奮。そして、デザインを通じてそれを強化する機会を見つけましょう。
ユーザーがサービスや製品を通して得る体験は複雑で多層的です。だからこそ、作業の結果が目に見えやすい装飾に逃げず、広い視野で製品とユーザーの結びつきを探求することを示唆しているのだと思います。
というわけで、ざっくりですが新しいデザイン原則を読んでみました。全体的な感想としては、旧版を土台にした増改築ではなく、あたらしい土台を作ったうえで旧版のエッセンスを散りばめつつ、耐用年数の長さと現代的なアップデートが施された内容だと感じました。各セクションは具体的なアプローチや技術への入口として機能しており、かつ人間らしい温かみも感じさせるもので、初学者にも経験者にも有用な羅針盤と言えるでしょう。
個人的には、この原則がどういった経緯やプロセスで作られたかの裏側や、各セクションをより具体的に深掘りしたセッションや記録が公開されたら嬉しいなと感じます。
2017年に何が語られていたか
ここまで書いて、そういえば過去にHIGに関するWWDCのセッション動画があったな、と思い出しました。
日本語字幕はなかったものの、字幕ファイルをツールで日本語訳したところ導入で話されている内容が「めちゃくちゃいいこと言ってるな」と心に響いたので、自分用のメモも兼ねて以下に引用します。
「ユーザー(user)」という言葉には、やや無機質で匿名的なニュアンスがあります。人をインターフェースとの関係だけで狭く定義してしまいます。「ヒューマン(human)」という言葉は、私たちがデザインしている相手についての、より豊かなイメージを呼び起こします。「私はただの人間だから」と言うとき、それは自分に欠点や不完全さがあることを認めることです。しかし「ヒューマン」という言葉は、私たちの最も崇高な資質を表す言葉でもあります。誰かの「人間性」を認めることは、その人の優しさ、思いやり、寛大さ、善良さを認めることです。インターフェースをデザインすることは、根本的に他の人間に奉仕することです。目標は美しいアプリ、整理されたアプリ、シンプルなアプリ、フォーカスされたアプリを作ることではありません。これらはすべて重要ですが、本当の目標ではありません。本当の目標は、あなたが作るアプリを使う人々の人生にポジティブな影響を与えることです。本当に重要なのは、あなたのアプリが、デザインしている人々の感情的・実際的なニーズをどれだけ満たせるかです。人間には、安全と予測可能性へのニーズがあります。知識、意味、理解へのニーズがあります。タスクを達成し、個人的・職業的な目標を達成するニーズがあります。そして美しさや喜びを体験するニーズがあります。よくデザインされたアプリはこれらを提供します。アクションの結果を予測しやすくし、安定感・信頼感を与えます。明確で役立つ情報を提供し、人々が情報に基づいた選択をできるよう助けます。合理化・簡略化されたワークフローで効率的にタスクを達成できるようにします。そして、美的に心地よく、楽しく、さらには喜びをもたらすような体験を提供します。これらの品質を持つアプリを使うとき、アプリを作った人々が自分のニーズをしっかりと考慮してくれたことが伝わってきます。どうすれば素早く成功裏に物事を成し遂げられるかを考えるために、どれほどの時間と努力が注がれたかが感じられます。すべてに意味があり、すべてが理解できる。それはとても「人間的」な感じがします。アプリがそう感じさせてくれるとき、私たちはデザインした人々の人間性を感じます。では、あなたのアプリのデザインはどうすればそれを実現できるのでしょうか?デザインについて話すとき、私たちはよくテクニックやプロセスに注目しがちです。これらは重要な考慮事項ですが、それだけでは優れたデザインには繋がりません。優れたデザインは、デザインとは何かについての、より根本的で人間的なレベルの深い理解に導かれています。これがデザイン原則の提供するものです。デザイン原則は、私たちが世界をどう知覚し、情報をどう処理し、意思決定をどう行い、コミュニケーションをどう取るかについての核心的な真実を表現しています。これらの真実は普遍的かつ永続的です。あらゆる種類のグラフィックデザイン、建築、インテリアデザイン、リテールデザイン、ランドスケープデザイン、自動車デザイン、そして他のあらゆるデザインに適用されます。デザイン原則は「どうするか」ではなく「なぜそうするか」を教えてくれます。優れたデザインの上に築かれる基盤として機能するのです。
これを読むと、原則はただリニューアルされたわけではなく、Appleの姿勢や哲学は連綿と続いているのだなと思わされます。新版に合わせて公開されたセッションの抜粋です、と言われても違和感がまったくありません。すごい。ひょっとすると、新版の制作にあたりこのビデオも参考にされているのかもしれません。