Figma Live Embed GitLab integration

Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.

• Close this issue

Problem

Designs that are added to issues and merge requests are static in nature (typically jpg or png images), and require manual updating or new references when changes occur.

Solution

Figma has a Live Embed feature where evergreen designs can be embedded into a webpage. While this wouldn’t have to be used every time a design is part of an issue, it would be beneficial during a period of iteration, exploration, or async reviews.

Benefits

• Evergreen design
• Anyone could view the design without needing to leave GitLab
• Not limited to design; storyboards, flows, and presentations could all be embedded without needing to upload cumbersome images or many images to tell a story
• Users can explore multiple frames (artboards) and focus in on different aspects at will
• Users can open the design in full screen without leaving the issue

Docs

• Introducing Figma’s Live Embed Kit
• How Live Embed works
• Figma Live Embed kit

Examples

• Live embed for Jira and Trello
• Live embed in Notion
• Live embed with Dropbox Paper
• Live embed in Spectrum chat
• Live embed in Clubhouse
• Live embed in Linear

Questions

• How do we ensure the security of an embedded iFrame?
• Could this feature also be part of the designs tab?
• Could we also leverage Figma’s API to connect commenting in the Designs tab with commenting in Figma?
• What other design tools could we support in this way (Sketch, Framer, CodePen, etc.)?
• Would the embed code be manually pasted into the description, or could we add an “embed” button as part of the editor controls which then accepts the embed code?

---

/cc @gitlab-com/gitlab-ux/designers @mikelong @phikai @cdybenko