アダプティブフォーム(コアコンポーネント)の作成

アダプティブFormsを使用すると、動的で柔軟で柔軟な、魅力的なフォームを作成できます。 AEM Forms は、アダプティブフォームを素早く作成するための、ビジネスユーザーにとってわかりやすいウィザードを提供します。このウィザードはクイックタブナビゲーションを備えており、アダプティブフォームを作成するための事前設定済みのテンプレート、スタイル設定、フィールド、送信オプションを簡単に選択することができます。

開始する前に、使用可能な Forms コンポーネントのタイプについて学習します。

  • アダプティブフォームコアコンポーネント:標準化されたデータキャプチャコンポーネントです。これらのコンポーネントは、デジタル登録エクスペリエンスのカスタマイズ機能を提供し、開発時間を短縮し、メンテナンスコストを削減します。開発者は、これらのコンポーネントを簡単にカスタマイズし、スタイルを設定できます。これらの最新かつ拡張性の高いコンポーネントを活用してアダプティブフォームを開発することをお勧めします。

  • アダプティブフォーム基盤コンポーネント:従来の(古い)データキャプチャコンポーネントです。引き続きこれらを使用して、既存の基盤コンポーネントベースのアダプティブフォームを編集できます。 新しいフォームを作成する場合は、アダプティブフォームコアコンポーネントを使用してアダプティブフォームを作成することをお勧めします。

アダプティブフォームの作成ウィザード

前提条件

アダプティブフォームを作成するには、以下が必要です。

  • お使いの環境でアダプティブフォームズコアコンポーネントを有効化:新しいプログラムを作成すると、アダプティブコアコンポーネントはお使いの環境で既に有効になっています。アーキタイプ 39 以前の Forms as a Cloud Service 環境をご利用の場合は、ご利用の環境でアダプティブフォームコアコンポーネントを有効にします。ご利用の環境でコアコンポーネントを有効にすると、アダプティブフォーム(コアコンポーネント)​のテンプレートとキャンバステーマが環境に追加されます。AEM SDK バージョンが 2023.02.0 より前の場合は、2023.02.0 リリースより前にアダプティブフォームのコアコンポーネントがプレリリースの一部であったので、お使いの環境で prerelease フラグが有効になっていることを確認してください

  • アダプティブフォームテンプレート:テンプレートは基本構造を提供し、アダプティブフォームのアピアランス(レイアウトとスタイル)を定義します。これには、特定のプロパティやコンテンツ構造を有するフォーマット済みのコンポーネントが含まれます。また、テーマと送信アクションを定義するオプションも提供されます。 テーマは、ルックアンドフィールと送信アクションを定義し、アダプティブフォームの送信時に実行するアクションを定義します。 例えば、収集したデータをデータソースに送信する場合などです。 クラウドサービスでは、空白という名前の OOTB テンプレートが提供されます。

  • アダプティブフォームのテーマ:テーマには、コンポーネントとパネル向けのスタイル設定の詳細が含まれます。 スタイルには、背景カラー、ステートカラー、透明度、配置、サイズなどのプロパティが含まれます。テーマを適用すると、指定したスタイルが対応するコンポーネントに反映されます。Canvas テンプレートは、すべての新しい AEM Forms as a Cloud Service プログラムに含まれています。

  • 権限:forms-users グループにユーザーを追加します。forms-users グループのメンバーには、アダプティブフォームを作成する権限があります。フォーム専用のユーザーグループの詳細なリストについては、グループと権限を参照してください。

アダプティブフォーム(コアコンポーネント)の作成

  1. Experience Manager Forms オーサーインスタンスにログインします。Cloud インスタンスまたはローカル開発インスタンスの場合があります。

  2. Experience Manager のログインページに資格情報を入力します。ログイン後、左上隅の Adobe Experience ManagerFormsフォームとドキュメント​をタップします。

  3. 作成」をタップして、「アダプティブフォーム」を選択します。ウィザードが開きます。ソースタブで、テンプレートを選択します。

    コアコンポーネントテンプレート

    テンプレートを選択すると、テンプレートで指定されたテーマと送信アクションが自動的に選択され、作成 ボタンが有効になります。「スタイル」または「送信」タブを使用して、別のテーマや送信アクションを選択することができます。 選択したテンプレートでテーマが指定されていない場合、作成ボタンは無効のままです。「スタイル」タブに進み、テーマを手動で選択することができます。

    メモ

    ご利用の環境に​アダプティブフォーム(コアコンポーネント)​テンプレートがない場合は、ご利用の環境のアダプティブフォームコアコンポーネントを有効にします。ご利用の環境でコアコンポーネントを有効にすると、アダプティブフォーム(コアコンポーネント)​テンプレートが環境に追加されます。

  4. スタイル」タブで、テーマを選択します。

    • 選択したテンプレートでテーマを指定すると、ウィザードでテーマが自動的に選択されます。 「スタイル」タブから別のテーマを選択することもできます。

    • 選択したテンプレートにテーマが指定されていない場合は、「スタイル」タブを使用してテーマを選択することができます。 この「作成」ボタンは、テーマが選択された後にのみ有効になります。

  5. (オプション)「データ」タブで、データモデルを選択します。

    • フォームデータモデルフォームデータモデルを使用すると、異なるデータソースのエンティティやサービスをアダプティブフォームに統合することができます。 作成するアダプティブフォームで、複数のデータソースに対するデータの取得と書き込みが必要になる場合は、フォームデータモデルを選択します。

    • JSON スキーマJSON スキーマ コアコンポーネントベースのアダプティブフォームは、生成または消費されるデータの構造を表す JSON スキーマを関連付ける機能により、自社のバックエンドシステムとシームレスに統合できます。この関連付けにより、作成者はスキーマの要素を使用して、アダプティブフォームにコンテンツを動的に追加できます。スキーマの要素には、オーサリングプロセス中にコンテンツブラウザーの「データモデルオブジェクト」タブから容易にアクセスでき、新しく作成されたアダプティブフォームにすべてのフィールドが自動的に追加されます。

    デフォルトでは、関連付けられた JSON スキーマのすべてのフィールドが自動的に選択され、対応するアダプティブフォームコンポーネントに変換されるので、オーサリングプロセスを合理化できます。ウィザードでは、チェックボックスを使用してアダプティブフォームに含めるフィールドを選択できる、さらに便利な機能が用意されています。

  6. 送信」タブで、送信アクションを選択します。

    • テンプレートを選択すると、テンプレートで指定された送信アクションが自動選択されます。 「送信」タブから、別の送信アクションを選択することができます。 「送信」タブには、使用可能なすべての送信アクションが表示されます。

    • 選択したテンプレートで送信アクションが指定されていない場合は、「送信」タブを使用して送信アクションを選択することができます。

  7. (オプション)「配信」タブで、アダプティブフォームの公開日または非公開日を指定することができます。

  8. 作成」をタップします。アダプティブフォームを保存するためのタイトル、名前および場所を指定するためのダイアログが表示されます。

    • タイトル:フォームの表示名を指定します。タイトルを指定すると、Experience Manager Forms ユーザーインターフェイス内のフォームを特定しやすくなります。
    • 名前:​フォームの名前を指定します。指定された名前のノードがリポジトリーに作成されます。タイトルを入力し始めると、名前フィールドの値が自動的に生成されます。候補として入力された値は変更可能です。「ドキュメント名」フィールドには、英数字、ハイフン、アンダースコアのみを使用できます。無効な入力は、すべてハイフンに置き換えられます。
    • パス:アダプティブフォームを保存する場所を指定します。 アダプティブフォームは、/content/dam/formsanddocuments に直接保存することができます。または、/content/dam/formsanddocuments/adaptiveforms などのフォルダーを作成して、アダプティブフォームを保存することができます。フォルダーをパスで使用する前に、必ずフォルダーを作成してください。 「パス」フィールドでは、フォルダーは自動的には作成されません。
  9. 作成」をタップします。アダプティブフォームが作成され、アダプティブフォームエディターで開かれます。 エディターに、テンプレートで使用可能なコンテンツが表示されます。 アダプティブフォームのタイプに応じて、関連する JSON スキーマまたはフォームデータモデルに存在するフォーム要素が、サイドバーの​コンテンツブラウザ​の「データモデルオブジェクト」タブに表示されます。これらの要素もアドラッグ&ドロップしてダプティブフォームを作成できます。

これで、アダプティブフォームのコアコンポーネントをアダプティブフォームのコンテナにドラッグ&ドロップし、フォームをデザインおよび作成できます。

使用可能なアダプティブフォームコアコンポーネント

アダプティブフォームコアコンポーネントは、標準化されたデータキャプチャコンポーネントです。これらのコンポーネントはカスタマイズ可能で、開発時間の短縮とデジタル登録エクスペリエンスのメンテナンスコストの削減に役立ちます。アダプティブフォームコアコンポーネントに関するドキュメントには、使用可能なコンポーネントの詳細なリストと、各コンポーネントの機能に関する詳細情報が記載されています。また、https://aemcomponents.dev/ では、使用可能なコアコンポーネントの動作を確認できます。

アダプティブフォームのフォームモデルプロパティの編集

  1. アダプティブフォームを選択し、ページ情報プロパティを開く​をタップします。フォームプロパティページが開きます。

  2. フォームモデル」タブをクリックし、フォームモデルを選択します。アダプティブフォームにフォームモデルがない場合は、JSON スキーマまたはフォームデータモデルを自由に選択できます。一方、アダプティブフォームが既にフォームモデルに基づいている場合は、同じタイプの別のフォームモデルに切り替えることもできます。例えば、フォームが JSON スキーマを使用している場合、別の JSON スキーマに容易に切り替えることができます。同様に、フォームがフォームデータモデルを使用している場合は、別のフォームデータモデルに切り替えることができます。

  3. 保存」をタップして、プロパティを保存します。

このページ