StoriesOnBoard is a user story mapping tool to help remote teams understand the user needs, prioritize the right ideas, and collaborate with everyone on your user story map. Users with view-only rights to the story plans have free access to the tool.

Use the Figma live embed in StoriesOnboard to:

• Add Figma mockups and live design files to story card descriptions
• Access the latest version of the Figma file from the story card
• Zoom and pan around the embedded Figma file to view details of your designs or use full screen mode

Embed a Figma file

User story maps give you a view of the entire development process, while individual cards allow you to create connections between your goals and tasks.

You can add Figma links to your card descriptions to access the latest version of your design files.

In Figma

1. Open the file you want to embed in your card description.
2. To link to a specific frame in the Figma file, select the frame you'd like to embed.
3. Click the Share button in the toolbar.
4. Check the box to Link to selected frame (optional)
5. Update your Link Sharing permissions to determine who can view and interact with the file embed.
6. Click Copy link.

In StoriesOnBoard

1. Open the user story you want to add a Figma file to.

2. Select the card to open the description.

3. Click the Insert embed resource icon.

   

4. Paste the link in the field provided and click Insert embed link.

5. Click Save to apply your changes to the description.

6. Your live design will be ready to preview from the card description. Pan around the file, use the and to adjust the zoom, or click or view it in full screen mode.
   

Remove a Figma file

There is no direct integration between Figma and StoriesOnBoard. To remove a Figma file from StoriesOnBoard, you only need to remove the file link from the story card.

1. Open the story you want to remove the file from.
2. Click to edit the card's description.
3. Select and delete the link for the Figma file from the description.
4. Click Save to apply your changes.