App StudioでのUI設定
PegaアプリケーションのUI設定モデルでは、ワークフロー内のビジネス目的を把握し、その意図を複数のデジタルチャネルで解釈することに重点を置いています。
懸念事項の分離の原則
UIモデルは柔軟性が高く、開発者はフロントエンドコンポーネントとバックエンドAPIを効率的に接続する手段を提供します。Pega PlatformアーキテクチャのUIレイヤーは、懸念事項の分離の原則に従っています。これは、アプリケーションが個別のパーツに分かれるよう定め、各パーツが特定の懸念事項に対応するように定めることで、ソフトウェアのモジュール性を促進するソフトウェア設計の原則です。
UI要素
Pega Platformは、不必要な複雑さのある一貫性のないUIに対応し、UIモデルを使用して、ビュー、テンプレート、ウィジェットによりアプリケーションを作成できるようになります。
次の画像で「+」アイコンをクリックすると、UI要素について詳細を表示できます。
補足： App Studioでビューを作成または更新する方法の詳細「ビューの作成」を参照してください。さまざまなビュータイプとその用途の詳細については、「ビューの設定」を参照してください。コンポーネントの詳細については、「コンポーネントのインストール」を参照してください。
自動生成ビュー
Pega Platform上に構築する新しいアプリケーションの場合、システムは自動的に一連のビューを生成し、App StudioでUIの設定をただちに開始するために使用できます。これらのビューは、テンプレートを使用して生成されます。 Pegaでは、さまざまなテンプレートを使用したさまざまなビュータイプが提供されています。
テンプレートは、ユーザーに最適な体験を提供するために、ビューのレイアウトと応答性を処理するのに役立ちます。たとえば、テンプレートにはブレークポイント、空白文字管理、折り返しなどがあり、標準機能として最新のアクセシビリティ基準へのコンプライアンスを確保できます。
各ビュータイプは、異なるテンプレートを使用します。ビューのタイプや場所によって、使用可能なテンプレートとその動作が異なる場合があります。
次のトピックでは、ビュー テンプレートの理解を深め、認定試験に合格するために重要な情報について説明します。ビューのテンプレート。
テンプレートを使用して自動生成されるビューの例として、フルページビューが挙げられます。
フルページビュー
新しいケースタイプまたはデータオブジェクトを作成すると、Pega Platform™では、ケース完了に必要な情報を処理するためのビジュアルフレームワークを表すフルページビューと呼ばれる関連ビューが自動的に追加されます。フルページビューの3ペインのレイアウトは、ほとんどすべてのケースやデータオブジェクトに最適化され、多くの情報に対応し、その多くはスクロールしたり、他のビューに移動したりすることなく利用できます。 フルページビューは、ケースタイプまたはデータオブジェクトのUXタブで編集できます。
フルページビュー、つまりフルケースページは、Pega Platformの1つのケースを表します。次の画像で「+」アイコンをクリックすると、フルページビューのメインエリアの詳細が表示されます。
App Studioでフルページビューを作成または編集する際に、「Preview」セクションにはプレースホルダーテキストのみが表示されます。データを使用してUIをプレビューするには、ケースインスタンスを実行します。次の画像で「+」アイコンをクリックすると、App Studioでフルページビューを設定する方法の詳細が表示されます。
補足： フルページビューとウィジェットの詳細については、「フルページビューの設定」を参照してください。
サマリーペイン
サマリーペインには、ケースに関する重要な情報が表示されます。 サマリーペインの配置により、ユーザーはレコードの最も重要な情報をメインアプリケーションウィンドウの左上で確認できます。左から右に読むユーザーは、直感的に画面の左上を見て、コンテキストを理解し、新しいビューで次の操作を把握します。
そのサイズと形状は、意図的にモバイルデバイスに似せています。フルケースビューでサマリーペインを折りたたむと、表示がレスポンシブモードに変わります。このモードは、小さい画面のデバイスでよく使用されます。
デフォルトでは、サマリーペインにはDetailsビューとPulseビューも含まれています。
Details
Detailsビューは、重要なフィールドなどの読み取り専用ケースデータやその他の情報をレンダリングできるデフォルトのオプショナルビューです。デフォルトでは、Detailsビューはプライマリーフィールドを表示するように設定されています。
補足： プライマリーフィールドの詳細については、「プライマリーフィールドの設定」を参照してください。
Pulse
Pulseビューは、Pulseを表示するデフォルトのオプショナルビューで、ユーザーはこのケースのコンテキストでメッセージを投稿、表示、返信できます。
補足： Pulseの使用方法の詳細については、「Pulseを使用したユーザーとのコラボレーションの準備」および「Pulseを使用したユーザーとのコラボレーション」を参照してください。
次の問題に答えて、理解度をチェックしましょう。
推奨アクション
フルページビューでは、推奨アクションを設定できます。推奨アクションでは、ユーザーはChange Stageなどの頻繁に使用されるアクションにすばやくアクセスできます。
推奨アクションは、ケースヘッダーにボタンとして表示されます。推奨アクションの追加は、ボタンコンポーネントの構築や追加を必要としないデフォルトの設定パターンです。 推奨アクションは次のように動作します。
- 各ケースタイプは、1つの推奨アクションをサポートします。
- 推奨アクションは、最初のケース全体のアクションです。
次の図は、Change stageという推奨アクションの例を示しています。
次のトピックでは、推奨アクションの理解を深め、認定試験に合格するために重要な情報について説明します。フルケースビューでの推奨アクションの設定
次の問題に答えて、理解度をチェックしましょう。
このトピックは、下記のモジュールにも含まれています。
トレーニングを実施中に問題が発生した場合は、Pega Academy Support FAQsをご確認ください。