Logo
Moments
フローエディター

フローエディター

備考

このページでは、新しいフローエディタについて説明します。

Momentsのフローエディターは、フローをデザインできる視覚的なコード不要のドラッグアンドドロップインターフェイスです。

フロー要素の追加と構成、詳細設定の構成、およびフローの管理を行うことができます。

フローエディターの使用を開始する

このセクションでは、エディターの構造とアクセス方法について説明します。

エディターで行ったすべての変更は、自動的に保存されます。

エディタへのアクセス方法

既存のフロー: 既存のフローの場合は、すべてのフロー ページに移動し、フローを選択します。フローがエディター ページで開きます。

新しいフロー: フローを作成すると、エディター ページで自動的に開きます。

エディタの構造

エディタには、次のセクションがあります。

  • キャンバス(左):フローの設計に使用されます。
  • ビルドサイドパネル(右):選択した項目を構成できる動的パネルです。
    • 要素構成: キャンバス上のエレメントを選択すると、このパネルにそのエレメントのフィールドと設定が表示されます。
    • タグ: フッターから タグ を選択すると、このパネルには使用可能なタグの一覧が表示されます。
    • フロー 設定: フッターから フロー設定 が選択されている場合、このパネルにはフローの設定が表示されます。
  • フッター(下):フローコントロールとメタデータ(フローの名前、フロー内のキャンペーンタグの数、フロー設定など)が含まれます。

次の図は、フロー エレメントの [ビルド] サイド パネルを示しています。

Image that shows the flow editor

要素の作成と管理

拡張キャンバスコントロールを有効にする

拡張されたキャンバスコントロールにより、フローエディタとの対話が改善されました。これらを使用すると、次のことができます。

  • ナビゲーション: スクロールするか、マウスの右ボタンまたは中ボタンでドラッグするか、Space キーを押しながらドラッグして、キャンバス内を移動します
  • ズーム: タッチパッドをピンチするか、マウスで Cmd/Ctrl + スクロールを使用して、ズーム レベルを調整します。
  • エレメントの選択: エレメントを選択し、ドラッグして移動します。
  • 要素を複数選択: 複数の要素を選択し、ドラッグして移動します。

拡張キャンバス コントロールを有効にするには、[設定] アイコンを選択し、[拡張コントロール] を選択します。

従来のコントロールを使用するには、このオプションを無効にします。

Image that shows how to enable enhanced controls

フローにエレメントを追加する

  1. 既存のエレメントの横にある矢印を選択します。

    エレメントに分岐がある場合は、分岐の横にある矢印を選択して次のエレメントを追加します。

    Image that shows Image that shows how to add an element to the flow editor
  2. 使用可能なエレメントのリストから選択します。必要なエレメントを検索することもできます。

    エレメントがキャンバスに追加されます。

    Image that shows how to select an element

エレメントの編集または構成

エレメントを選択して [ビルド] サイド パネルを開きます。このパネルでエレメントを設定できます。

Image that shows how to configure an element

要素の移動

1 つのエレメントを移動する

  1. エレメントを選択します。
  2. キャンバス上のエレメントをドラッグして移動します。

複数の要素を移動する

  1. 拡張コントロールを有効にします。
  2. 必要な要素を選択します。
  3. キャンバス上の要素をドラッグして移動します。
Image that shows how to move an element

エレメントを複製する

必要なエレメントを選択し、その上の 複製 アイコンを選択します。

Image that shows how to duplicate an element

要素の削除

1 つのエレメントを削除する

  1. エレメントを選択します。
  2. エレメントの上にある「削除」アイコンを選択します。

複数の要素を削除する

  1. 拡張コントロールを有効にします。
  2. 必要な要素を選択します。
  3. 要素の上にある [削除] アイコンを選択します。
Image that shows how to delete an element

新しいエントリーポイントを追加する

既定では、フローには、フローの作成時に選択したエントリーポイントが含まれます。エントリ ポイントをさらに追加する場合は、[エントリーポイントの追加] を選択し、必要なオプションを選択します。

Image that shows how to add an entry point

検証とトラブルシューティング

フロー内のエラーを検証して特定します。

フローを検証する

検証を選択して、フローを検証します。

Image that shows how to validate the flow

フロー内のエラーのリストを表示する

エラー を選択して、フロー内のすべてのエラーのリストを表示します。

エラーは、次のタブに分類されます。

  • フロー要素: フロー要素に固有のエラー。例: 次の図は、SMS(Short Message Service エレメントにエラーがあることを示しています。
  • キャンペーン: キャンペーンの失敗の原因となる可能性のあるエラー
  • フロー構造: フロー構造のエラー。例: 次の図に示すフローには、終了 エレメントがありません。

次の図は、フロー要素とフロー構造にエラーがあることを示しています。

Image that shows how to validate the flow

フローエレメントのエラーを表示する

キャンバス上のエレメントのエラーアイコンは、エレメントに解決が必要なエラーがあることを示します。エレメントを選択して、そのエラーを [ビルド] サイド パネルに表示します。

次の図は、SMS エレメントにエラーがあることを示しています。

Image that shows an error message for the SMS element

エレメント ID を表示するためのデバッグ

フッターの デバッグ を選択します。エレメント ID は、各エレメントの上に表示されます。

IDを選択してコピーできます。

Image that shows the error ID

フローのナビゲーションとレイアウト

ミニマップを使用してナビゲートする

ミニマップを使用して、キャンバス内を移動します。ミニマップをドラッグして、特定のセクションまたは要素に移動します。

Image that shows the mini map

エントリーポイントに移動する

フロー内の特定のエントリーポイントに移動するには、アイコンを選択し、必要なエントリーポイントを選択します。

Image that shows the mini map

ズームコントロールを使用する

ズーム コントロールを使用して、視認性を高めます。ズームインおよびズームアウト、ズームのリセット、またはビューをキャンバスに合わせることができます。

Image that shows zoom controls

接続線の外観を変更する

接続線(要素間の線分)の外観をカスタマイズします。

次のオプションを使用できます。

  • ベジェ:滑らかな曲線
  • 階段状: 角張った直角線

これらのオプションにアクセスするには、[設定] アイコンを選択し、オプションを選択します。

Image that shows how to change the appearance of connector lines

古いエディタを使用する

フッターで [古いエディターを使用** を選択して、以前のバージョンのフロー エディターを使用します。

Image that shows the mini map

フロー構成

フローに名前を付ける

フローを識別する一意の名前を指定します。

Image that shows how to name the flow

キャンペーンタグを管理する

フロー内の キャンペーンタグを表示、追加、または削除します。

Image that shows how to manage campaign tags

目標を設定する

フローの 目標 を設定します。

Image that shows how to add a goal

フロー設定を構成する

フロー設定を設定します。

Image that shows how to configure flow settings

フローを管理する

フローをテンプレートとして保存する

フローを template として保存するには、フッターの 3 つのドットを選択し、テンプレートとして保存 を選択します。

Image that shows how to save a flow as a template

フローを複製する

フローを複製 するには、フッターの 3 つのドットを選択し、複製 を選択します。

Image that shows how to duplicate a flow

フローを削除する

フローを 削除 するには、フッターの 3 つのドットを選択し、削除 を選択します。

Image that shows how to delete a flow

Logo

ご不明点は

サポートまでお問い合わせ

ください

© NTTCom Online Marketing Solutions Corporation