Deep Dive into Atlassian’s Figma file

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.

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.

Raw markdown version of this recap