Slickplan Help File Management Design Mockups

Importing from Figma

Easily import your design layouts from Figma into Slickplan’s Design Mockups to share your work, centralize team and customer collaboration, and streamline website planning.

To import with direct sync:

  1. Go to the Designs section in your site planning project’s navigation bar.

    design tab

  2. Click the Upload mockups button in the upper right corner.

    upload mockup button

  3. Choose Direct Sync (Select Figma files) from the menu to link your Figma account with Slickplan.

    click direct sync

  4. Click Connect account.

    connect account

  5. Grant permission by clicking Allow access in the pop-up window.

    allow access

  6. Enter your Figma Team ID in the designated field, then click Submit Figma Team ID to complete the connection.

    figma team ID

  7. Select your desired Figma project and design file for import using Direct Sync.

    figma form

  8. Click the Submit Figma file button once you choose.

    submit figma

  9. To assign imported designs to specific pages in your sitemap, check the box next to each desired file name.

    check to import

  10. Select a page from the drop-down menu under the thumbnail to assign the design.

    page dropdown

  11. Click Apply changes on the bottom bar.

    apply design changes

  12. Then, click Save & add mockups to finish.

    save add mockups

    Your chosen Figma designs are now linked to the assigned sitemap pages.

    assigned design

To import manually:

  1. Choose Skip this under the Direct sync connection method.

    skip this

  2. Paste the Figma file URL in the pop-up window, and click Add.

    add figma url

  3. Repeat for more files, then click Add files to start importing.

    add more files url

  4. To assign designs to sitemap pages, please refer to steps 9-12 in the instructions provided above.