デザイン指針：原則・パターン・ヒューリスティック・チーム憲章
デザインチームは、一貫性がありユーザブルな体験を協働して創り出すため、原則・パターン・ヒューリスティック・チーム憲章を組み合わせて活用する。
デザインチームは、さまざまな指針を用いることで、一貫性を保ち、ユーザビリティを推し進め、業務の効率を高めることができる。デザイン指針にはいくつかの種類があり、その違いを理解することは、デザインへの体系的なアプローチの構築に役立つ。
デザイン指針の種類
この記事では4種類のデザイン指針を取り上げる。そのいずれもデザインプロセスにおいて固有の役割を担う：
- デザイン原則：デザイン上の意思決定を導く理念
- ユーザビリティヒューリスティック：調査に基づくベストプラクティス
- デザインパターン：よくあるデザイン課題に対する再利用可能な解決策
- チーム憲章：チームがどのように協働するかについての合意事項
4種類すべてのデザイン指針をプロセスで活用するのが効果的である。
デザイン原則：デザイン上の意思決定を導く理念
まず、デザイン指針の中でも最も基盤となる「デザイン原則」から始めよう。この上位の原則は、チームがデザイン上の意思決定にどう臨むかを方向づける。
デザイン原則とは、プロダクトやサービスがユーザーに提供すべき最も重要な目標を記述する価値観の表明であり、デザイン上の意思決定の枠組みとして用いられる。
デザイン原則がチームを支援する方法
デザイン原則はチームの方向性を揃え、デザイン選択を評価する際の一貫性を確保する。デザイン原則はチームを次のように支援する：
- デザインを共通のビジョンに合わせる
- デザイン上の意思決定を導く
- プロダクトやチーム間の一貫性を確保する
- デザインに関する議論を解決する
効果的なデザイン原則の特徴
デザイン原則が有用であるためには、次のような特徴を備えている必要がある：
- 覚えやすく特徴的であること：容易に思い出して適用できる
- ブランド価値を反映していること：企業のブランドアイデンティティやユーザーの期待に沿っている
- 汎用的でありながら実践可能であること：さまざまな文脈に適用できる幅を持ちつつ、意思決定の助けになる程度に具体的である
この表は、デザイン原則の例を示したものである。
| デザイン原則 | 説明 |
|---|---|
| 行動に至るまでの時間を短縮する | 不要なステップを最小限にし、効率的なワークフローを提示することで、ユーザーがタスクを早く完了できるようにする。 |
| アクセシビリティを優先する | インクルーシブなデザインに一貫して取り組む。 |
| ビジネス上の制約よりもユーザーのニーズを優先する | デザイン上の判断が割れたときの意思決定を助ける。 |
| 新規性よりも明快さを重視する | 気の利いた表現よりも明快に伝えることを重視する。 |
| 失敗を想定してデザインする | エッジケースやエラー、エンプティステートを想定しておく。 |
ユーザビリティヒューリスティック：調査に基づくベストプラクティス
デザイン原則がチームがどのように意思決定するかを反映するものであるのに対し、ユーザビリティヒューリスティックはインタフェースの使いやすさを評価するための、調査に裏づけられたベストプラクティスである。
ユーザビリティヒューリスティックとは、デザイン上の意思決定を導くための幅広い経験則である。ユーザビリティを評価し、デザイン上の問題を特定するために用いることができる。
ヒューリスティックの例：
デザイン原則がある企業固有のものであるのに対し、ヒューリスティックはあらゆるインタフェースに適用可能な普遍的なガイドラインである。ヒューリスティックをデザインレビューに取り入れることで、チームはデザインプロセスの初期段階で一般的なユーザビリティの問題を発見することができる。
ユーザビリティヒューリスティックがチームを支援する方法
チームはユーザビリティヒューリスティックを活用して次のことができる：
- デザインを評価するための客観的な枠組みを提供する
- ユーザビリティの問題を議論するための共通語彙を作成する
- 基本的なユーザビリティの概念についてチームメンバーを教育する
- テスト前に一般的なユーザビリティの問題を確認する
デザインパターン：よくあるデザイン課題に対する再利用可能な解決策
ヒューリスティックがデザインにおいて「何が」問題なのかを特定する助けになるのに対し、デザインパターンはデザイン上の課題を解決するのに役立つ。
デザインパターンとは、よくあるデザイン課題に対する標準化された再利用可能な解決策である。あらかじめ定義されたUIコンポーネントを提供し、デザイナーがよくある状況に対処できるようにする。
デザインパターンの例：
| デザインパターン | 効果 |
|---|---|
| ページネーション | コンテンツを扱いやすいセクションに分割し、ユーザーが圧倒されないようにする。 |
| パンくずリスト | ユーザーが階層内で自分の位置を把握したり、前の階層に戻れるようにする。 |
| フォームバリデーション | ユーザー入力に対して即時のフィードバックを提供し、エラーを防ぎ、修正を促す。 |
| アコーディオン | ユーザーがコンテンツを展開・折りたたみできるようにし、ページの視覚的な煩雑さを減らす。 |
| 進捗インジケータ | ユーザーにプロセスの進行度を示して、予測を助け、不安を軽減する。 |
デザイン原則とは異なり、デザインパターンは具体的な解決策を提供し、より実践的な性質を持つ。デザインパターンは、コードスニペットやシステム内での使用ガイドラインと共に、デザインシステムに含まれていることが多い。
デザインパターンがチームを支援する方法
デザインパターンは：
- プロダクト内の異なる部分（あるいは複数のプロダクト）に一貫性をもたらし、ユーザビリティを向上させる
- デザインと開発にかかる時間を短縮する
効果的なデザインパターンの特徴
効果的なデザインパターンには次の要素を含めるべきである：
- 明確なドキュメンテーション：各パターンの使用のタイミングと方法の説明
- 具体的な例：実際のユースケースの紹介
- バリエーションとカスタマイズに関する指針：文脈や制約に応じて柔軟に調整できることの紹介
チーム憲章：チームがどのように協働するかについての合意事項
ここまでに取り上げた指針はインタフェースに焦点を当てていたが、質の高いプロダクトやサービスをデザインする上では、チームがどのように協働するかも同じくらい重要だ。チーム憲章はチームのダイナミクス（関係性・相互作用）に直接焦点を当てる。
チーム憲章とは、効率を向上させ、コラボレーションを促進するために、チームの目的・役割・目標を明確にするものである。
デザイン原則やデザインパターンとは異なり、チーム憲章はプロダクトデザインではなくチームのコラボレーションに焦点を当てる。チーム憲章では、チームの価値観・ワークフロー・意思決定のやり方を定義する。
チーム憲章には、たとえば「不確実性が高いときは調査を優先する」といった合意事項が含まれることがある。これによって、特にリスクが高いときに、デザインや開発に飛びつく前に調査に時間を投資すべきタイミングをチームが把握できるようになる。
また、「意見の相違は個人の好みではなく、ユーザーの目標に立ち返って解決する」というのも有益な合意事項だ。この合意事項は、議論をユーザーニーズと客観的な証拠に回帰させることで、主観的なデザイン論争を鎮めるのに役立つ。
チーム憲章におけるその他の合意事項の例：
- 原則としてコミュニケーションは非同期で行う
- フィードバックは、敬意を持って率直に与え、受け取る
- 簡単な質問にはSlackを主なツールとし、重要な決定事項はNotionに記録する
チーム憲章がチームを支援する方法
チーム憲章を設けることで、チームは次のことが可能になる：
- 新しいチームメンバーをスムーズに迎え入れる
- プロセスが破綻したときの参照点を得る
- 共有された優先事項に沿ってチームの方向性を揃える
- 意思決定の方法に一貫性を持たせる
効果的なチーム憲章の特徴
強力なチーム憲章は次のようなものである：
- チームによって共創される：チーム全員が価値観の形成に意見を出し合っている
- チームの文脈に特化している：チームの課題や目的に合わせて調整されている
- 定期的に更新されている：チームのニーズの変化に応じて変更される
- 実践可能である：日々の業務に組み込まれている
概念同士の関係：デザイン指針の階層
これら4種類のデザイン指針は、競合する概念ではなく補完的なものとしてとらえるべきである。チームの土台となる合意事項から具体的な実装までをつなぐ階層として考えるとよい。
UX成熟度の高い企業は、これら4つの概念をすべてワークフローに組み込んでいる。チーム憲章は円滑なコラボレーションを実現し、デザイン原則は共通のビジョンを示す。ユーザビリティヒューリスティックはデザインを評価する助けとなり、デザインパターンはすぐに使える解決策を提供する。
それぞれの間には矛盾しない明確なつながりがある。各層が互いを補強し合うことで、一体的なシステムをかたちづくっているのである。
| チーム憲章 | デザイン原則 | ユーザビリティヒューリスティック | デザインパターン | |
|---|---|---|---|---|
| 主要な焦点 | チームのコラボレーションと価値観 | プロダクトの価値と目標 | ユーザビリティのベストプラクティス | よくあるUI問題に対する解決策 |
| 範囲 | 組織的 | 戦略的 | 汎用的 | 戦術的 |
| ユースケース | チームの働き方や意思決定、協働方法を定義する | デザイン上の意思決定の枠組みを定め、ブランドとの整合性を確保する | インタフェースのユーザビリティを評価する | 繰り返し発生するデザイン課題を解決する |
| アウトプット | 共有文書や合意事項 | バリューステートメント（価値観の表明） | チェックリストやヒューリスティックのリスト | コンポーネントのドキュメンテーション |
結論
デザイン指針は万能の解決策ではない。それは階層化されたシステムであり、チームの働き方や成果物に構造をもたらすものだ。チームは、それぞれの指針が果たす固有の役割を理解することで、価値のすりあわせ、ユーザビリティの評価、インタフェース問題の解決、コラボレーションの推進といった状況に応じて、適切な指針を適用できる。これらの指針を組み合わせて活用することで、意思決定、一貫性、イノベーションのための首尾一貫した基盤が築かれ、最終的には体験を改善し、チームを強化することができる。
