AEM Assets と Figma の統合 integrate-aem-assets-with-figma

AEM Assets は、Figma とネイティブに統合されているので、デザイナーは Figma ユーザーインターフェイス内から AEM Assets に保存されているアセットに直接アクセスできます。 AEM Assets で管理されているコンテンツを Figma キャンバスに配置してから、新しいコンテンツや編集したコンテンツを AEM Assets リポジトリに保存することができます。

開始する前に prerequisites-for-aem-assets-and-figma-integration

  • AEM のリリースバージョン 19149 以上が必要です。

  • AEM Assets を Figma と統合するには、有効な AEM Assets ライセンスと Figma ライセンスが必要です。

Adobe Experience Manager(AEM)Assets コネクタへのアクセス ​ access-aem-assets-connector

次の手順を実行して、Adobe Experience Manager(AEM)Assets コネクタ ​ にアクセスします。

  1. Figma ホームページで、キャンバスの下部にあるツールバーの アクション をクリックし、ダイアログボックスで使用できる検索バーで Adobe Experience Manager (AEM) Assets Connector を検索します。
  2. 「Adobe Experience Manager (AEM) Assets Connector」を選択すると、Adobe Experience Manager (AEM) Assets Connector パネルが表示されます。 このパネルを使用して AEM アセットをキャンバスに読み込みす Figma 。
    アクション
    または、Figma のコミュニティで使用可能な Adobe Experience Manager (AEM) Assets Connector にアクセスして、「次のウィンドウで開く…」をクリックし、最近のファイルを選択するか、新しいファイルを作成します。次に、「実行」をクリックして、Adobe Experience Manager (AEM) Assets Connector パネルにアクセスします。
    plugin-page-on-figma-community
NOTE
AEM 環境にログインした後に ネットワークエラー メッセージが表示された場合は、Adobe サポートにお問い合わせください

AEM アセットのキャンバスへ Figma 読み込み import-aem-assets-into-figma-workflow

Figma デザインインターフェイス内の [1}Adobe Experience Manager(AEM)Assets Connector] パネルにアクセス (#access-aem-assets-connector) て、次の手順を実行します。

  1. Adobe Experience Manager(AEM)Assets コネクタ ​ パネルでアセットを検索します。 詳しくは、 アセットセレクターの使用を参照してください。

  2. アセットをキャンバスにドラッグ&ドロップするか、アセットを選択して 選択 をクリックして、アセットをキャンバスに移動します。

  3. フォルダーパスの 3 つのドット をクリックすると、現在の階層内のすべての親フォルダーと子フォルダーが表示されます。 その場所に移動するフォルダーを選択します。
    3 ドット

Figma デザインの準備が整ったら、 アセットをAEM Assets リポジトリに書き出すことができます。

リポジトリへのアセット AEM Assets 書き出し export-figma-design-to-aem-assets-folder

Figma デザインインターフェイス内の Adobe Experience Manager (AEM)Assets Connector パネルにアクセスて次の手順を実行し、デザインを AEM Assets リポジトリにエクスポートします。

  1. Figma デザインを保存する宛先フォルダーに移動します。 既にフォルダー内にいる場合は、フォルダーパスの「その他のオプション」( 3 つのドット )をクリックして、別の宛先フォルダーを選択します。
  2. オプション:キャンバス上のアセットをグループ化し、フォルダーにアップロードする 1 つのユニットとして選択します。
  3. ファイルのアップロード アップロード をクリックして、アセットをアップロード ダイアログボックスを表示します。
  4. ダイアログボックスで、ファイル名を指定し、ファイル形式を選択し、選択した項目 または ページ を選択して、アップロード をクリックして、選択したアセットまたはデザイン全体を宛先フォルダーにアップロードします。
    figma デザインをアップロード

重要な注意点 Limitations-of-using-aem-assets-into-figma

この統合には現在、次のような制限があります。

  • AEM アセットを Figma に読み込む場合、サポートされる形式は JPEGPNG です。
  • Figma から AEM Assets にデザインを書き出す場合、サポートされている形式は PNGPDFJPGSVG です。
recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab