カンバン

概要

Avonni カンバン コンポーネントは、Salesforce Experience Cloud 内でワークフロー プロセスを管理するための視覚的なドラッグ&ドロップ インターフェースを提供します。馴染みのあるカンバン手法を活用し、Salesforce のレコード(標準またはカスタム)をカスタマイズ可能な列内のカードとして表示します。

主な機能

  • ワークフローステージ: ワークフローの異なるステージを表す列を定義します(例:「To Do」「In Progress」「Completed」)。

  • カードのカスタマイズ: 各カードに表示する Salesforce フィールドを構成し、一目で必要なコンテキストを提供します。

  • ドラッグ&ドロップ機能: カードを適切な列にドラッグするだけで、レコード/タスクのステータスを更新します。

  • リアルタイム更新: 変更は Experience Cloud サイト全体に即座に反映され、円滑なコラボレーションを促進します。

Salesforce データへの接続

Avonni カンバン コンポーネントを構成する上での重要な手順で、カンバン ボードと Salesforce 環境内の関連データとの接続を確立します。

仕組みは次のとおりです:

  • オブジェクトの選択: まず、カンバン ボードに表示したいデータを含む特定の Salesforce オブジェクト(例:取引先、商談、カスタムオブジェクトなど)を選択します。

  • オプションのフィルタリング: 選択したオブジェクトからデータの一部のみを表示したい場合は、フィルタ機能を使用して特定の条件を設定します。たとえば「Open」の商談のみや特定地域の取引先のみを表示するようにフィルタ可能です。

  • グルーピング(オプション): データをグループ化してカンバン ボードを効果的に整理します。たとえば、商談を「Stage」でグループ化すると「Prospecting」「Negotiation」などの列を作成できます。

  • 並べ替え: 「Order By」フィールドと方向(昇順または降順)を選択して、カンバンカードの表示順序を決定します。

  • 追加フィールド: 表示や操作に直接使用しないフィールドをカンバンに含める必要がある場合は、「追加フィールド」セクションにそれらを追加します。これはカンバンの検索バーで検索可能にしたいフィールドに特に便利です。

重要なポイント

  • 適切なデータソースを選択することで、カンバンがユーザーにとって最も関連性の高い情報を表示します。

  • フィルタリングとグルーピングはボードを簡素化し、特定の作業項目の可視化と管理を容易にします。

データマッピングの構成

「データマッピング」セクションは、Salesforce のデータとカンバン ボードの視覚要素との正確な接続を確立します。これが重要な理由は次のとおりです:

  • 正確な表示: データマッピングは、Salesforce フィールドから取得した情報がカンバンカードやボードの列内に正しく表示されることを保証します。たとえば、Salesforce の「商談名」フィールドを各カンバンカードのタイトルにマップすることができます。

  • 機能: マッピングはユーザーがカンバン ボードとどのようにやり取りするかも制御します。たとえば、「Status」フィールドをカンバンの列にマップすると、ユーザーはカードをドラッグ&ドロップしてボード内で直接ステータスを更新できます。

仕組み

  1. Salesforce のフィールドを選択する 構成済みのデータソースから。

  2. それをカンバン属性にマップする カードのタイトル、説明、列名などのように。

  3. このプロセスを繰り返す カンバン ボードに含めたいすべての重要なフィールドについて。

アイテムのアクションと相互作用

このセクションでは、ユーザーがカンバンカードとどのようにやり取りするかをカスタマイズでき、ボードをより動的かつ応答的にします。

リンク先:

  • カンバンカード内の特定のリンクがクリックされたときに何が起こるかを定義します。

  • よくある用途: レコードの詳細ページに移動、外部ウェブサイトを開く、または Salesforce フローをトリガーする。

クリック時:

  • ユーザーがカンバンカードのどこかをクリックしたときに発生するアクションを決定します。

  • よくある用途: カードを展開して詳細を表示したり、モーダルウィンドウを開いたり、プロセスを開始したりします。

インタラクションタイプ
説明

マップマーカーをクリックした後に画面上に短いポップアップ通知を表示し、迅速なフィードバックや情報を提供します。

ユーザーをサイト内の別のページや URL にリダイレクトし、クリックされた場所に関する詳細情報へ案内します。

選択した場所に関する重要な情報や警告を示すアラートメッセージを含むモーダルウィンドウを開きます。

参加確認など、追加のユーザー確認が必要なアクションに使用される確認ダイアログボックスをトリガーします。

Salesforce フローを実行するダイアログを開き、クリックされた場所に関連するワークフローやプロセスを開始します。

スタイリングと外観

サイズ

  • 幅: カンバン ボード全体の横幅(全体の幅)を制御します。

  • 高さ: カンバン ボード全体の縦の高さ(全体の高さ)を制御します。

  • オーバーフロー: コンテンツがボードの寸法を超えた場合の扱いを規定します(オプションには「visible」「hidden」「scroll」などが含まれる可能性があります)。

ボーダー

  • サイズ: カンバン ボード全体の周囲の境界線の太さ。

  • スタイル: 境界線の外観(例:実線、破線)。

  • 色: 境界線の色。

  • 半径: ボードの角がどれだけ丸いか。

ヘッダー

  • 背景色: カンバンのヘッダーセクションの背景色を設定します。

  • パディング(上、下、左): ヘッダー内部の間隔を制御します。

  • 下マージン: ヘッダーと下の列との間にスペースを作成します。

ヘッダーのボーダー

  • ボーダーの色、サイズ、スタイル、半径: (視覚的に区切るための)ヘッダー内のボーダーの外観をカスタマイズします。

  • 下部ボーダー(結合されていますか): これらの属性は下部ボーダーが列ヘッダーと視覚的に結合するかどうかを制御する可能性があります。

ヘッダータイトル/キャプション

  • 色、フォントサイズ、フォントウェイト、フォントスタイル: ヘッダーのタイトルやキャプションテキストの外観を制御します。

ヘッダーアバター

  • 背景色/前景色: アバター要素の色を設定します。

  • 前景色ユーティリティ: 事前定義されたカラー ユーティリティクラスを使用できる可能性があります。

  • ボーダー半径: アバター要素の角の丸みを制御します。

カラムヘッダー

  • パス背景色: カラムの進行パスが表示される背景領域の色。

  • 集計テキスト/フォント属性: カラムヘッダー内の集計テキストの外観を制御します。

カラムのサイズ設定

  • 最小/最大幅: 列のリサイズに影響する許容される最小幅と最大幅を設定します。

カード

  • 背景色: 通常、ホバー、フォーカス状態の色。

  • 境界線の色: 通常およびフォーカス状態の色。

  • タイトル/説明/情報テキストおよびフォント属性: カード内のさまざまなテキスト要素の外観を制御します。

  • 行クランプ: タイトルや説明の表示行数を制限してオーバーフローを防ぎます。

重要な注意点

  • 特異性: 正確なスタイリング属性は Avonni の実装により若干異なる場合があります。

  • 視覚的階層: これらの属性を戦略的に使用して、明確な視覚的階層を作成し、ユーザーの視線を導いてください。

最終更新

役に立ちましたか?