Webアプリケーションのユーザーインターフェイス[6]
「戻る」で入力データが消えてしまうフォームはいらない
「寛容性とユーザーコントロール」
ソシオメディア 上野 学
2005/12/22
対話型システムの設計原則 |
その前にまず、連載の第1回「ユーザーにとっては“ユーザーインターフェイス”こそが製品そのもの」で触れた HCI(Human-Computer Interaction)の分野でよく挙げられる、コンピュータを用いた対話型システムの設計原則を紹介しておきます。ここでいう「対話型システム」とは、ユーザーとシステムが対話をしながら作業を進めていく仕組みのことで、GUIを持つシステムはすべてこれに含まれます(対話型ではないシステムとは、メインフレームなどの、指定された処理をバッチ方式で行うものです)。
対話型システムの設計原則 |
- 可逆性と制御権の確保:試行錯誤を容易にし、ユーザーを応答者ではなく主体的な操作者として扱う。
- フィードバックの提供:すべての操作に対する状態と変化の提示。
- エラーの回避:早期のエラー検出による致命的エラーの回避。
- 一貫性:操作手順の統一、用語の統一、視覚表現の統一、オブジェクトの振る舞いの統一。
- 短期記憶負担の低減:情報量や選択肢を制限し、その場で十分に判断できるようにする。
- ショートカットの用意:キーボード、マクロ機能、スキップ。
- 業務への適合:ワークフローやタスクの特性に適合させる。
- 個人への適合:個人の目的やスキル特性に適合させる。
- 学習支援:オンラインチュートリアル、ヘルプ。
こういった経験則は、80年代におけるGUIの普及に伴って行われた多くの HCI 研究の成果から導き出されたものです。そして現代のWebアプリケーション設計においても、十分に利用できる考え方です。ただし、Webアプリケーションのデザインを考えるうえでは、従来のデスクトップアプリケーションのデザインとは違った視点や価値観も必要になります。1つにはWebアプリケーションが、ローカルのコンピュータ環境ではなくネットワーク上での利用と運用を前提としていること。そしてもう1つは、製品というよりもサービスとしてユーザーに提供される傾向にあることです。
1/5 |
INDEX |
||
Webアプリケーションのユーザーインターフェイス(6) | ||
Page1<対話型システムの設計原則/対話型システムの設計原則/経験則その1:「ユーザーを尊重する」> | ||
Page2<WebアプリケーションのUIデザイン/メリット(リアルタイムのデータにアクセスできる/公開が容易)/どこからでも利用できる/デメリット(不十分なインタラクション表現/やりとりが煩わしい/見た目に関する一貫性の欠如)> | ||
Page3<経験則その2:寛容性とユーザーコントロール/できるだけすべての操作を可逆的にする> | ||
Page4<ユーザーが自分のペースで作業できるようにする/コントロールを作業の流れに合わせて配置するユーザーの意思を優先する> | ||
Page5<UIからゲーム性を排除し、簡単なマウス操作で利用できるようにする/ユーザーを信頼する> |
関連記事 |
HTML5 + UX フォーラム 新着記事
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
|
|