ビュー

ローンを組むためのプロセスを実行する場合を考えてみます。この例では、2つのステップがあります。

1. プロセスの最初のステップでは、顧客はローン申請の情報を入力する必要があります。このフォームには、顧客の名前、ローンの金額、ローンの種類などの情報を入力するためのフィールドが表示されます。顧客がフォームを記入すると、審査のためにシステムからローン担当者にリクエストが送信されます。


2. プロセスの2つ目のステップでは、ローン担当者は、収集されたデータをLoan officerビューで確認できます。ローン担当者は顧客情報を読み取ることはできますが、更新することはできません。ローン担当者のビューには、担当者がローン保険の資格や承認理由などの情報を入力するためのフィールドが含まれています。

次の画像の中央にある縦線をスライドさせると、ローン申請プロセスのステップを表示できます。

ビューの作成中に、ユーザーが特定のタスクを実行するために確認または入力する必要がある情報を判断します。たとえば、開発者は、トラックが石を跳ね上げてフロントガラスに軽微な損傷を与えた場合に、ドライバーが迅速かつ簡単に運送会社に報告できるようなビューを作成します。最高のユーザーエクスペリエンスを実現するためには、さまざまな設計上の決定を考慮する必要があります。ユーザーにどのフィールドを表示すべきか、ユーザーはフィールドにどのような種類の値を入力するか、フィールドをどのような順序で表示するか、フィールドは編集可能か読み取り専用か、表示するか非表示にするか、必須にするかオプションにするかを検討する必要があります。

次の問題報告ビューの画像は、これらの質問に答えた際に考えられる多くの選択肢の一例を示しています。

以下のインタラクションで理解度をチェックしてください。

フィールドグループは、個々のフィールドのクラスターです。個々のフィールドがまとまって、ビュー内で関連データを表示します。個々のフィールドは、ケースタイプのデータモデルまたはさまざまなデータオブジェクトから取得できます。 フィールドグループは、関連する値を1つのヘッダーのもとにまとめて整理するのに役立ち、インストラクションを追加したり、ビュー内の折りたたみ可能なセクションのフィールドを一時的に非表示にしたりする手段を提供します。 

ビュー内にフィールドグループを作成した場合、これはそのビューのみに固有のものです。

ビューは、ケースとやり取りするために使用できるUI要素の再利用可能な設定です。フォームはユーザーからデータを収集し、作業を処理するための再利用可能なインターフェイスです。  フォームはビューの一種ですが、すべてのビューがフォームであるとは限りません。たとえば、オンラインショッピングのサイトでは、顧客が注文時に個人情報や配送先情報などを入力する必要があります。フォームは、顧客の名、姓、メールアドレス、電話番号、住所を収集するために使用されます。トランザクションが完了するとユーザーの購入内容と注文合計を含む読み取り専用の注文確認を表示するために、ビューが使用されます。

Constellation UIアーキテクチャでは、フォームはCancel、Next、Previous、Submitなどのボタンによって事前に設定されています。

次の画像は、このトピックの最初のセクションで作成したフォームを示しています。最初のビューにはラジオボタンフィールドがあり、ユーザー入力に基づいて2つ目のビューを条件付きで表示するようになっています。