LoginSignup
0

More than 5 years have passed since last update.

AdobeXDのPlugin開発を始める

Posted at

AdobeXDが無料で触れるようになったみたいです。
Plugin開発も簡単に始められましたので、デザイナーさんの大変な作業を減らしていきましょう。:muscle:

環境構築

HelloWorldしてみる

  • AdobeXDを開く

  • ヘッダーメニューの「プラグイン > 開発版 > 開発フォルダーを表示」を選択

  • Finderから「helloworld」ディレクトリを作成

  • 下記2ファイルを作成

main.js
function sayHello(selection, documentRoot) {
        console.log("Hello World!");
}

module.exports.commands = {
    helloCommand: sayHello
};
manifest.json
{
    "id": "YOUR_ID_HERE",
    "name": "Name of Your Plugin",
    "version": "0.0.1",
    "description": "Description of your plugin.",
    "icons": [],
    "host": {
        "app": "XD",
        "minVersion": "13.0.0"
    },
    "uiEntryPoints": [
        {
            "type": "menu",
            "label": "Hello World",
            "commandId": "helloCommand",
            "shortcut": { "mac": "Cmd+Shift+P", "win": "Ctrl+Shift+P" }
        }
    ]
}
  • ヘッダーメニューの「プラグイン > 開発版 > プラグインを再読み込み」を選択

  • ヘッダーメニューの「プラグイン > 開発版 > Developer Console」を選択

  • ヘッダーメニューの「プラグイン > Hello World」を選択

  • Developer Consoleに「Hello World!」と表示される

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0