技術要素(1)

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

インフォメーションアーキテクチャ(情報アーキテクチャ)

情報を構造化したり組織化したりして、分類・整理すること
発信する情報をデザインする方法(Webページなどで活用)

情報の構造化

情報に構造を与えること
（例：飲食店のデータ管理⇒“ジャンル”“店舗名”“住所”“Tel”などの構造）

情報の組織化

構造化した情報を分類・整理すること
●チャンク：組織化した情報の塊・まとまり
●ラベル：チャンクごとに決める名前のこと

Location  　　場所や位置 Alphabet　　アルファベット、五十音順 Time　　　　時間 Category　　分野 Hierarchy  　階層

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

一般的に、人やハードウェア、ソフトウェアが情報を交換する設定を、インタフェース設計(Interface)という。その中でも、コンピュータと人間との間で情報をやり取りする接点が特に「ヒューマンインタフェース(HumanInterface)」と呼ばれている。コンピュータにおけるヒューマンインタフェース設計は、テレビのスイッチやドアノブと同様に、人間にとっての操作性・生産性を向上させるために設計され、かつ機能することが求められる

GUI(Graphical User Interface)

視覚的な表示とポインティングデバイスを用いた直感的な操作を可能にするヒューマンインタフェース設計

GUIを構成する主な要素

名　称	説　明
ウィンドウ	個々のアプリケーションを扱うためにデスクトップ上に独立して表示される表示領域
メニューバー	各種機能を分類、一覧標示している部分 該当するメニューを選択すると機能が表示される
テキストボックス	文字や数値データをキーボードから入力する
ラジオボタン	一連の項目の中から一つの項目を選択する際に利用。ある項目にチェックを入れた状態で、別の項目にチェックを入れると、最初にチェックした項目のチェックが自動的に解除される
プルダウンメニュー	メニューバーの表示方法の一種 選択すると項目の一覧が垂れ下がる形で表示される
チェックボックス	一連の項目の中から複数の項目を選択したり、各項目についてそれぞれオン・オフを設定したりする場合に利用
コマンドボタン	ボタンに対応付けられた処理を実行する
リストボックス	複数項目のリストから任意の項目を指定する際に利用 選択形式で選択肢が多くなる場合に使用
アイコン	アプリケーションや機能を絵で示すもの クリックすることで所定のプログラムを実行する
ポップアップ メニュー	画面の内容を表示しながら、画面の任意の位置に表示されるメニュー 「ショートカットキー」

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

音声や画像などの多種多様な方法を使ってコンピュータを操作するシステムのこと

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

種類	説明
音声認識	人間の発する音声を認識するシステム
画像認識・動画認識	静止画像や動画像を認識するシステム。顔認識システム
インバーバルインタフェース	表情や身振りを認識するシステム
自然言語インタフェース	日常会話で使用している自然言語で操作できるシステム

ヒューマンインタフェースの要件

ユーザビリティ

利用者の感じる使いやすさ、操作のわかりやすさを整え、使いやすいヒューマンインタフェースを設計するための指標
ISO9241-11

選択的知覚の理解

選択的知覚：自分にとってわかりやすい情報だけを選択的に受け入れること
より多くの利用者にとって分かりやすい情報を提供することが重要

身体的適合性の理解

身体的適合性：人の身体の動きを研究し、操作による疲労や苦痛などの負担を減らすこと

Webデザイン

Webデザインのポイント

●スタイルシートを利用し、色調やデザインを統一する ●画像の利用を最小限にし、ストレスのない操作性を実現する ●ページの数が非常に多数に及ぶ、利用者に求める選択肢が多岐になる場合は、   Webページ構成や選択肢をグループ化、階層化するなどして、混乱をきたさな   いようにする ●特定のWWWブラウザでしか表示できない機能は盛り込まず、どのWWWブラ   ウザでも表示できるようにする

ユニバーサルデザイン

言葉の違い、文化の違い、性別や年齢、身体的ハンディの有無など、さまざまな要因があっても、それに左右されることなく利用することができるようなデザイン、という観念。システム開発においても、ユニバーサルデザインの考え方を取り入れることにより、みんなが使いやすいしすてむの構築を目指す

ユニバーサルデザインの7原則

1.どんな人でも公平に使えること(Equitable use) 2.使う上での柔軟性があること(Flexibility in use) 3.使い方が簡単で自明であること(Simple and intuitive) 4.必要な情報がすぐに分かること(Perceptible information) 5.うっかりミスが危険に繋がらないこと(Tolerance for error) 6.身体への過度な負担を必要としないこと(Low physical effort) 7.アクセスや利用のための十分な大きさと空間が確保されていること 　　　　　(Size and space for approach and use)

インタフェース設計

インタフェース設計の設計には大きく分けて「画面設計」と「帳票設計」の2種類がある

画面設計	データを入力する際の画面の項目やレイアウトなどの操作方法を設計する
帳票設計	入力する用紙や入力原票のレイアウト、プリンタに出力する内容などを設計する

画面設計

画面設計時のポイント

●入力の流れが自然になるよう、左から右、上から下へ移動する並びにする ●選択肢の数が多いときは、選択肢をグループ分けするなどして選択しやすく   する ●色の使い方にルールを設ける ●操作に慣れていない人のために操作ガイド(ヘルプ)を表示する ●利用目的に応じて、キーボード以外の入力装置(バーコード、タッチパネル、   スキャナなど)でも使用できるようにする

入力画面設計手順

　例)DVD登録・検索システム

帳票設計

帳票設計時のポイント

●各帳票に共通する項目は、同じような場所に配置する ●余分な情報は除いて必要最小限の情報を盛り込む ●数値データなどは３桁ごとにカンマを付けるなどして読みやすくする ●目的に応じて、表やグラフ、図形などを使い分けたレイアウトにする ●目的に応じて、バーコードなどの特殊な出力も考慮する

入力画面設計手順

コード設計と入力チェック

コンピュータではコードを用いてデータを表現する。コードは利用者が理解しやすいように利用目的、適用分野に会った設計にすることが求められる。また、入力された内容をコンピュータ側でチェックする必要がある

コードの設計

名称	説明
順番コード シーケンスコード	先頭から連続した番号を付ける方法 例：0001から始まる連番を振る
区分コード 分類コード	グループに分け、グループごとに連番を振る方法 例：食品⇒1001、衣類⇒2001、文具⇒3001　から始まる連番を振る
桁別コード	コードの桁に、何らかの意味を持たせる方法 例：2010年入社、社員番号11番⇒2010011
表意コード	コードに文字列を用いて何らかの意味を持たせる方法 例：2011年入学、法学部学籍番号12番⇒11L012
合成コード	上記のコードを組み合わせる方法

コード設計の手順

入力チェック

名称	説明
ニューメリックチェック	入力データが数値であるかを判断する 例：数字のみの入力に文字列が含まれていないか
フォーマットチェック	入力データがフォーマット(一定の形式)に沿っているかを判断する 例：郵便番号が“−”で区切られているか
リミットチェック	入力データが一定の範囲に収まっているかを判断する 例：月数に1〜12以外が入力されていないか
照合チェック	入力データが存在するかを、マスタデータ(基準データ)と照らし合わせる
組合わせチェック	入力データが複数のデータの組み合わせに矛盾がないかを判断する
バランスチェック	複数の計算結果が等しくなることが分かっている場合に、計算結果が正しいかを判断する
重複チェック	入力データが重複していないかを判断する