【翻訳】UI/UXデザインの代表的な用語73選

ユーザー・エクスペリエンス・デザインには、解読が困難な専門用語がたくさんある。この個人的なプロジェクトは、UXの用語とその定義のライブラリーを増やしていくものです。解説してほしい用語があれば、コメント欄にご記入ください。

  1. A/Bテスト
    2つのバリアント(「A」と「B」)による無作為化実験からなる調査方法。メインテストの段階や発売後に使用することができるが、正確な結果を得るためには、大きなサンプルサイズが必要。
  2. アクセシビリティ
    障害者が製品やサービスを効果的に使用できるようにするための一連の原則。永久的、一時的、状況的な障害を含み、すべてのユーザーにとってより良い体験を保証するもの。一般的には、タイポグラフィのカラーコントラストがWCAG2.1基準を満たしていること、ビデオやオーディオコンテンツにキャプションを提供することなどが挙げられる。
  3. アコーディオン
    縦に積み重ねられたアイテムリストで構成されるUIコンポーネント。一度に1つの項目しか展開されないという点では、タブ付きナビゲーションと同様の機能。
  4. アダプティブ
    アダプティブユーザーインターフェース(AUI)は、特定のスクリーンサイズやデバイスタイプに合わせて作成されたデザインソリューションの集合体。使用されているデバイスを自動的に検出し、それに応じて読み込むべきインターフェースのバージョンを選択する。レスポンシブ・ユーザーインターフェースの一種。
  5. アフォーダンス
    ユーザーがUI要素とどのように相互作用できるかを視覚的に示すデザインパターン。デジタル・インターフェースで最も一般的な例は、クリックするとアクションを起こすことができることを示すボタンの状態である。
  6. ブレッドクラム
    パンくずリストとも呼ばれ、ユーザーがサイト内でどこにいるのかを示す二次的なナビゲーションシステムである。グリム童話ヘンゼルとグレーテルがパンのくずを頼りに家路をたどったように、Webサイト利用者はパンくずを手がかりにサイトの構造を理解し、トップページにたどり着くことができる。
  7. ブレークポイント
    レスポンシブデザインにおいて、レイアウトや機能が変化する画面サイズの値をブレイクポイントという。例えば、モバイルとデスクトップのレイアウトが切り替わるのは、600px前後であることが多い。
  8. ボタン
    アクションを引き起こすインタラクティブなUI要素。ラベル、アイコンのいずれか、または両方が、どのような動作を引き起こすかを明確に伝える必要がある。一つのインターフェースに一次、二次、三次のボタンがあり、これらは共通のタスクフローを示す道標の役割を果たすことが多い。アフォーダンス向上のため、ボタンには、通常、ホバー、押された、無効などのレスポンシブな状態を設定することが必要。
  9. カードソート
    ユーザーリサーチの手法のひとつで、参加者にいくつかのカードを、直感的な連想に基づいて、あらかじめ定義された、または新しいカテゴリーに分類してもらうもの。このフォークソノミーは、情報アーキテクチャ、ナビゲーション、タスクフローなどの設計に利用することができる。
  10. カード
    関連する情報を、トランプのようなフレキシブルなサイズの容器にまとめたUIコンポーネント。画像、テキスト、ボタン、タグなど複数のUI要素を含むことができるが、共有機能を持つ1つのユニットとして機能する必要がある。例えば、カードがサイトの別のエリアにリンクしている場合、カード上のどこかをクリックすると、そこにリダイレクトされる必要がある。
  11. ルーセル
    複数のコンテンツが回転して表示され、共有スペースを占有することができるUIコンポーネント。カルーセルは、ユーザーがスクロールすることなく、アルバム全体をスワイプして見ることができるイメージギャラリーに最もよく使用される。
  12. チェックボックス
    ユーザーが「はい」「いいえ」のような二者択一を行うことができるインタラクティブなUI要素。ラジオボタンと異なり、チェックボックスのリストでは、各選択肢は独立しており、ユーザーは1つ、複数、またはすべての選択肢を選択することができる。
  13. CTAボタン
    コールトゥアクション(CTA)ボタンは、ユーザーが取るべき主要なアクションを引き起こすUI要素。一般的なCTAの例としては、「購入」、「連絡先」、「購読」、「ログイン」などがある。
  14. コンテナ
    ユーザーインターフェースの構成要素で、1つまたは複数のUI要素を保持し、そのサイズと応答性のプロパティを制御する。例えば、カードのグリッドを1つのコンテナに入れ、あらかじめサイズ(絶対または相対)、マージン、パディングを定義しておくと、1つの要素として整列、拡大縮小することができる。
  15. ダークパターン
    インターフェイスデザインにおいて、意図的にユーザーを騙して意図しないことをさせる手法のこと。多くのダークパターンは、ヤコブの法則を利用し、ユーザーがユーザーインターフェースデザインにおける一般的なパターンに慣れていることを利用している。よくある例としては、ユーザーを騙してニュースレターを購読させるために、利用規約に同意していると思わせることが挙げられる。やってはいけない。
  16. デザインシステム
    任意のインターフェースのUI要素、構成要素、指針をまとめたライブラリ。デザインシステムの目的は、一貫性を維持し、新しい機能が追加されたときに設計と開発のプロセスをスピードアップすること。
  17. デザイン思考
    創造的な問題解決のために広く使われている手法で、5つの段階から構成されている。
    1. 共感する
    2. 定義する
    3. アイデア出し
    4. プロトタイプ
    5. テスト
  18. ダイアリースタディ
    参加者に日記を付けてもらい、一定期間、日々の体験を振り返ってもらうことで、インサイトを収集する定性的なユーザー調査手法。
  19. ドロップダウンリスト
    ピッカーの最も一般的な形式で、ユーザーが事前に定義されたリストから1つのオプションを選択できるようにするインタラクティブなUI要素。その機能は、リストボックスと似ているが、1つだけ重要な違いがある。
  20. アイトラッキング
    ユーザーが今見ているものを計測し、記録するユーザー調査の手法。専用のツールを使用する必要があり、通常、ページ上の情報の視覚的階層を評価するのに役立つヒートマップの形で結果が表示される。
  21. 忠実度
    ワイヤーフレームやプロトタイプが、最終的なインターフェースのルック&フィールにどれだけ近いかを示すために使用されるプロパティ。低忠実度のワイヤーフレームは、レイアウトを紙とペンで描いたスケッチのような基本的なものだが、高忠実度のプロトタイプは、最終製品のスタイル処理と少なくとも一部のインタラクティブな特性を備えている。
  22. フラットデザイン
    ミニマリストのスタイル、鮮やかな色彩、二次元のUI要素を特徴とするデザイントレンド。そのモダンな外観はしばしば称賛され、遊びのなさは批判される。
  23. 折りたたみ
    ユーザーがサイトを開いたときにすぐに目に入る、インターフェースの上部領域を区切る線(above the fold)。コール・トゥ・アクションを含むことが多く、サイトの目的を伝え、さらなる探索を促すために使用される。
  24. フォーム
    ユーザーから情報を収集するためのインタラクティブなUI要素。一般的には、テキストボックス、ドロップダウンリスト、チェックボックスラジオボタン、その他のインタラクティブな要素で構成される。
  25. ゲーミフィケーション
    ユーザーのエンゲージメントを高めるために、競争や報酬などのゲームの原理を他の製品に適用すること。
  26. ゲシュタルトの原則
    類似性、継続性、閉鎖性、近接性、図または地、および対称性と順序に基づいて、人間の心が要素間の関係を認識する方法を説明する一連の視覚的原則。
  27. グレースフルデグラデーション
    デジタルインターフェースのほとんどが使用できなくなった場合でも、少なくともその基本的な機能は維持できるように設計・構築する手法のこと。例えば、希望のフォントが表示されない場合、システムは代替手段を提供する。つまり、ユーザー体験は中断されるかもしれないが、完全にダメにはならない。
  28. グリッドシステム
    デザインシステムの一部であるグリッドは、ページ上のUI要素の配置を決定するレイアウト制約。レスポンシブレイアウトやアダプティブレイアウトの原則にしたがって、グリッドを拡張することができる。
  29. ヒートマップ
    UXにおいて、サイト上のアクティビティのレベルを視覚的に表現したもの。赤(ホット)が最も注目され、青(コールド)が最も注目されないというように、一般的に温度差を表すカラースケールを使用する。ヒートマップは、アイトラッキングの一環として作成されることが多い。
  30. ホバー状態
    ユーザーがマウスカーソルを乗せると発生する、インタラクティブなUI要素の応答性の高い状態。アフォーダンスが向上しますが、タッチスクリーン端末では使用できない。
  31. アイコン
    オブジェクト、アクション、またはアイデアを簡略化して視覚的に表現したもの。インタラクティブなUI要素として、アイコンは通常、ボタン、ハイパーリンク、メニューに表示され、ユーザーがインターフェースを操作するための視覚的な手がかりとして機能する。
  32. 情報アーキテクチャ(IA)
    Webサイトやモバイルアプリの情報の構造や構成を定義する図。ワイヤーフレームや情報提供のための設計図として使用されるが、サイトマップとは異なる。
  33. ヤコブの法則
    ユーザーはほとんどの時間を他のサイトで過ごしているため、あなたのサイトが、彼らがすでに知っている他のすべてのサイトと同じように機能することを好む」と主張するUXの原則。これは、技術革新を妨げるものではなく、ユーザーの認知負荷を軽減するために、確立されたUXの原則を優先させることの重要性を強調するもの。
  34. リストボックス
    あらかじめ定義された値のリストから、ユーザーが1つまたは複数のオプションを選択できるようにするインタラクティブなUI要素。機能はドロップダウンに似ていますが、リストボックスでは最初の5~7個の選択肢がプレビューされ、通常は複数の値を選択することができる。
  35. メンタルモデル
    UXデザインの文脈では、製品の機能に対するユーザーの期待値を表する。現実の機能と期待される機能が一致するほど、使いやすいインターフェイスとなる。
  36. メニュー
    カテゴリ、機能、コマンドのリストで構成されるUI要素。標準的な水平メニューは、サイトナビゲーションの最も一般的なソリューションだが、多くの代替案がある。複雑な情報アーキテクチャを持つサイトでは、一般的にメガメニューを使用して、カテゴリの全リストを表示する。モバイルサイトでは、ハンバーガー、ケバブ、ホットドッグなどのアイコンや、イチゴ、キャンディーボックスなどのベジタブルなアイコンでメニューを隠し、スペースを節約することができる。
  37. マイクロコピー
    UIの一部を構成するすべてのテキスト要素を表す用語。マイクロコピーの一般的な例としては、ラベル、ボタン、ツールチップ、エラーメッセージやHTTPレスポンスのステータスコード(404ページなど)、デバイスにクッキーをインストールするよう求めるポップアップなどがある。
  38. モックアップ
    よく誤用される言葉だが、モックアップとは、製品を静的に表現したもの。プロトタイプとは異なり、モックアップは非インタラクティブだが、ある種のユーザビリティ・テストに使用することができる。
  39. モーダル
    モーダルウィンドウ、ダイアログ、ポップアップなどは、メインウィンドウの上に配置され、一時的にメインウィンドウを表示しないようにするUIコンポーネント。モーダルウィンドウは、直線的なユーザーフローを中断させ、ユーザーがメインアプリケーションのウィンドウで操作を続ける前に、承諾または拒否する必要のある情報を表示する。一般的な例としては、銀行アプリケーションのタイムアウト警告メッセージや、不可逆的なアクションを実行する前の確認要求などがある。
  40. ナビゲーション
    インターフェイスの異なる部分間の移動を容易にするUI要素。複雑な情報アーキテクチャを持つサイトでは、ユーザーがさまざまなレベル間を「ジャンプ」できるように、階層的なナビゲーションが用意されていることがよくある。ナビゲーションは、メニューで表現するのが最も一般的だが、パンくず、UIカード、ジェスチャーナビゲーション(スワイプ)などもその一例。
  41. オンボーディング
    新しい製品やそれに関連するユーザーフローを人々に紹介するプロセス。一般的には、サインアッププロセス、ガイド付き導入、設定やプリファレンスの調整などが含まれる。
  42. ページネーション
    サイトのナビゲーションに使用されるインタラクティブなUI要素で、コンテンツをページに分割し、ユーザーがページ間をスキップできるようにするもの。一般的には、スクロールが困難な長いリストなどに使用される。1ページあたりの項目数は、ページのサイズや機能によって異なりますが、デスクトップでは50項目以内、モバイルでは20~30項目以内が目安。
  43. ペルソナ
    ユーザー調査から得られた洞察を組み合わせて、ターゲットとするユーザーの典型的な姿を表したもの。ペルソナは架空のものだが、実際のユーザーに関する情報を使って構築される。
  44. ピッカー
    ユーザーが事前に定義されたリストからオプションを選択することができるインタラクティブなUI要素。ピッカーの最も一般的な例はドロップダウンリストだが、日付、時間、色など複雑で高度に概念的な入力値には、他のバリエーションが適している場合がある。
  45. プロトタイプ
    最終製品のインタラクティブな予備モデルで、発売前のユーザビリティテストに使用される。低忠実度のワイヤーフレームや高忠実度のモックアップから作成できるが、エンジニアや開発者の意見を必要としない迅速なイテレーションをサポートする必要がある。静的なモックアップとは異なり、インタラクティブプロトタイプでは、機能をテストすることができ、美しさよりも使いやすさを優先させる必要がある。
  46. プログレスバー
    ファイル転送やダウンロードなど、長時間のコンピュータ操作の進捗を視覚化するUI要素。パーセントやステップで表示することができる(ウィザードインターフェイスではステッププログレスバーがよく使われる)。
  47. ラジオボタン
    相互に排他的な選択肢の事前定義されたセットから、ユーザーが1つの項目を選択することができるインタラクティブなUI要素。チェックボックスリストとは異なり、ラジオボタンは複数の回答を選択することはできない。
  48. レスポンシブ
    レスポンシブ・ユーザー・インターフェイス(RUI)のレイアウトは、閲覧するデバイスに合わせて調整される。要素の並べ替え、伸縮、外観の変更(よくある例として、モバイルデバイスでデスクトップのナビゲーションを置き換えるハンバーガーメニュー)が行われるが、ページ上のコンテンツが変わることはない。複数のデザインソリューションで構成されるアダプティブUIとは異なり、レスポンシブインターフェースは、さまざまなデバイスタイプに最適化される単一のデザイン。
  49. スライダー
    ユーザーが特定の値や複数の値を選択できるインタラクティブなUI要素。一般的には、期間、価格帯、評価などを指定するために使用される。
  50. スタイルシート
    スタイルガイドとも呼ばれ、特定のインターフェースに関するすべてのスタイル、ルール、原則をまとめたもの。通常、色やタイポグラフィの使用方法、すべてのUI要素とその応答状態の例などが含まれ、より幅広いデザインシステムの一部を形成している。スタイルシートは、製品のルック&フィールの一貫性を確保するための基準点。
  51. サイトマップ
    Webサイトやアプリのすべてのページの一覧で、目標、コンテンツ、機能に関する補足説明を含むこともある。情報アーキテクチャから情報を得て、ナビゲーションに反映させる必要がある。
  52. スキューモーフィズム
    UIデザインにおいて、現実のインターフェイスから非機能的な手がかりを継承してインターフェイスの要素を作成すること。例えば、ボタンに影をつけ、2次元のインターフェイスに奥行き感を出すことがよくある。フラットデザインとは対極にあるもので、うまくいくとアフォーダンスが向上する。
  53. ストーリーボード
    ユーザー体験を視覚的に表現したもので、コミックストリップから形式を借用している。ストーリーボードは、製品がどのような状況で使用されるかを理解するのに役立ちます。ユーザーフローやユーザージャーニーマップに反映させる必要がある。
  54. タブ
    サイトのナビゲーションに使用される、インタラクティブなUI要素。アコーディオンやカルーセルに似た機能で、複数のコンテンツをページ上の共有スペースに配置することができる。スキューモーフィズムの原則に基づき、その外観と機能は、ファイリングシステムのタブ付き仕切りという実作を参照している。
  55. タグ
    アイテムにカテゴリを割り当てるために使用されるUI要素。キーワードはコンテンツから取得されるのに対し、タグは手動で割り当てられ、あらゆる種類のカテゴリーを表すことができる。
  56. スクフロ
    スクフローとは、あるタスクを達成するためにユーザーが取るステップを視覚的に表現したものです(通常は線形ダイアグラムの形式をとります)。ユーザーストーリーを使用して、主要なタスクを特定する必要がある。結果として得られるタスクフローは、より広いユーザーフロー図の一部を形成することになる。
  57. トグル
    スイッチとも呼ばれ、設定のオン/オフを切り替えることができるインタラクティブなUI要素。
  58. ツールチップ
    デフォルトでは非表示になっており、ユーザーがアイコンやリンクをクリックすると表示されるメッセージ。ツールチップは、フォームに入力する際のヒントなど、少数のユーザーしか必要としない非本質的な情報に使用する必要がある。
  59. UI(ユーザーインターフェース
    広義には、ユーザーインターフェースは、人間とコンピュータの相互作用が発生する領域であり、デジタル機器の画面上に表示されるほとんどすべてのものを意味する。
  60. UIコンポーネント
    共通の機能を持ちながら、個別の機能を持つUI要素のグループ。一般的なUIコンポーネントには、カード、モーダル、カルーセルアコーディオンなどがある。カードは、画像、テキスト、ボタン、タグで構成され、これらはすべて異なる機能を持つが、例えば、1つのブログエントリーを表し、リンクするというように、1つの機能を共有する。
  61. UIデザイン
    機械やソフトウェアのユーザーインターフェイスをデザインすること。UXデザインと密接に関連し、UIデザインは通常、調査、戦略的計画、ユーザージャーニーマッピングワイヤーフレーム作成のほとんどが終わった時点で開始される。主にインターフェースのルック&フィールとそのインタラクティブな機能に関係しますが、すべてのUXデザインプロセスと同じユーザビリティ原則とアクセシビリティ標準を遵守している。
  62. UI要素
    ユーザーインターフェースの機能的な構成要素。一般的なUI要素として、ナビゲーション、検索、ボタン、パンくず、ツールチップ、トグル、チェックボックスラジオボタン、その他多くのものがある。例えば、ボタンには、テキストラベル、アイコン、枠の有無にかかわらずコンテナが含まれるが、これらの部品が連携して1つの機能を果たす必要がある。
  63. ユーザビリティ・テスト
    ユーザーテスト、ユーザビリティスタディとも呼ばれ、製品の使いやすさや楽しさを評価するユーザー調査の手法。ユーザーインターフェースとその機能に主眼を置くため、ユーザビリティ・テストは通常、設計プロセスの後期に行われ、忠実度の高いプロトタイプや、完全に開発されたインターフェースを使用することもある。ユーザビリティ・テストは、インタビューの形式をとることもありますが、ユーザー・インタビューとは異なり、その主眼は製品であり、ユーザーではない。
  64. ユーザーフロー
    ユーザーがインターフェイスの中で目的を達成するために踏む一連のステップを視覚化したフローチャート情報アーキテクチャ図やサイトマップと組み合わせて使用することが多く、ユーザーがどのようにデザインを進めていくかを可視化し、ギャップや行き詰まりなどの問題を特定するためのプランニングツール。
  65. ユーザーインタビュー
    ユーザーリサーチの手法のひとつで、リサーチャーがユーザー(実在の人物またはターゲット)に質問を投げかけ、デザインプロセスに反映させるもの。ユーザビリティテストとは異なり、ユーザーインタビューは、製品ではなく個人に焦点を当てます。そのため、通常、デザインプロセスの初期段階で実施され、ペルソナ、ストーリーボード、ユーザーストーリー、ユーザー・ジャーニー・マップなどに反映される。
  66. ユーザージャーニーマップ
    ユーザーフローの主要なステップと、ユーザーのモチベーション、感情状態、ペインポイントなどの情報を追加したマップ。ユーザージャーニーマップは、ユーザーと製品の関係を視覚化し、製品の弱点や改善の機会を特定するのに役立ちます。
  67. ユーザーリサーチ
    代表的なユーザーに対してテストを行い、製品やそのパフォーマンスに関する洞察を得るための一連のリサーチ手法。最も一般的なユーザー調査の手法には、ユーザーインタビュー、ユーザビリティテスト、アンケート、カードソーティング、日記調査などがある。ユーザーリサーチは、デザインプロセスのさまざまな段階で行われ、情報アーキテクチャワイヤーフレーム、UIデザインに関する洞察を得るために、さまざまな演習が行われる。
  68. ユーザーストーリー
    ユーザーの視点から望ましい機能を要約した短い文章。一般的には、「ユーザータイプ」として「目標」を設定し、「理由」を設定するというシンプルなものである。
  69. UXデザイン
    ユーザー・エクスペリエンス・デザインは、便利で使いやすく、楽しいデジタル製品を作成し、改良するための手法。ユーザーが製品に触れる際の体験を向上させるための多段階のプロセス。
  70. ホワイトスペース
    ユーザーインターフェースの中で、意図的に空白にしている領域。正しく使用することで、ページ内の情報の構造や階層を表現し、インターフェイスをすっきりとさせることができる。
  71. ワイヤーフレーム
    ユーザーインターフェースのスケルトンと呼ばれることもあるように、ワイヤーフレームは、ユーザーインターフェースのレイアウトを最初に視覚化するもの。ワイヤーフレームは、低忠実度から高忠実度までさまざまだが、コンテンツの構造と機能を表現し、形やスタイルを表現するものであってはならない。
  72. ワイヤーフロー
    スクリーンフローとも呼ばれ、ユーザーフローの各ステップにおける将来のインターフェースのワイヤーフレームを示すバージョン。
  73. ウィザード
    あらかじめ定義された一連のステップを通じてユーザーをガイドするユーザーインターフェースのタイプ。毎年行われる確定申告など、実行頻度の低い複雑なタスクによく用いられ、ユーザーのミスを最小限に抑えることができる。