Human-computer-interface-dialog-design

提供:Dev Guides
移動先:案内検索

ダイアログデザイン

ダイアログは、2つ以上の存在またはシステム間の相互作用の構築です。 HCIでは、ダイアログは3つのレベルで研究されています-

  • 字句-アイコンの形状、実際に押されたキーなどは、このレベルで扱われます。
  • 構文-相互作用における入力と出力の順序はこのレベルで説明されています。
  • セマンティック-このレベルでは、内部アプリケーション/データに対するダイアログの効果が考慮されます。

ダイアログ表現

ダイアログを表すには、2つの目的に役立つ形式的な手法が必要です-

  • 提案された設計をよりよく理解するのに役立ちます。
  • ダイアログを分析してユーザビリティの問題を特定するのに役立ちます。 たとえば、「デザインは実際に元に戻すをサポートしていますか?」などの質問に答えることができます。

フォーマリズムの紹介

ダイアログを表すために使用できる多くの形式主義テクニックがあります。 この章では、これらの形式主義手法のうち3つについて説明します。

  • 状態遷移ネットワーク(STN)
  • 状態図
  • 古典的なペトリネット

状態遷移ネットワーク(STN)

STNは最も自発的なもので、ダイアログがシステムのある状態から次の状態への進行を基本的に示すことを知っています。

STNの構文は、次の2つのエンティティで構成されています-

  • -円はシステムの状態を指し、状態に名前を付けることでブランド化されます。
  • アーク-円は、アークが開始する状態から終了する状態への遷移をもたらすアクション/イベントを参照するアークで接続されています。

STN図

STN図

StateCharts

StateChartsは、有限状態マシン(FSM)を拡張し、並行性を処理し、FSMにメモリを追加する複雑なリアクティブシステムを表します。 また、複雑なシステム表現を簡素化します。 StateChartsには次の状態があります-

  • アクティブ状態-基礎となるFSMの現在の状態。
  • 基本状態-これらは個別の状態であり、他の状態で構成されていません。
  • スーパー状態-これらの状態は他の状態で構成されています。

'_基本状態bごとに、bを含むスーパー状態は祖先状態と呼ばれます。 スーパー状態は、アクティブになっているときはいつでも、サブ状態の1つがアクティブになっている場合、ORスーパー状態と呼ばれます。_

コインの挿入時にボトルを分配するマシンのStateChart構築を見てみましょう。

StateChart

上の図は、ボトルディスペンサーの全体の手順を説明しています。 コインを挿入した後にボタンを押すと、マシンはボトル充填モードとディスペンシングモードを切り替えます。 必要な要求ボトルが利用可能になると、ボトルが分配されます。 バックグラウンドで、詰まったボトルが取り除かれる別の手順が実行されます。 手順4の「H」記号は、今後のアクセスのために手順が履歴に追加されることを示します。

ペトリネット

Petri Netはアクティブな動作の単純なモデルであり、場所、遷移、アーク、トークンなどの4つの動作要素があります。 ペトリネットは、理解しやすいようにグラフィカルな説明を提供します。

  • 場所-この要素は、反応システムの受動要素を象徴するために使用されます。 場所は円で表されます。
  • 遷移-この要素は、リアクティブシステムのアクティブな要素を表すために使用されます。 遷移は正方形/長方形で表されます。
  • Arc -この要素は因果関係を表すために使用されます。 アークは矢印で表されます。
  • トークン-この要素は変更される可能性があります。 トークンは小さな塗りつぶされた円で表されます。

視覚的思考

視覚資料は、絵画、スケッチ、地図、図、写真などの形で古くからコミュニケーションプロセスを支援してきました。 今日の世界では、テクノロジーの発明とそのさらなる成長により、思考や推論などの視覚情報に新しい可能性が提供されています。 研究によれば、人間とコンピューターの相互作用(HCI)設計における視覚的思考のコマンドはまだ完全には発見されていません。 それでは、HCI設計のセンス作成活動における視覚的思考をサポートする理論を学びましょう。

Webの情報デザインのコンテキストで、視覚的即時性、視覚的衝動、視覚的インピーダンス、視覚的隠phor、類似性、関連性などの概念を含む、視覚的思考についての最初の用語が発見されました。

そのため、この設計プロセスは、設計プロセス中の論理的かつ協調的な方法として非常に適しています。 概念を個別に簡単に説明しましょう。

視覚的即時性

これは、視覚的表現の情報を理解するのに役立つ推論プロセスです。 この用語は、時間に関連する品質を強調するために選択されます。これは、設計によって推論が容易になったことの指標としても機能します。

視覚的な刺激

視覚的な推進力は、表現の文脈的側面への関与を高めることを目的とした刺激として定義されます。

視覚インピーダンス

それは表現のデザインの障害であるため、視覚的な即時性の反対として認識されています。 推論に関連して、インピーダンスはより遅い認知として表現できます。

視覚的隠phor、連想、類推、誘duction、ブレンディング

  • 視覚的なデモンストレーションを使用して、別のなじみのあるアイデアの観点からアイデアを理解する場合、視覚的なメタファーと呼ばれます。
  • 視覚的アナロジーと概念的ブレンディングは、メタファーに似ています。 類推は、ある特定のものから別のものへの含意として定義することができます。 概念的なブレンドは、さまざまな状況からの要素と重要な関係の組み合わせとして定義できます。

HCIの設計は、上記の概念を使用することで非常に役立ちます。 概念は、HCIおよび設計プロセスでの視覚的手順の使用をサポートする上で実用的です。

直接操作プログラミング

直接的な操作は、優れたインターフェイス設計として評価されており、ユーザーから高い評価を受けています。 このようなプロセスは、多くのソースを使用して入力を取得し、最終的には組み込みのツールとプログラムを使用してユーザーが望むように入力に変換します。

「直接性」は、操作プログラミングに主に寄与する現象として考えられてきました。 次の2つの側面があります。

  • 距離
  • 直接的な関与

距離

距離は、ユーザーの目標と、システムが提供する説明のレベルとの間の溝を決定するインターフェースであり、ユーザーが対処します。 これらは、「実行の湾」および「評価の湾」と呼ばれます。

処刑湾

実行湾は、ユーザーの目標とその目標を実装するデバイスとの間のギャップ/湾を定義します。 ユーザビリティの主な目的の1つは、障壁を取り除き、作業の流れを妨げる意図したタスクからユーザーの注意をそらすことを最小限に抑えるための手順に従うことで、このギャップを縮小することです。

評価湾

評価湾は、ユーザーがデザインのシステムから解釈した期待の表現です。 ドナルドノーマンによると、_システムがその状態に関する情報を取得しやすく、解釈しやすく、人のシステムの考え方に合った形で提供する場合、湾は小さくなります。

直接的な関与

これは、ユーザーが提示するオブジェクトの制御をデザインが直接処理し、システムを使いにくくするプログラミングとして説明されています。

実行および評価プロセスの精査により、システムの使用における取り組みが明らかになります。 また、システムを使用するために必要な精神的な努力を最小限に抑える方法も提供します。

直接操作の問題

  • 応答の即時性と目標のアクションへの変換により、いくつかのタスクが簡単になったとしても、すべてのタスクを簡単に行うべきではありません。 たとえば、反復操作はおそらく即時性ではなく、スクリプトを介して行うのが最適です。
  • 直接操作インターフェースでは、変数の管理、または要素のクラスからの個別の要素の説明が困難です。
  • 直接操作インターフェースは、依存関係がシステムではなくユーザーに依存するため、正確ではない場合があります。
  • 直接操作インターフェースの重要な問題は、ユーザーが考える技術を直接サポートすることです。

アイテムのプレゼンテーションシーケンス

HCIでは、タスクまたはアプリケーションの要件に従ってプレゼンテーションシーケンスを計画できます。 メニュー内のアイテムの自然な順序に注意する必要があります。 プレゼンテーションシーケンスの主な要因は-

  • Time
  • 数値の順序
  • 物理的特性

タスク関連の取り決めがない場合、設計者は次の見込み客のいずれかを選択する必要があります-

  • 用語のアルファベット順
  • 関連アイテムのグループ化
  • 最も頻繁に使用されるアイテムを最初に
  • 最も重要なアイテムを最初に

メニューレイアウト

  • メニューは、タスクセマンティクスを使用して整理する必要があります。
  • 深さを浅くするよりも浅くすることをお勧めします。
  • 位置は、グラフィック、数字、またはタイトルで表示する必要があります。
  • サブツリーはアイテムをタイトルとして使用する必要があります。
  • アイテムは有意義にグループ化する必要があります。
  • アイテムは意味のある順序で並べる必要があります。
  • 簡単なアイテムを使用する必要があります。
  • 一貫した文法、レイアウト、技術を使用する必要があります。
  • 先に入力、先にジャンプ、または他のショートカットを許可する必要があります。
  • 前のメインメニューへのジャンプを許可する必要があります。
  • オンラインヘルプを検討する必要があります。

一貫性のガイドラインは、次のコンポーネントに対して定義する必要があります-

  • タイトル
  • アイテムの配置
  • 説明書
  • エラーメッセージ
  • ステータスレポート

フォーム入力ダイアログボックス

データフィールドの複数入力に適しています-

  • 完全な情報がユーザーに表示されるはずです。
  • ディスプレイは、使い慣れた紙のフォームに似ている必要があります。
  • エントリの種類ごとにいくつかの指示を与える必要があります。

ユーザーはに精通している必要があります-

  • キーボード
  • Tabキーまたはマウスを使用してカーソルを移動する
  • エラー修正方法
  • フィールドラベルの意味
  • 許可されるフィールドの内容
  • ENTERおよび/またはRETURNキーの使用。

フォーム入力設計ガイドライン-

  • タイトルには意味があります。
  • 指示はわかりやすいものでなければなりません。
  • フィールドは論理的にグループ化され、順序付けされる必要があります。
  • フォームは視覚的に魅力的でなければなりません。
  • 使い慣れたフィールドラベルを提供する必要があります。
  • 一貫した用語と略語を使用する必要があります。
  • 便利なカーソル移動が利用できるはずです。
  • 個々の文字とフィールド全体の機能のエラー修正が存在する必要があります。
  • エラー防止。
  • 許容できない値のエラーメッセージを入力する必要があります。
  • オプションのフィールドは明確にマークする必要があります。
  • フィールドの説明メッセージが利用可能でなければなりません。
  • 完了信号が表示されます。