「ヒューマンインタフェース技術」カテゴリーアーカイブ

【応用情報・基本情報】
・インフォメーションアーキテクチャの考え方,目的を修得し,応用する。
・代表的なヒューマンインタフェース技術の種類,特徴を修得し,応用する。
・GUI の特徴,構成部品,GUI 画面設計の手順,留意事項を修得し,応用する。

【ITパスポート】
・ヒューマンインタフェースの特徴を理解する。

ヒューマンインタフェース技術

情報処理技術者試験での学習内容

【応用情報・基本情報】
・インフォメーションアーキテクチャの考え方,目的を修得し,応用する。
・代表的なヒューマンインタフェース技術の種類,特徴を修得し,応用する。
・GUI の特徴,構成部品,GUI 画面設計の手順,留意事項を修得し,応用する。

【ITパスポート】
・ヒューマンインタフェースの特徴を理解する。

(1)インフォメーションアーキテクチャ 基本情報 応用情報

インフォメーションアーキテクチャ(情報アーキテクチャ)の考え方,目的,情報の組織化(五十音,カテゴリなど),構造化(階層型,タグ付けなど)などを理解する。

用語例:ラベル,チャンク,ナビゲーション,LATCH(Location,Alphabet,Time,Category,Hierarchy)法,階層型,直線型,Web リンク型,フォークソノミー型,セマンティックWeb,メタデータ

(2)ヒューマンインタフェース ITパスポート 基本情報 応用情報

ヒューマンインタフェースを決定する要件,インタフェースを実現する技術の種類,特徴を理解する。

用語例:ユーザビリティ,アクセシビリティ,インタラクティブシステム,音声認識,画像認識,動画認識,特徴抽出,学習機能,選択的知覚,ユーザ操作の分析,身体的適合性,ノンバーバルインタフェース,マルチモーダルインタフェース,空間型インタフェース,自然言語インタフェース

(3)GUI ITパスポート 基本情報 応用情報

グラフィックスを用いた視覚的な表示,ポインティングデバイスなどによる直感的な操作などGUI の特徴,GUI で使われる構成部品の特徴と役割,GUI 画面設計やシナリオなどを使用した設計の手順と留意事項を理解する。

用語例:ウィンドウ,アイコン,ラジオボタン(ラジオボックス),チェックボックス,リストボックス,プルダウンメニュー,ポップアップメニュー,テキストボックス

 

インフォメーションアーキテクチャ

この記事での学習内容 基本情報 応用情報

インフォメーションアーキテクチャ(情報アーキテクチャ)の考え方,目的,情報の組織化(五十音,カテゴリなど),構造化(階層型,タグ付けなど)などを理解する。

用語例:ラベル,チャンク,ナビゲーション,LATCH(Location,Alphabet,Time,Category,Hierarchy)法,階層型,直線型,Web リンク型,フォークソノミー型,セマンティックWeb,メタデータ

情報アーキテクチャ

情報アーキテクチャ(インフォメーションアーキテクチャ)とは、ユーザインタフェースの情報の構造です。建築になぞらえてアーキテクチャといいます。情報アーキテクチャの設計技法や定石を用いたり、設計基準を制定したりしつつ、アーキテクチャの設計・開発・検証をします。

情報アーキテクチャの考え方は、紙面のデザインを基盤にしていますし、一般的な情報の構造化はデータベースに技術が蓄積されています。

情報アーキテクチャの設計の目的は、ユーザのわかりやすさ、探しやすさ、操作のしやすさを向上させることです。

ユーザインタフェースの場合には、ディスプレイ上の2次元の広がりに加えて、階層という3次元目、そして対話型機能によるユーザの操作の流れという4次元目が加わります。また、ユーザが語句を入力する随時の検索も加わります。

情報アーキテクチャの設計には、次のようなことがあります。

  • 情報の組織化として、分類(カテゴリー)や五十音順などの整列の仕方を決定します。
  • 情報の表現の構造化として、階層型の画面やメニューの構成を決めたり、表現の性質を表すメタデータをタグ付けしたりすることがあります。
  • 複数の情報のチャンク(かたまり)を決めてラベルを付けることは、本質的情報の分類と表現上の配置の両方に関わります。
  • 情報間の移動の案内手段であるナビゲーションを設計します。

ナビゲーション

ユーザが情報の間をどのように移動するかを分析して、案内手段であるナビゲーションを設計します。次のようなナビゲーションを組み合わせます。

なお、以下の記述ではウェブサイトのデザインを前提に記載していますが、一般的なGUIアプリケーションでもこれらの観点は大事になってきます。

ページの位置関係によるリンク

ホームページリンク
ウェブページ群の起点のページへ戻るリンク
前ページリンク
現在のページの一つ前に戻るリンク
次ページリンク
現在のページの一つ先に進むリンク
ページトップ
現在のページ自身の先頭へ戻るリンク

先頭部および最後尾のナビゲーション

グローバルメニュー
同じウェブサイトのどのページを開いても、先頭部に表示される標準のメニュー
トピックパス(パンくずリスト)
「ホーム>製品情報>洗濯機」のように、ホームページから現在のページまでの分類体系の枝の連鎖を示す先頭部の表示。
フッターメニュー
同じウェブサイトのどのページを開いても、最後尾に表示される標準のメニュー。グローバルメニューを補助する。
コンテンツ内リンク
ページの内容から別の情報へ移動するリンク。例えば文章中のキーワードそのものにリンクを兼ねさせます。

先頭部・最後尾以外のナビゲーション

ページの先頭部・最後尾以外には、次のようなメニューを配置する定石があります。配置のルールをあらかじめ決めておくことが重要です。

  • 左側にいつも同じメニュー、右側に宣伝したい特別リンクを配置する。
  • その逆に、左側に特別リンク、右側にいつも同じメニューを配置する。
  • 先頭部のメニューのすぐ次に特別リンク、左側にいつも同じメニューを配置する。
  • それらのメニューは、グローバルメニューに比べて、写真やイラスト等の目を引くデザインにしたり、キャッチコピー等を補足したり、目次階層を示したりする。

カテゴリー別メニュー

カテゴリー別メニューは、前述のようなメニュー以外の任意の分類ごとのメニューです。分類の特徴に応じて設計します。

サイトマップ

ウェブサイトの全てのページ見出しを、分類体系の木構造として示す表示です。分類の枝をたどっても、目的のページが見つからない場合に使います。

 

ヒューマンインタフェース

この記事での学習内容 ITパスポート 基本情報 応用情報

ヒューマンインタフェースを決定する要件,インタフェースを実現する技術の種類,特徴を理解する。

用語例:ユーザビリティ,アクセシビリティ,インタラクティブシステム,音声認識,画像認識,動画認識,特徴抽出,学習機能,選択的知覚,ユーザ操作の分析,身体的適合性,ノンバーバルインタフェース,マルチモーダルインタフェース,空間型インタフェース,自然言語インタフェース

ヒューマンインタフェース

ヒューマンインタフェースとは、コンピュータと人間が遣り取りをする部分のことです。具体的には、人間がコンピュータへ指示を入力するキー操作の機能や、コンピュータから人間へ処理結果を返す画面表示や印刷などの機能を指します。ユーザインタフェースともいいます。

画面の表示形式や入力の方法、帳票のレイアウトなどのヒューマンインタフェースは、システムを使うユーザによっての使い方を大きく左右する部分です。

ヒューマンインタフェースの要件は次のように分類されます。

身体的適合性
人の身体と機器とが適合していること。手の大きさとマウスの大きさの適合などです。
頭脳的適合性
人の頭脳の情報処理と機器が適合していること。情報的適合性ともいいます。(例:上から下、左から右と言った情報の流れ)
時間的適合性
人の作業時間、休息時間、機械の応答待ち時間などが適合していること。人の疲労も関係します。
環境的適合性
照明、気温、騒音など、人の好む環境と適合していること。
運用的適合性
人が対話型システムを運用すること、および運用管理をすることに適合していること。

ヒューマンインタフェースを実現する技術には次のようなものがあります。

音声認識
人の話す音声言語を解析し、文字データとして取り出す。
画像認識
人の画像を解析して、それが何かを識別する。
動画解析
人の動画を解析して、それが何かを識別する。
非言語インタフェース
人の五感(視覚、聴覚、味覚、嗅覚、触覚)のうち、言語以外の触覚などを機器との入力又は出力に使う。
自然言語インタフェース
機器特有のコマンドなどではなく、人が日常的に使っている言語をインタフェースにする。
特徴抽出
前述の各種の処理において、解析や識別に必要な特徴をまず抽出する。

入力機能の設計

入力機能の設計では、「ユーザにとって分かりやすく、入力しやすい」ことが最も大切です。

図書館の図書検索システムのような、コンピュータに不慣れな人が使うことが多いシステムの場合は、キーボードを使った文字入力をできるだけなくし、メニューから選ぶ形式や、タッチパネルを使用した入力にするなどの配慮が必要です。

一方、キーボードに慣れたユーザ向けの入力画面である場合は、キーボードとマウスの操作が混在すると操作性が落ちるので、マウスの仕様を減らし、番号を入力して選ぶメニュー形式にするなど、効率よく入力できる機能設計が望まれます。

インタラクティブシステム

インタラクティブシステム(対話型システム)は、ユーザとコンピュータ等の機械とが、対話しながら作業を進めていくシステムのことです。人の出力が機器の入力になり、機器の出力が人の入力になるという関係です。

人もシステムの構成要素として考えると、機器の性能や機能はシステムの属性の一部に過ぎず、人の機能や性能も含めて、能率的な作業ができることが大切です。

機器側だけをシステムとして考えると、人間中心設計という方針が必要です。また、対話型システムの開発には、ユーザ操作の分析が必要です。

ユーザ操作の分析
  • 要件分析段階には、ユーザの従来の作業を分析したり、対話型システムにおける人の作業の部分や条件を分析したりします。
  • 試験段階には、開発された機器を用いてユーザに作業してもらい、それを分析して使いやすさを改善します。ユーザビリティテストがその例です。
ユーザビリティ

ユーザビリティは、対話型システムの特性の一つであり、次の特性のまとまりです。

  • 効果: ユーザの作業の結果が効果的である。
  • 効率: ユーザが作業を進める過程が効率的である。
  • 満足度: ユーザがイライラしたりせずに、気持ちよく作業が出来る。
アクセシビリティ

対話型システムの特性の一つであり、多様な性質を持つ人々の誰でもが、利用しやすいという性質です。特に、障がい者や高齢者でも利用しやすいことが代表的です。例えば、老眼の人のために文字サイズを大きくすることが挙げられます。

人に特有な性質の一つに、選択的知覚があります。人は自分の興味や経験をベースにして、好みの物事を選択的に知覚し、好みでない物事は知覚しにくいという傾向があります。選択的知覚を利用するインタフェースや弱点を補強するインタフェースが望まれます。

音声認識

音声認識は、人の話す音声言語を解析し、文字データとして取り出すことです。メニューを選択すること無しに、人が音声で機器に指示を出すことが、倉庫の扉の開閉やカーナビゲーションなどに用いられます。音声による個人認証は、セキュリティのためのインタフェース技術ともいえます。

画像認識

画像認識は、人の画像を解析して、それが何かを識別することです。例えば、人の視線を解析してカーソルを移動したり、人の笑顔を解析してカメラのシャッターを押す代わりにしたりすることができます。顔認証、指紋認証、虹彩認証などは、セキュリティのためのインタフェース技術ともいえます。

動画認識

動画認識は、人の動画を解析して、それが何かを識別することです。人のジェスチャーによって、機器へ処理を指示することなのです。

特徴抽出

特徴抽出とは、音声認識、画像認識、動画認識、非言語インタフェース、自然言語インタフェースなどの解析処理や識別処理の前半に、解析や識別に必要な特徴をまず抽出することです。画像認識であれば、人の顔の輪郭を抽出するようなエッジ検出などがその例です。

ノンバーバルインタフェース(非言語インタフェース)

非言語インタフェース(ノンバーバルインタフェース)とは、人の五感(視覚、聴覚、味覚、嗅覚、触覚)のうち、言語以外の触覚などを機器との入力または出力に使うことです。

例えば、医療教育用の端末は、人の手からの力をコンピュータへ入力したり、人体の反発を模擬した力をコンピュータから出力したりします。

自然言語インタフェース

自然言語インタフェースとは、機器特有のコマンドなどではなく、人が日常的に使っている言語をインタフェースにすることです。

例えば、音声認識において、「開け」等の操作用語に限定することなく、「ドアを開けてください」などの自由な文を許容したり、識別をすすめるためにコンピュータから日常語で質問したりするのが、自然言語インタフェースの例です。

 

GUI

この記事での学習内容 ITパスポート 基本情報 応用情報

グラフィックスを用いた視覚的な表示,ポインティングデバイスなどによる直感的な操作などGUI の特徴,GUI で使われる構成部品の特徴と役割,GUI 画面設計やシナリオなどを使用した設計の手順と留意事項を理解する。

用語例:ウィンドウ,アイコン,ラジオボタン(ラジオボックス),チェックボックス,リストボックス,プルダウンメニュー,ポップアップメニュー,テキストボックス

GUI(グラフィカルユーザインタフェース)

GUI(Graphical User Interface)とは、グラフィックを使って表された機能を、マウスで選んで操作できる視覚的なヒューマンインタフェースです。

機能が、直感的にわかりやすい「アイコン」などのシンボルを使って表示され、プログラムの起動などの基本的な操作をマウスを使ってできるので、キーボードに不慣れな初心者にも使いやすい操作環境です。

WindowsやMac OSなど、多くのOSがGUIを採用しています。

対して、キーボードでコマンドを入力しながら操作をするインタフェースのことをCUI(Character User Interface)といいます。

GUIの部品

GUIに対応するOSでは、ソフトウェアの画面設計に共通に利用できる、さまざまなGUI部品を提供しています。

チェックボックス
枠内にチェックを付けて選択肢を選ばせる部品です。同時に複数の選択肢を選ぶことができます。
ラジオボタン
円内に黒円をつけて選択肢を選ばせる部品です。複数の選択肢から一つだけを排他的に選ばせます。
リストボックス
リストとして表示される選択肢の一覧から選択できる部品です。
テキストボックス
自由記入形式でユーザがテキストを入力できる部品です。
プルダウンメニュー
メニューバーなどから選択肢のリストが垂れ下がるように表示されるメニューです。
ポップアップメニュー
右クリックなどで飛び出すように表示されるメニューです。

GUI画面設計の留意事項

GUI画面設計にあたっては、次のような点に留意します。

統一性
用語、マウスやキーボードの使い方、メッセージなどを統一する。画面レイアウトを画面間で統一する。
そのシステム内での統一性ももちろん、動作プラットフォームでの一般的な振る舞いに合わせるという意味での統一性も重要。
省力化
省略値(デフォルト値)や前回の選択肢の保存などにより、操作の手間を減らす工夫をする。入力時の適切な項目間のカーソル移動や日本語入力のON/OFFの自動化など。
ユーザの多様性
ユーザの多様性に対して、頻繁に行う操作には、マウスとキーボードの両方の手段を提供する。目の不自由な人や視力の弱い人にも配慮することや、特にWebページではPC以外からの閲覧も考慮するなど。
例外処理
途中での中断やご操作の際の取り消し(Undo機能)などの、よくある例外状況を許容する手段を提供する。
エラーメッセージはユーザを威嚇する表現を避けて、状況の説明、その原因、および次にすべき行為を案内するようにする。

ユーザの多様性を考慮すれば、キーボードの操作よりも、マウスによる操作が常に操作性が良いとは限りません。ユーザには個人差がありますし、同じユーザでもなれてくるとニーズが変わってくるものです。そのために、例えば使用頻度の高い操作に関しては、マウスとキーボードの両方のインタフェースを用意するようにします。

例えば、地図閲覧ソフトウェアを例にすると、特定の町の地図を表示する操作の場合、マウスだけを操作して、全国地図から出発し、近畿地方、京都府、京都市、中京区と絞り込んでいくのが典型的なGUIです。しかし、「住所欄」を設けてキーボードで「京都市中京区」と入力すると一回の操作で町の地図を表示できます。このような形でマウスとキーボード両方のインタフェースを用意すると良いでしょう。