Figma Integration

To use the Figma integration, you need to have a Figma account and a Figma file with the designs you want to use.

Connecting to Figma

1. Go to the Figma integration on the connections page
2. Add the figma token (How to get a Figma token is described in the How to get a Figma token section)
3. Click on “Save and test”
4. You will get feedback on whether the connection was successful or not.

How to import multiple designs at once

1. Go to the wizard page
2. If necessary, add the token to the connection. You can add a team-wide token for the whole organization or a personal token for this project only.
3. Add the link to the Figma file to the wizard.
4. Select the correct Artboards from the dropdown.
5. Click on “Import”. All artboards will be imported as separate sources in storywise, and you will be able to create original sentences from each of them.

Link single frames to user stories

1. Go to the story detail view.
2. Click on the “Add Media” button.
3. Select the “Figma” option.
4. Select the correct Artboard/Frame from the dropdown.
5. Click on “Add”.

On Updating Designs

If you update the designs in Figma, you can pull the updates into storywise by clicking on the “Update all Figma screens” button. Without manual intervention, this will not happen. The reason for this is that storywise is to create specifications, which should be as stable as possible. So if your designers update the designs, you should first create a new document version. Then you can pull the updates into storywise by clicking on the “Update all Figma screens” button at the media page

How to get a Figma token

Follow these steps to create your team token:

1. Log in to your Figma account.
2. Go to account settings in the menu in the top left of Figma.
3. Find the section with personal access tokens.
4. Click on “Create new token”.
5. Copy the created token and paste it into storywise.

Note: This is the only opportunity to copy the token. Otherwise you will need to create a new token.