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 コネクタ にアクセスします。
- Figma ホームページで、キャンバスの下部にあるツールバーの アクション をクリックし、ダイアログボックスで使用できる検索バーで Adobe Experience Manager (AEM) Assets Connector を検索します。
- 「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 パネルにアクセスします。
AEM アセットのキャンバスへ Figma 読み込み import-aem-assets-into-figma-workflow
Figma デザインインターフェイス内の [1}Adobe Experience Manager(AEM)Assets Connector] パネルにアクセス (#access-aem-assets-connector) て、次の手順を実行します。
-
Adobe Experience Manager(AEM)Assets コネクタ パネルでアセットを検索します。 詳しくは、 アセットセレクターの使用を参照してください。
-
アセットをキャンバスにドラッグ&ドロップするか、アセットを選択して 選択 をクリックして、アセットをキャンバスに移動します。
-
フォルダーパスの
Figma デザインの準備が整ったら、 アセットをAEM Assets リポジトリに書き出すことができます。
リポジトリへのアセット AEM Assets 書き出し export-figma-design-to-aem-assets-folder
Figma デザインインターフェイス内の Adobe Experience Manager (AEM)Assets Connector パネルにアクセスて次の手順を実行し、デザインを AEM Assets リポジトリにエクスポートします。
- Figma デザインを保存する宛先フォルダーに移動します。 既にフォルダー内にいる場合は、フォルダーパスの「その他のオプション」(
- オプション:キャンバス上のアセットをグループ化し、フォルダーにアップロードする 1 つのユニットとして選択します。
-
- ダイアログボックスで、ファイル名を指定し、ファイル形式を選択し、選択した項目 または ページ を選択して、アップロード をクリックして、選択したアセットまたはデザイン全体を宛先フォルダーにアップロードします。
重要な注意点 Limitations-of-using-aem-assets-into-figma
この統合には現在、次のような制限があります。
- AEM アセットを Figma に読み込む場合、サポートされる形式は JPEG、PNG です。
- Figma から AEM Assets にデザインを書き出す場合、サポートされている形式は PNG、PDF、JPG、SVG です。