初心者からプロまで：UX/UIデザイン用語集
このサイトは、UX（ユーザーエクスペリエンス）とUI（ユーザーインターフェース）デザインに関する用語を初級から上級まで網羅的に解説した用語集です。初級編では、「A/Bテスト」「アイコン」「タイポグラフィ」など、デザインの基礎となる用語や、「レスポンシブデザイン」「ユーザビリティ」など、ウェブやアプリケーションでの使いやすさを向上させる基本概念を紹介しています。初心者がデザインの基礎を学ぶのに最適な内容です。
一方、上級編では、「アクセシビリティガイドライン」「インクルーシブデザイン」「デザインシステム」など、高度なUX/UIデザインの手法や、「ヒートマップ」「ユーザーリサーチ」などのユーザー行動分析に関する知識も解説しています。また、「情報アーキテクチャ」「プロトタイピングツール」といった、設計や検証を行う際に必要な知識もカバーしており、プロフェッショナルが実務で活用できる内容となっています。
この用語集は、デザインを学ぶ学生から現場のデザイナー、プロダクトマネージャーまで、UX/UIデザインの知識を深めたいすべての方に役立つリソースです。わかりやすい構成と検索機能で、必要な情報を効率的に学べるよう工夫されています。
初級入門編：UX/UIデザイン基礎用語
| A/Bテスト | 異なるバージョンを比較して効果を検証する手法 |
| WBS | 作業を細分化した構造図 |
| アイコン | 機能や情報を視覚的に表現する小さな図形 |
| アニメーション | 動きを用いてユーザー体験を向上させる手法 |
| アフォーダンス | オブジェクトが持つ操作可能性の手がかり |
| カードUI | 情報をカード状のブロックで表示するデザイン手法 |
| カラースキーム | デザインで使用する色の組み合わせ |
| コンテクストメニュー | 特定の操作や状況に応じて表示されるメニュー |
| コントラスト | デザイン要素間の明暗や色の差 |
| スクロール | 画面を上下または左右に移動する操作 |
| スケルトンスクリーン | コンテンツ読み込み中に表示される仮のレイアウト |
| スワイプ | 指を滑らせて画面を操作すること |
| セカンダリーアクション | 補助的な操作やボタン |
| タイポグラフィ | 文字のデザインやレイアウトの手法 |
| タップ | タッチスクリーンを指で軽く触れる操作 |
| ドラッグアンドドロップ | 要素をドラッグして別の場所に移動する操作 |
| ナビゲーション | ウェブサイトやアプリ内を移動するための案内 |
| ヒューリスティック評価 | 専門家が経験則に基づいて使いやすさを評価する手法 |
さらに詳しく知りたい方は ⇒ A/Bテスト～ヒューリスティック評価の詳細な解説
| フィードバック | ユーザーの操作に対するシステムからの反応 |
| プライマリーアクション | ユーザーが最も重要とされる操作やボタン |
| プルダウンメニュー | クリックすると選択肢が下に展開するメニュー |
| プログレッシブディスクロージャー | 情報を段階的に表示してユーザーの負担を軽減 |
| プロトタイプ | 実際に操作できる試作品 |
| ペルソナ | 典型的なユーザー像を具体化した架空の人物像 |
| マイクロインタラクション | 小さな操作や反応によるユーザーとのやり取り |
| モックアップ | デザインの詳細を含む画面の試作品 |
| ユーザーインターフェース | ユーザーとシステムのやり取りを行う画面や操作部分 |
| ユーザーエクスペリエンス | ユーザーが製品やサービスを通じて得る体験全体 |
| ユーザージャーニー | ユーザーが製品やサービスを利用する過程 |
| ユーザーテスト | 実際のユーザーに製品を試してもらい評価すること |
| ユーザビリティ | 製品やサービスについてユーザーが使いやすいと感じる度合い |
| レスポンシブデザイン | デバイスの画面サイズに応じてレイアウトを調整する設計 |
さらに詳しく知りたい方は ⇒ フィードバック～レスポンシブデザインの詳細な解説
上級編：プロが使うUX/UIデザイン専門用語
| WCAG | ウェブコンテンツアクセシビリティガイドライン |
| アイトラッキング | ユーザーの視線の動きを分析する手法 |
| アクセシビリティガイドライン | ウェブコンテンツのアクセシビリティ基準 |
| インクルーシブデザイン | 多様なユーザーを考慮したデザイン手法 |
| インタラクションデザイン | ユーザーとシステムのやり取りを設計すること |
| インタラクティブデザイン | ユーザーとの対話性を重視したデザイン手法 |
| インフォグラフィック | 情報を視覚的に表現したグラフィック |
| エンパシーマップ | ユーザーの感情や思考を可視化した図 |
| オフキャンバスメニュー | 画面外からスライドして現れるメニュー |
| オンボーディング | 新規ユーザーにシステムの使い方を案内するプロセス |
| カードソーティング | 情報の分類や構造をユーザーに整理してもらう手法 |
| グリッドシステム | レイアウトを統一するための格子状のガイドライン |
| コンシステンシー | デザインや操作の一貫性 |
| コンテキストインタビュー | ユーザーの環境で行うインタビュー手法 |
| コンテントストラテジー | コンテンツの計画・作成・管理の戦略 |
| コントラスト比 | 文字と背景色の明暗差を示す比率 |
さらに詳しく知りたい方は ⇒ WCAG～コントラスト比の詳細な解説
| コンバージョン率 | 訪問者が目標行動を取る割合 |
| シェーディング | 立体感を出すための陰影付け |
| シナリオ | ユーザーが製品を使う具体的な場面を描いた物語 |
| スキューモーフィズム | 現実の質感や形状を模したデザイン手法 |
| タスクアナリシス | ユーザーが達成すべきタスクを分析すること |
| タッチターゲット | タッチ操作のためのボタンやリンクの領域 |
| デザインシステム | 一貫性を持たせるためのデザインのガイドラインとコンポーネント集 |
| デザイン思考 | 人間中心の問題解決アプローチ |
| ハンバーガーメニュー | 三本線のアイコンで表される隠れたメニュー |
| ヒートマップ | ユーザーの行動を視覚的に示すツール |
| ファーストタイムユーザーエクスペリエンス | 初回利用時のユーザー体験を最適化すること |
| フラクショナルデザイン | 複雑なパターンを繰り返すデザイン手法 |
| フラットUI | 平面的でシンプルなユーザーインターフェース |
| フラットデザイン | 装飾を排したシンプルなデザインスタイル |
| フロー型レイアウト | 画面サイズに応じて要素が流動的に配置 |
| プログレッシブエンハンスメント | 基本機能を確保しつつ高度な機能を追加する手法 |
さらに詳しく知りたい方は ⇒ コンバージョン率～プログレッシブエンハンスメントの詳細な解説
| プロトタイピングツール | プロトタイプを作成するためのソフトウェア |
| マイクロコピー | ボタンやエラーメッセージなどの短いテキスト |
| マテリアルデザイン | Googleが提唱するデザインガイドライン |
| ミニマルデザイン | 必要最小限の要素で構成されたデザイン |
| モーダルウィンドウ | ユーザーの操作を一時的に制限するポップアップ画面 |
| モバイルファースト | モバイル端末向けに優先してデザインする手法 |
| ユーザーエンゲージメント | ユーザーが製品やサービスにどれだけ関与しているか |
| ユーザーオンボーディング | 新規ユーザーを導入するためのプロセス |
| ユーザーセンタードデザイン | ユーザーのニーズを中心に据えた設計手法（UCD） |
| ユーザーフロー | ユーザーがシステム内を移動する経路 |
| ユーザーリサーチ | ユーザーのニーズや行動を調査すること |
| ユーザーロール | ユーザーの役割や権限を定義すること |
| ユビキタスコンピューティング | 日常生活にコンピュータ技術が浸透する概念 |
| レスポンシブイメージ | 画面サイズに応じて適切な画像を表示する技術 |
| レスポンスタイム | ユーザー操作に対するシステムの応答時間 |
| 情報アーキテクチャ | 情報の構造や配置を設計すること（IA） |
さらに詳しく知りたい方は ⇒ プロトタイピングツール～情報アーキテクチャの詳細な解説