簡単に分かった！UX・UI・IAやアクセシビリティの「専門知識」が増えるまとめ

作成：2014/02/17
更新：2014/11/01
ディレクション >

コーディングやシステムは分かるけど、最終的に使いやすい設計やクライアントさんが納得するようなデザインにならない。納品後に使いにくい箇所があると言われる。そうなる前に「何となく進めない」ようにサイト制作やサービス・アプリを作成する前の段階で知っておきたい知識。UX・UI・IAの違いが漠然としているときに。

エンジニア速報は Twitter の@commteで 1 日 5 回配信しています。

IA（情報アーキテクチャ）

１．基礎知識
２．サイトストラクチャ
３．ナビゲーション設計
４．画面設計
５．IAツール

UI（表現）

１０．UIとUXの違い
１１．インタラクティブ（リッチコンテンツ）

アクセシビリティ

１２．基礎知識
１３．ガイドライン
１４．ファインダビリティ

スタートアップで成功する

１５．リーンスタートアップ
１６．リーン・アナリティクス
１７．Pivot（ピボット）

IA（情報アーキテクチャ）

１．基礎知識

情報アーキテクチャとはWebサイト全体の設計図、情報を分かりやすく伝えること。主にＩＡ（インフォメーションアーキテクト）が担当します。国内ではディレクターが担当する会社も多いと思います。情報アーキテクチャはサイトを見た目の印象だけでなく、目に見えないサイト構造をデザインすることで、わかりやすいサイトにする技術。

２．サイトストラクチャ

サイト全体の情報を構造化した文章をサイトストラクチャ、もしくはサイトマップと呼びます。Webサイト全体像を目に見えるようにすることが目的。

ナビゲーションをデザインする時やファイル配置などの構造を設計する際にサイトストラクチャが必要になります。

３．ナビゲーション設計

IAのお仕事であるナビ設計。ユーザーの負担にならないために、目的の情報へスムーズに辿り着けるようナビゲーションを設計します。ナビの目的は、ゴールと、ゴールまでの手順を示すことです。

４．画面設計

画面設計が中途半端になるとデザイナーに引き継がれたとき修正や見直しが発生してしまいます。IAのタスクは、どの位置にどういった情報を配置するのか、画面遷移、画面内の機能の決定になります。

デザインカンプになる前のワイヤーフレームは情報アーキテクチャの成果物ともいえます。一般的にはフォントや配色を盛り込むことは少なく、書体やサイズまで考慮された試作品のようなものをプロトタイピングと呼びます。

５．IAツール

情報設計する際に便利なツールをまとめました。

UX（体験）

６．基礎知識

情報アーキテクチャはUXの一部です。UX（ユーザーエクスペリエンス）とはユーザーが製品やサービスに触れたときの「心地よさや楽しさ」などの感情を引き起こすなどの、一連の操作から得られる体験を意味します。

７．ペルソナ（人物像）

ペルソナとは設計を支援するために定義する「仮想のユーザ像」のことです。プロトペルソナでは、製品を使うのは誰か？その理由は何か？などターゲットがどうすれば喜ぶのか考えて設計します。ペルソナは、ユーザーエクスペリエンス (UX) 設計のための基本的なツールの 1 つです。

ペルソナ作成後はペルソナの行動をシナリオとして書き出します。ユーザーのニーズを整理し、行動の流れを可視化します。

８．仮説作成

アイデアとペルソナを見ながら、「誰のために、どんな機能を、どんな成果を実現するのか」仮説表を作ります。ある程度決まったら、アイデアの優先順位と捨てる部分を決定します。仮説表をつめたらデザインです。

９．スタイルガイド

デザイナーと非デザイナー共同で創造的な活動を行う場合、面白いアイデアが生まれることがあります。デザインに関してチームを同じ方向へ導くために、スタイルガイドを作成します。

アプリやサービスの場合は、この後テストを行い、フィードバックとリサーチします。

UI（表現）

１０．UIとUXの違い

最も簡潔に言えばUI（表現）とUX（体験）。UIとは人間と物の接点、人間の目の前に表示される操作体系のことを指します。ユーザーがUIを通して体験することがUXです。ユーザビリティとは「使いやすさ・理解しやすさ」を表したもの。

１１．インタラクティブ（リッチコンテンツ）

インタラクションとはJavaScriptなどを使って、ユーザーの入力に応じて適切な応答や画面遷移を伴うインターフェイス設計。画面遷移を伴わずに画面状態を変更したり、音楽や映像を使ってリッチな表現をしたり。「相互作用」と訳されます。

アクセシビリティ

１２．基礎知識

アクセシビリティとは情報への「アクセスのしやすさ」の度合い。身体的なハンデや高齢者だけじゃなくて、健常者を含めた多くの環境に対しても使い勝手や情報のアクセスがしやすくなるよう考慮。すべての人が問題なくコンテンツや機能を利用できることです。

１３．ガイドライン

WCAG2.0の理解や実装に関する情報。日本ではWebサイトのアクセシビリティはJIS(日本工業規格)によってJIS X 8341-3が定められています。

１４．ファインダビリティ

ユーザビリティが使いやすさを示す概念、ファインダビリティは「発見されやすさ」を示します。コンテンツはアクセシブルな状態が必要で、その次にファインダビリティが問われます。

スタートアップで成功する

１５．リーンスタートアップ

無駄を省きスタートアップを成功に導くための考え方。こちらのサイトによるとサービスから作るのではなくて、顧客を見つけ、サービスを聞き、最後にアイデアをサービスにするという考え方。ビジネスモデルで成功するには、優れたアイデアをもとに優れたビジネスモデルを開発すること。

１６．リーン・アナリティクス

書籍。以下のサイトによると「スタートアップのための実践的なデータ分析において、どう見るか、どう改善につなげるか」を解説してある本の名称。効率的に良い品質を提供する考え、またスタートアップのための書籍だということですが、スライドがあったのでチェック。

１７．Pivot（ピボット）

Pivotとは事業の見直し。成功するまで方向性を修正していきます。フィードバックループといったところでしょうか。以下サイトによると事業や製品の方向性を起業時から徐々に旋回し、市場のニーズと一致するプロダクトを見い出す行為に使用されるとのことです。

スポンサードリンク

簡単に分かった！UX・UI・IAやアクセシビリティの「専門知識」が増えるまとめ

もくじ

IA（情報アーキテクチャ）

UX（体験）

UI（表現）

アクセシビリティ