Building user interfaces

While plenty of XD plugins are perfectly suited to run like headless scripts, many plugins will need to interact with the user in some way. XD plugins can display UI in the form of modal dialogs, built with JavaScript and a supported subset of HTML and CSS. For simple alerts and messages, we've also built various helpers which make it easy to display important messages, get user feedback, and more. The tutorials in this section will focus on the UI you can generate using these helpers. Should you need more power than these helpers provide, you can learn more by reading the User Interface design section and our User Interface API references.

The tutorials contained in this section will get you on your way to building plugin UI well-suited for XD utilizing the Plugin Toolkit library. Before continuing, please ensure that you install the tooklit in your project, as follows:

  • Click the "Clone or Download" button on the right side of the Plugin Toolkit page
  • Uncompress the zip file after the download completes
  • Copy the lib folder to your plugin project

Now you're ready to display simple messages to your users!

More complex UI

There are a lot of ways to render more complex UI. Check out our plugin design documentation to learn more about UX patterns and creating UI.

results matching ""

    No results matching ""