# Deep Dive into Atlassian’s Figma file

Source: https://www.youtube.com/watch?v=kwDrigbxls4
Recap page: https://rapidrecap.app/video/kwDrigbxls4
Generated: 2025-11-13T17:14:10.994+00:00

---
## Quick Overview

Jade Jiang and Jay Dalal conduct a deep dive into Atlassian's Figma file structure, emphasizing the use of the Good/Better/Best framework and detailed documentation like the User Journey Mapping Template (UJM) to ensure cross-functional alignment and efficient design handoffs.

**Key Points:**
- The Atlassian Figma file utilizes the Good/Better/Best framework to compare different design approaches, which is found to be useful for communication and iteration.
- The User Journey Mapping Template (UJM) is a critical, well-documented asset used to map out user flows and clearly define context, assumptions, and desired outcomes.
- The team actively uses Confluence for detailed specifications, including a 'Definitions' table that clarifies acronyms and terminology for engineers.
- The file structure is organized clearly with sections like 'Key pages in this file,' 'Good/Better/Best,' 'Empty states,' and 'Populated' screens to manage complexity.
- Jade explains that documenting steps in Figma using video (Loom) links helps provide clear context, especially for asynchronous collaboration with engineers.
- The discussion highlights the importance of having explicit definitions (like for 'Agent vertical name') to avoid miscommunication across large, distributed teams.

![Screenshot at 1:21: Introductory screen showing the title 'Deep dive into Atlassian's Figma File' with Jade Jiang and Jay Dalal, setting the context for a review of Atlassian's design file structure.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-01-21.png)

**Context:** Senior Product Designer Jade Jiang and Host Jay Dalal explore a specific Figma file used by Atlassian for design documentation and collaboration, focusing on how they structure their work to facilitate clear handoffs to engineering teams. The conversation centers on the file's organizational structure, particularly the use of the Good/Better/Best comparison framework and the detailed User Journey Mapping Template (UJM) which aids in context setting and decision-making.

## Detailed Analysis

Jade Jiang and Jay Dalal review Atlassian's organized Figma file structure, which is based on the Good/Better/Best comparison framework to evaluate design options. Jade highlights that this file serves as a central source of truth, linking to critical pages like the Design Spec and the User Journey Map. The UJM template, in particular, is praised for its thorough documentation, including sections for problem statements, assumptions, and hypothesis, which help align cross-functional partners like engineering. Jade notes that she documents processes using Loom videos embedded directly in Figma to provide rich, asynchronous context, which is especially helpful when working with a large design system team. She also details the use of a comprehensive 'Definitions' table in Confluence to standardize terminology (like acronyms) that might otherwise cause confusion during the design-to-dev handoff process. The overall takeaway is that detailed, centralized documentation and structured comparison frameworks significantly improve collaboration efficiency.

### Figma File Structure & Frameworks

- Good/Better/Best framework used for comparing design approaches
- File organized into sections like Discovery, Good/Better/Best, and Empty/Populated states.

### User Journey Mapping Template (UJM)

- UJM is detailed, containing sections for Problem Statement, Hypothesis, Who's it for, and Feedback Wanted
- This template helps set context and align on desired outcomes.

### Documentation Strategy

- Using embedded Loom videos in Figma to explain design rationale asynchronously
- Confluence specs include a detailed 'Definitions' table to align on terminology and acronyms.

### Design Handoff & Collaboration

- Documenting designs with sufficient context (like assumptions and impact) prevents back-and-forth with engineers
- The goal is to create a clear narrative that engineers can easily follow without meetings.

### Component Documentation

- The file includes a dedicated 'Component name' page detailing component variations and usage instructions, showing how to detach and reuse assets.

![Screenshot at 0:01: Jade Jiang and Jay Dalal appear on screen during a design review session in Figma.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-00-01.png)
![Screenshot at 0:04: Jade Jiang points to the 'Good/Better/Best' link on the key pages index, indicating a structured comparison approach.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-00-04.png)
![Screenshot at 0:08: The screen displays the 'Good - Search/filter' section with three design variations for comparison.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-00-08.png)
![Screenshot at 0:26: A complex table titled 'Definitions' outlining key terms like 'Issue key' and 'Repository' with their specific meanings and examples.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-00-26.png)
![Screenshot at 1:26: Jay Dalal welcomes viewers to the deep dive into Atlassian's Figma file structure.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-01-26.png)
![Screenshot at 2:05: The presentation shifts to showing 'Empty states' designs, specifically case '1. has Revodev, no agents + runs'.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-02-05.png)
![Screenshot at 3:35: Jade shows a section of the Confluence page detailing how to use the file, emphasizing documentation.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-03-35.png)
![Screenshot at 4:54: Jay asks a question about the information provided on the Confluence page for developers.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-04-54.png)
![Screenshot at 9:50: A screenshot of the Jira issue list with a hover menu open showing quick actions like 'View issue' and 'Create pull request'.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-09-50.png)
![Screenshot at 11:18: A view of the user journey mapping template showing the four phases: Wonder, Explore, Make, and Impact.](https://ss.rapidrecap.app/screens/kwDrigbxls4/00-11-18.png)