How to import mockups from Figma?

  1. To import designs from Figma to your Slickplan project, open Design Mockups from the navigation bar above the sitemap.

    01._design_mockups_above_the_sitemap.png

  2. Click on Upload Mockups.

    002._upload_mockups.png

  3. Select the Direct Sync (import from Figma) option.

    02._select_import_options.png

  4. Click on Connect Account and in the modal window, click on Allow Access.

    Screen_Shot_2022-10-21_at_2.31.24_PM.png

  5. Enter your Figma Team ID and click on Submit.

    006._connect_figma.png

  6. Select a project, a file and click the Submit Figma file button.

    007._submit_figma_files.png

  7. Assign images to one or multiple pages. Assign a single image to a page by selecting the page from the dropdown list, or assign multiple images to a page by checking the boxes above the image previews and clicking Assign from the bottom bar.

    03._assign_pages.png

  8. Confirm by clicking the Done button on the right. Design mockups are now attached to the sitemap pages.

Additionally, you can manually enter a URL for each Figma file by clicking on Skip this below:

008._skip_this.png

  1. In the modal window, enter a Figma file URL and click on Add this URL below the text field.

    008._figma_file_URL.png

  2. When the file loads, click on Add files.

    009._upload_files_manually.png

  3. To assign images to pages, repeat steps 7 and 8 above.
Have more questions? Submit a request