Figma Plugin
      Back to home
      1. Support
      2. Tiled Plugins
      3. Figma Plugin

      Syncing with Plugins Overview

      "Syncing" is the process of uploading your artboards from Adobe XD, Figma or Sketch to the Tiled Builder through the Tiled Plugin. Syncing significantly improves the speed of creating microapps by allowing designers to move seamlessly from design tool to Tiled Builder.

      When syncing from your design tool to Tiled, you can bring over your artboards/frames. 

      • Artboards or frames are synced as microapp assets. However, the artboards or frames that match the size of the microapp adaptive format will also be used to create microapp pages (the assets will be configured as background images for the pages).

      Smart Syncing Artboards or Frames

      Smart syncing takes out a few steps of the syncing process for you automatically, by predetermining where and how to sync your artboard or frame based on size.

      1. Cover image: The plugin will detect the artboard or frame size that matches the Tiled cover image (252x112) and sync it as an asset as well as automatically configure it as a microapp cover in Tiled

      2. Unsynced artboards or frames: The plugin will detect the artboard size and pre-select the adaptive format it matches too

      3. Previously synced artboards or frames: The plugin will remember the adaptive format it was previously synced too, at the artboard or frame level, (not the design file level)

      'Smart Syncing' does not apply to Figma at this time. Please check back for updates.

      ⚠️ Important Note

      If you create an artboard or frame that has the same aspect ratio as a microapp adaptive format, but the dimensions are not exact, the following will happen:

      • The plugin will not be able to detect and pre-select the adaptive format in the sync modal.
      • The artboard or frame will still come over to Tiled as a page (this is assuming the adaptive format exists in your microapp).
       

      Assign Library category for a microapp from the plugin

      Assigning existing categories and creating new categories help streamline your design flow. This process is expedited even further by assigning microapps to categories from the plugin when syncing. You must be an Admin or Editor in your Tiled account to access the Tiled plugin.

      1. Login to the Tiled plugin.
      2. In the plugin side panel click +New to create a new microapp. You will see a dropdown labeled Tiled category in the New Microapp modal.
      3. Click the Tiled category dropdown.
      4. If you do not see a category for your microapp, select Create a new category, otherwise proceed to step 6.
      5. Name the new category. Be sure you have the correct library selected.
      6. Click Create.
      7. The microapp will be created in the library and category you have selected. Note: the microapp has not been published yet. The microapp will only be visible admins or editors, until published.

      Plugin UI may vary. The Sketch and Figma versions will appear nearly identical to the Adobe XD plugin.

      Tiled Plugins FAQs

      To get started with our Tiled plugins read the Adobe XD, Figma, or Sketch articles.

      What happens if I sync my adaptive sized artboards?

      For unsynced artboards, the plugin will detect the artboard size and pre-select the adaptive format it matches too.

      For synced artboards, the plugin will remember the adaptive format it was previously synced to, at the artboard level, not the design file level.

      If I have an artboard the size of a microapp adaptive format, but I don't have the adaptive format created in my microapp, what can I expect to happen when syncing?

      The plugin will ask you which existing adaptive format you would like to sync to.

      If I have only one adaptive format for my microapp and select any sized artboards, what can I expect when syncing?

      The plugin will recognize you only have one adaptive format and pre-select the adaptive format in the sync modal and the artboards will sync over.

      Will the plugin allow me to sync a desktop-wide and a mobile portrait adaptive format artboard simultaneously?

      The plugin cannot sync to multiple formats to a microapp at the same time. The designer will have to separate the syncs depending on the format. If the designer has selected artboards from two different adaptive formats, the syncing modal will prompt the user to select a specific format to sync to.

      If I have selected an artboard the size of a Tiled cover image (252x112), what can I expect to happen when syncing?

      The plugin will identify the artboard as a cover image and automatically configure it as the cover image for your microapp in Tiled. If the artboard has not been previously synced and you have more than one adaptive format, the sync modal will require you to pick an adaptive format. The adaptive format you choose will also have the cover image-sized artboard come over as an asset.If the artboard has been previously synced, the sync modal will remember the previously synced adaptive format. When syncing is complete you will see the cover image-sized artboard update in Tiled and come over as an asset.

      If I have selected two or more artboards the size of a Tiled cover image (252x112), what can I expect to happen when syncing?

      The sync modal will bring both artboards over as assets, but will not automatically configure either as your microapp cover image.

      If I have an artboard that has the same aspect ratio as an adaptive format but the dimensions are not exact, what can I expect to happen when syncing?

      The plugin will not be able to detect and pre-select the adaptive format in the sync modal.
      The artboard will still come over to Tiled as a page. (this is assuming the adaptive format exists in your microapp).