-
優れたデザインのための原則
Appleプラットフォーム向けのデザインにおける基本的な原則を詳細に解説します。
関連する章
- 0:00 - Intro
- 1:08 - Purpose
- 1:52 - Agency
- 3:38 - Responsibility
- 6:04 - Familiarity
- 8:52 - Flexibility
- 11:13 - Simplicity
- 13:42 - Craft
- 15:47 - Delight
リソース
関連ビデオ
WWDC26
WWDC17
-
このビデオを検索
こんにちは Lindaです Dougです 私たちはAppleの Design Evangelistです まず1つ質問です デザインとは何でしょうか 少し考えてみてください 率直に言うと 多くの人は デザインとは見た目のことだと すぐに答えてしまうでしょう あるいはデザインとは ふるまいのことだと言うかもしれません どちらの定義も 必ずしも間違いではありません ただ 不完全な見方です Appleにとってデザインとは 意図をもってものを作ることです 人々にとって最も重要なことに 焦点を当てることです 人々が本当に価値を感じる ものを作るためです 製品に加える機能はすべて 使う人に何かを求めます 時間と注意と信頼を求めます これらは大切なものなので 無駄にするわけにはいきません 何を作るかを選ぶことは 何を含めないかを 決めることでもあります スケッチを1枚描く前に コードを1行書く前に 作ろうとしているものに 目的があるかを考えてください 目的は 基本的な原則の一つです Appleプラットフォームで 優れた体験をデザインするための 人々に役立つ体験 人々の生活を尊重し適応する体験 明確で考え抜かれた体験 最高に喜びをもたらす体験です 最初に1点お伝えします これらの原則を組み合わせる 正式な方法や正解はありません 完璧な解決策に必ずたどり着けるという 保証もありません ある原則を重視すると 別の原則で妥協が生じることも あるかもしれません しかしそれこそが デザインを面白くするものです 最終的には あなたの知識と 直感を使うのはあなた次第です 最善の道を見つけてください では始めましょう 目的の次はエージェンシーです エージェンシーとは 人々に主導権を与えることです 自分のやり方でできると感じたとき 人々は主導権を持てます 例えば 次のパートを 担当してみますか?
あ、いえ 大丈夫です 続けてください では続けます 選択肢を提供することが エージェンシーを生み出す最善策です インターフェイスは 人の行動を妨げてはいけません あらかじめ決められた道に 誘導するのではなく 体験の中に すぐに飛び込んでもらいましょう 自分のペースで何を探索するかを 決める自律性を与えましょう 自分の体験をコントロールする エージェンシーがあると関与度が高まります もちろん それは 人々がミスを犯すことも意味します または意図しない道に 迷い込むことも意味します そのときは 寛容さを提供しましょう 人々はいつも誤って 送信 変更 削除してしまいます 寛容さを提供するには どの操作も簡単に 取り消せるようにすることです また 取り返しのつかないことを しようとしているときは 本当にそうしたいのかを 再確認しましょう 場合によっては 中断が役立つこともあります ただし 中断は慎重に使いましょう 大きなミスをしようとしているときだけ 使うべきです あ、それはやりたくないです 少しお待ちください 続けましょう
大惨事を避けるのを助けると 人々はとても感謝します 寛容さはエージェンシーを支えます なぜなら人々に自信を与えるからです 何を試してもいつでも 回復できるという 自信を持ち 安全で 自由に探索できると感じさせます その通りです しかし 人々に自由を与えつつ ウェルビーイングも守らなければなりません これが責任につながります Appleプラットフォームでの責任とは 人々の最善の利益のために行動することです まずプライバシーから始まります プライバシーは人権です 人から要求できる情報は たくさんありますが それは関係を築く 最善の方法ではありません 例えばこんな人が あなたに近づいてきたとします ちょっとすみません はい? 電話番号を教えてください 何のためですか? とにかく必要なんです えっ、なぜですか? 電話番号をくれたら 教えてあげます 実際の生活でそんな人を 信頼するはずがありません それでもインターフェイスは 常にこういうことをします 起動した瞬間に パーミッションの要求を表示します アプリが実際に何をするか 理解するずっと前に または何のためかの説明なく 情報を求めます 責任あるデザインは 人々とその個人情報を尊重します 現実世界と同じように 責任あるインターフェイスは 個人データを求める適切な機会を待ちます 必要なものだけを求め データの目的について透明性を保ちます 製品を使う人を守ることが あなたの責任です 製品の影響を受ける人も含めて そのためプライバシーに加えて 人々を安全に守る必要があります インターフェイスにおいては 提供する機能を注意深く確認し いくつかの厳しい質問を 自分自身に問いかけましょう この機能はどのように 悪用される可能性がありますか? 誰がこれによって傷つきますか? どうすれば防げますか?
製品にAI機能を責任ある方法で 追加するとはどういうことかを考えましょう インテリジェントな機能を構築するとき モデルが何かを生成するかもしれないことを 考慮しなければなりません 予期しないものや不正確なものを レシピアプリのような 無害なものを考えてみましょう 誰かがアレルギーを登録すると モデルが食材を提案する 可能性を考慮しなければなりません それが重篤な反応を 引き起こすかもしれません それは現実の害を引き起こす可能性があり 偶然に任せるわけにはいきません 何が起こりうるかを現実的に考え セーフガードを追加してください プレビュー 確認 免責事項が役立ちます ただし 機能を完全に削除することも 検討してください 人々の安全へのリスクが 価値を上回る場合は 最終的に あなたの仕事は 人々の生活に実際の影響を与えます その責任を真剣に受け止めると 人々が信頼できる製品につながります 次のデザイン原則は 親しみやすさです 人々が既存の知識を デザインに持ち込む方法についてです 親しみやすさとは 人々が知っていることを活かすことです あなたのユーザーは 長年の経験を持ってやってきます 現実の世界がどのように機能するかを 理解しています そして他のインターフェイスから 慣習を学んでいます その既存の知識を活用することで デザインを直感的にできます そのための優れた方法の一つが メタファーの活用です メタファーは最初期のインターフェイスから 使われてきました 人々がソフトウェアに慣れるのを 助けるためです これは何をするのですか? 現実世界と同じです 不要なものはゴミ箱へ そして もし間違えたら ゴミ箱から取り出せます 現実世界と同じですね なるほど! メタファーのコツは 直接的すぎず抽象的すぎないことです インターフェイスではインスペクターが 選択されたものの詳細を表示します インスペクターのメタファーが 直接的すぎると 伝えようとしていることが 人々に伝わらない可能性があります 逆に抽象的すぎると 意図が伝わらないリスクがあります 良いメタファーは 人々が知っているものから引き出されます 動作を予測するのに役立ちます 正しく使われると メタファーはすぐに直感的に理解されます 間違って使われると メタファーは悪い意味で驚きを与えます ゴミ箱の話に戻りましょう ゴミ箱のアイコンを 削除以外の意味で使うと このシンボルが表す意味に対する 人々の親しみを裏切ることになります 他のソフトウェアにおける 削除アイコンを 勝手にアレンジしても同じことが言えます 人々はすぐに認識できません 一般的な操作には 一から作り直す必要はありません 人々がすでに慣れ親しんでいる メタファーをそのまま使いましょう そして人々の期待通りに動作することを 確認しましょう 親しみやすさは 一貫性からも生まれます 一貫性によって 人々は次に何が起きるかを予測できます 簡単に言うと 見た目が同じなら 同じようにふるまうべきです ボタンの1つが別の画面に 移動するとしたら 別のものはアクションを切り替え 別のものはモーダルを表示するとしたら このインターフェイスの動作を 理解するパターンがありません 一貫した動作は 人々のナビゲーションを助けます 次に何が起きどこに向かうかを 予測できるからです 一貫した配置も同様です Macでは 左上隅に移動することで いつでもウィンドウを閉じられます 常に全く同じ場所にあります 操作を見つけられるとき 画面やデバイスをまたいで 同じ場所にあると 作業が速くなります 考える必要がなくなります 親しみやすいものを作るとは どのメタファーやパターンをいつ使うかを 知ることです しかし親しみやすさは 同じ解決策の繰り返しを意味しません それが柔軟性につながります 柔軟なデザインは シンプルな真実を認識しています 人々がデザインを使う方法は それぞれ独自であるということです そのため 人々が置かれる さまざまな状況をサポートしましょう インターフェイスに柔軟性を加えることで 人々の実際の生活に 適応できるようになります 例えば 音楽を聴くことを考えてみましょう 誰かが音楽とやり取りする方法は 状況によって 完全に変わります 自宅でスピーカーを通して 音楽をコントロールしているかもしれません AirPodsとApple Watchで ランニング中かもしれません または運転中に ハンズフリー体験をしているかもしれません さまざまな状況に対応できる インターフェイスはより快適に感じられます より幅広いユーザーに対応できます その通り! 特定の状況に合わせてデザインすると 人々が何をしたいかに 注意を払っていることが伝わります iPhoneを取り出すとき 速くタッチベースのやり取りを求めます Macでは 深いワークフローと 精密なポインター操作を期待します すべてのデバイスには その固有の特徴を活かす 解決策が必要です もちろん ハードウェアは話の半分に過ぎません もう半分はそれを使う人です デザインを柔軟にするもう一つの方法は 人々が持つ幅広い能力に 対応することです
あなたのユーザーが誰なのかを 探求しましょう 何歳ですか? どんな言語を話しますか? プロですか?それとも初心者ですか? アクセシビリティ機能に 依存していますか? 最初からすべてのタイプの人に 対応できないかもしれませんが 体験をより包括的にする方法を 検討し始めることはできます 多くの場合 柔軟性を加えることは 全員を満足させる単一のデザイン解決策には 辿り着けないことを意味します 最良の選択肢は 人々が体験を カスタマイズできるようにすることです 自分の好みに合わせて コントロールを例にとりましょう すべての人に完全に合う 単一のレイアウトを見つけるのは難しいです 誰にでも完璧に機能する そのため 人々に並び替えの柔軟性を 提供しましょう 個人のワークフローをサポートするために または使わないコントロールを 非表示にできるようにしましょう 柔軟性への投資ですが それだけの価値があります 彼らを念頭に置いてデザインしたことが 人々に伝わるからです 次はシンプルさです シンプルさとは 不要なものを取り除くことです デザインの本来の目的を 輝かせるためです シンプルとは 最小限を意味するわけではありません すべての機能を 1つの場所に埋め込んでしまうと 見た目がミニマルになるかもしれませんが シンプルにはなりません シンプルなデザインは 摩擦がなく直感的です 人々は苦労せずに 必要なものを見つけられます 簡潔で明確にすることで それを実現できます 簡潔なインターフェイスは 平易な言葉を使います 専門用語を取り除き 自然に語りかけます
冗長さを避け 要点を直接伝えます
簡潔なインターフェイスは 人々の時間も尊重します 物事を達成するための ステップ数を減らします 明確にすることでも シンプルさを実現できます 明確なデザインは その役割を完璧に伝えます 明確さは階層構造で築かれます 順序 間隔 コントラストを使って 最も重要なものへ導きます 階層構造が強固なとき 画面上で最も重要な項目は 常に最も分かりやすいものになります 明確なインターフェイスは 人々の疑問に答えます 何に注目すべきか? 何と操作できるか? どのように操作するか?
シンプルなインターフェイスでは すべての要素が存在理由を持ちます デザインを見直して情報を 絞り込める箇所を特定しましょう 本質まで 複雑なデータをグラフィックで 表現することはできますか?
情報を要約する 機会はありますか 人々が重要なことに 集中できるように すべての要素がポイントを 明確にするようにしましょう インターフェイスをシンプルにするには 要素を追加することもある場合があります ビデオの再生/一時停止コントロールを 見てみましょう シンプルで親しみやすいです 視聴中のものを一時停止できます そして後で戻ってきたとき より多くの文脈が必要になります このコントロールは現在位置と 残り時間を明確にします シンプルとはコンテキストと情報を 追加することを意味する場合もあります 人々が十分な情報に基づいた 判断を下せるようにするためです
シンプルなインターフェイスは 人々がそこにいる理由をサポートします シンプルさに辿り着いたと 分かるのは ちょうど十分なとき!
次の原則は 持っているものを 完璧に実行することです クラフトとは細部への注意です それはあなたが提供する体験を 本当に大切にしていることを伝えます 安物の製品がどんな感じかは 誰もが知っています ちゃんと閉まらない ガタついたドア 洗うとほつれるシャツ 誰かが手を抜いたことは すぐに分かります ソフトウェアも同じです 急いで作られたインターフェイスを使うと どんな感じかは誰もが知っています ボタンをタップしても 何か起きるのを待つだけです スクロールがぎこちなく アイコンがずれています 画面を回転させると レイアウトが崩れてしまいます 壊れやすい感じがします ソフトウェアが雑に作られた感じがすると その製品を使って得られる結果の 品質を疑うようになります しかし丁寧に作り込まれたデザインは 全く逆の効果をもたらします 自信を鼓舞します 精巧に作られたデザインの 実際の要素とは何でしょうか? 現実世界と同じように 高品質な素材から始まります
デバイス全体で美しく見える 優れたフォント ライトとダーク環境全体でシームレスに 適応する思慮深い色彩 明確なグラフィックとアイコノグラフィ 流れるようなアニメーションが 即座に自然なフィードバックを提供します 信頼性が高く安全なSDKの 堅固な基盤の上に構築されています これらが重要な細部です しかしそのレベルの品質に 到達するには時間が必要です クラフトは反復から生まれます インターフェイスのあらゆる部分が 美しく機能するようにすることです そしてこれは継続的なプロセスです クラフトの大部分は デザインを時間をかけてどう維持するかです 優れたデザインは長持ちします だから進化し続けましょう 新しい機能やハードウェアが 登場したとき それが体験にとって意味があるかどうかを 探求しましょう 製品がこれらの変化とともに 進化すると 人々はサポートされ 報われたと感じます クラフトとは細部への 妥協なきこだわりです それらの細部を正しく仕上げると 人々はあなたの熱意が伝わります 最後はデライトです デライトは定義するのが 難しいものの一つです しかし体験するとすぐに 認識できるものです 喜びをもたらすインターフェイスは 満足感があり 豊かさをもたらし 真の感情的なつながりを生み出します そのつながりは体験が 人間らしく感じられるときに始まります デザインに喜びをもたらす方法は 紙吹雪を加えることではありません プロセスの最後に 装飾を後付けすることでもありません 喜びをもたらすインターフェイスを作るには ユーザーに感じてほしい感情を 特定することです リラックス 自信 興奮 そしてデザインを通じてそれを 強化する機会を見つけましょう デライトとは製品に込めた 思いやりの総和です すべてのデザイン原則を 正しく実行した自然な結果です 意図と思いやりをもって デザインすると 人々に行動するエージェンシーと 探索する安心感を与え 親しみやすいパターンの安心感と 自分のものにする能力を与え 本当に喜びをもたらす 体験を作り出すことができます それではあなたの番です! ヒューマンインターフェイス ガイドライン Appleプラットフォームのデザインを 始めるための最良のリソースです 新しいデザイン原則ページを追加しました のでさらに詳しく学べます これらの原則を使って デザインを導いてください そして人々が本当に愛するものを 作りましょう
-
-
- 0:00 - Intro
Design is more than aesthetics or behavior: it’s making something with intention. Every feature asks for a person’s time, attention, and trust, so choosing what not to build is just as important as what you do build.
- 1:08 - Purpose
Purpose means designing experiences that genuinely serve people: ones that respect and adapt to their lives, are clear and considered, and at their best, a true joy to use. Before writing a line of code, ask whether what you’re making has real purpose and delivers something people will truly value.
- 1:52 - Agency
Agency means putting people in control. Let them explore at their own pace, avoid forcing them down predetermined paths, and build in forgiveness: easy undo and confirmation for destructive actions, so they feel confident and free to try things.
- 3:38 - Responsibility
Acting responsibly means respecting privacy as a human right, asking only for what’s necessary, and anticipating how features could cause harm. Safeguard people from bad outcomes, especially with AI, and remove features when the risks outweigh the value.
- 6:04 - Familiarity
Familiarity lets people apply existing knowledge to your design. Use metaphors that aren’t too literal or abstract, follow established conventions for common actions, and keep behavior consistent: things that look the same should work the same.
- 8:52 - Flexibility
A flexible design adapts to the many different contexts, devices, and abilities of its users. Design for each platform’s strengths, consider the full range of your audience, and let people personalize their experience when no single solution fits everyone.
- 11:13 - Simplicity
Simplicity isn’t minimalism: it’s removing friction. Concise language, strong visual hierarchy, and clear affordances help people find what they need without effort. Every element should earn its place, and sometimes adding context makes an interface simpler.
- 13:42 - Craft
Craft is the uncompromising attention to detail that builds trust. Beautiful typography, responsive animations, solid performance, and a commitment to iteration show people you care. Great design has longevity: keep evolving it as platforms and people’s needs change.
- 15:47 - Delight
Delight isn’t confetti: it’s the natural result of getting everything else right. Identify the emotion you want people to feel, then reinforce it through your design. When you combine all these principles with genuine care, you create something people truly love.