[CONTENT]
$
USD
Total Economic Impact
Cost Savings And Business Benefits Enabled By Dev Mode
A FORRESTER TOTAL ECONOMIC IMPACT STUDY COMMISSIONED BY Figma, August 2025
Total Economic Impact
A FORRESTER TOTAL ECONOMIC IMPACT STUDY COMMISSIONED BY Figma, August 2025
As organizations increasingly recognize the growing influence of design, workflow tools are evolving to foster deep collaboration among cross-functional teams, including developers and business stakeholders.1 Because an organization’s competitive advantage often depends on its digital products and because a poor developer experience can lead to measurable losses, it’s crucial to keep the developers of that software engaged and effective.2 A positive developer experience can help teams ship better products faster.
Figma’s Dev Mode gives designers and developers a space to improve collaboration during the product development process while opening better lines of communication and reducing frustration by helping developers easily find the right information to build applications. The solution gives developers an integrated space within Figma to have important context from their design counterparts to improve collaboration, efficiency, and ultimately product quality.
Figma commissioned Forrester Consulting to conduct a Total Economic Impact™ (TEI) study and examine the potential return on investment (ROI) enterprises may realize by deploying Dev Mode. The purpose of this study is to provide readers with a framework to evaluate the potential financial impact of Dev Mode on their organizations.
Figma commissioned Forrester Consulting to conduct a Total Economic Impact™ (TEI) study and examine the potential return on investment (ROI) enterprises may realize by deploying Dev Mode.3 The purpose of this study is to provide readers with a framework to evaluate the potential financial impact of Dev Mode on their organizations.
To better understand the benefits, costs, and risks associated with this investment, Forrester interviewed four decision-makers with experience using Dev Mode. For the purposes of this study, Forrester aggregated the experiences of the interviewees and combined the results into a single composite organization, which is a business-to-business-to-consumer (B2B2C) enterprise with revenue of more than $5 billion per year.
Interviewees stated that before using Dev Mode, their organizations relied on a combination of design-handoff tools, static documentation, and manual communication between designers and developers. However, prior attempts yielded limited success, resulting in inconsistent implementation of designs, duplicate work, and frequent misalignment between design and engineering teams. These limitations led to slower development cycles, increased QA overhead, and caused frustration for cross-functional teams.
Interviewees reported that following the investment in Dev Mode, there was a marked improvement in collaboration between design and development teams. They said developers gained direct access to version-controlled design specifications, style code translations, components, and design system assets within the Figma environment, reducing reliance on designers for clarification. This self-service access enabled developers to begin implementation work more quickly, eliminating the need for frequent handoff meetings and forcing developers out of their workflows, which reduced delays. As a result, teams experienced faster and more accurate development cycles with fewer instances of rework, and the improved clarity and autonomy contributed to higher-quality outputs and enhanced developer satisfaction.
Quantified benefits. Three-year, risk-adjusted present value (PV) quantified benefits for the composite organization include:
Developer efficiency improvements worth $10 million over three years. Adopting Figma’s Dev Mode leads the composite organization to a measurable increase in developer efficiency during the design-to-code handoff. Developers gain direct access to designs deemed ready for development, style codes, components, and variables, which allows them to begin implementation without waiting for clarification or attending handoff meetings. This reduces redundant communication, accelerates the build phase, and enables the developers to work more independently and confidently. The composite saves a significant amount of time, improves productivity, and reduces context switching, leading to a 20% to 30% increase in developer output and more than 90 minutes of weekly time savings per developer.
A nearly $2 million increase in profit. Accelerating the design-to-development workflow significantly shortens the composite’s time to market, which allows its teams to release features and products faster and generate revenue sooner. Prior inefficiencies in the handoff process caused delays and rework, but using structured, inspectable design files streamlines implementation. Developers can directly access embedded specifications and production-ready code, reducing the need for clarification and minimizing errors. These improvements lead to faster delivery, reduced testing time, and earlier profit realization.
Decreased business risk worth $198,000. Figma’s Dev Mode reduces the composite’s business risk by ensuring consistent implementation of designs, improving adherence to brand and accessibility standards, and minimizing costly rework or compliance violations. Before the adoption, fragmented systems and unclear design translations increased the risk of errors, noncompliance with regulatory issues, and associated fines. With Dev Mode, the composite’s developers access precise specifications and code directly, which reduces ambiguity and ensures alignment with design intent. This clarity helps the composite maintain quality, avoid reputational damage, and meet legal accessibility requirements more reliably.
Unquantified benefits. Benefits that provide value for the composite organization but are not quantified for this study include:
Improved use of IT resources. Interviewees said Dev Mode allows teams to replace custom-built internal plugins, which frees up IT teams to focus on higher-value projects. IT teams can also utilize plugins if they choose. Additionally, this shift enhances innovation and productivity of development and engineering teams, allowing increased production of quality work product.
Improved developer experience and retention. By removing repetitive manual tasks and reducing back-and-forth with designers, interviewees said Dev Mode streamlines the development process, which leads to a more satisfying work environment and contributes to improving developer morale and retention. When presented with the idea of taking away Dev Mode, one interviewee said, “I can’t imagine working without it.”
Improved value of the design system. Interviewees said Dev Mode makes design systems more accessible and actionable, allowing developers to quickly use standardized components and follow consistent patterns. They explained that this speeds up development, reduces errors, and helps teams build more maintainable and cohesive products. One interviewee’s organization measured more than $4 million dollars in “reuse value,” projecting up to $10 million by year three.
Improved design-engineering culture. The interviewees said Dev Mode fosters a collaborative workflow between designers and engineers, replacing the traditional handoff model and encouraging clearer communication, mutual understanding, and a more integrated approach to product development.
Costs. Three-year, risk-adjusted PV costs for the composite organization include:
Figma’s Dev Mode enterprise licenses costs. Enterprise license costs are based on the number of seats. Each month, the composite organization pays $90 per full seat and $35 per developer seat. With an increasing number of seats during the three-year investment period, its total license costs are $1.5 million.
Internal costs to deploy Dev Mode. The composite organizations invests in training and enablement (e.g., workshops, documentation, learning resources) to support the adoption of Dev Mode, and most of the effort is concentrated during the first year. Implementation requires coordination across teams, pilot testing, and change management, which requires the effort of one full-time role for three months. Ongoing administrative tasks are minimal, involving light weekly and quarterly license management. The composite’s internal costs to deploy Dev Mode are $707,000.
The financial analysis that is based on the interviews found that a composite organization experiences benefits of $10.1 million over three years versus costs of $2.2 million, adding up to a net present value (NPV) of $7.9 million and an ROI of 351%.
Return on investment (ROI)
Benefits PV
Net present value (NPV)
Payback
| Role | Industry | Region | Employees |
|---|---|---|---|
| Systems designer | Fitness | Global | 2,900+ |
| Distinguished technologist | High-tech | Global | 50,000+ |
| Senior product lead, workflow effectiveness | Entertainment | Global | 6,500+ |
| Chief design officer | Financial services | Australia | 39,000+ |
The interviewees described a range of challenges in their organizations’ design-to-development workflows prior to adopting Figma’s Dev Mode. These challenges included inefficient handoff processes, redundant engineering work, quality and compliance risks, and lack of transparency and tooling for developers. These issues not only slowed product development, but they also introduced risk and increased operational overhead.
Interviewees noted how their organizations struggled with common challenges, including:
Inconsistent and inefficient handoff processes. Prior to adopting Figma’s Dev Mode, interviewees’ organizations struggled with fragmented and manual handoff processes between design and engineering teams. The senior product lead, workflow effectiveness, at an entertainment company said the absence of a standardized workflow led to significant variability across teams: “Within our design process, the handoff was very inconsistent because we lacked tooling to make it a repeatable procedure. For example, an engineer and designer might have a good relationship and feel that we’re working efficiently. But when we [would interview] those pairs, we found that even where that handoff process was being successful, it [wasn’t] a repeatable process. That led to massive handoff inconsistencies across the organization. As a result, there were inconsistencies in the quality of work that designers were handing over to engineering or what engineering was implementing.”
Similarly, the systems designer at a fitness company said developers there relied on 1-hour handoff meetings to walk through design specifications and annotations: “[Prior to using Dev Mode,] we would have [hourlong] handoff meetings where designers and engineers looked through design details and highlighted certain areas as something we needed to remember when we [went] to build this. Now, designers and developers communicate through [Dev Mode] by leaving comments and annotations while they work, versus needing that extra meeting beforehand.”
The chief design officer in financial services said their company’s waterfall-style process further exacerbated inefficiencies, with designers and developers working in silos: “We were very much an old-school, waterfall-style shop where designers would work on their thing, and when the work was ready to hand off, they would literally throw it over the transom, and that was it. What might come at the end of the machine may or may not bear any resemblance to what was designed.” The interviewee explained that these inefficient handoffs delayed development, increased the risk of miscommunication, and consumed valuable time from both designers and engineers.
Redundant and inconsistent code implementation. Without a unified design-to-code workflow, engineering teams frequently recreated the same components in different ways, leading to redundancy and inconsistency. The senior product lead at an entertainment organization noted, “There were something like 93 implementations of that [button] coded in different ways.” This illustrated the scale of duplication and the lack of standardization.
The chief design officer at the financial services firm said the absence of reusable components and consistent handoff practices led to repeated testing and rework: “[With Dev Mode,] we’re seeing testing savings on average of 85% to 90%.”
Quality, accessibility, and compliance risks. Interviewees also described significant risks to product quality and compliance stemming from inconsistent implementation practices. The senior product lead in the entertainment industry said that before using Dev Mode, designers at their organization often detached components from the design system, introducing variability and risk. They said, “These risks became tangible when the company faced legal action due to accessibility noncompliance.”
The distinguished technologist in high-tech noted that when their firm’s developers detach components, they introduce risks to the quality of the final product because detached components might lose key attributes (e.g., accessibility, brand consistency, design integrity). For example, accessibility features like alt text or color contrast compliance may not be applied correctly, posing risks for compliance with regulations like Section 508. They said: “If we cannot fill them automatically, the user needs to input something … otherwise, it’s flagged as a showstopper.” These issues underscored the need for tooling that could enforce accessibility standards and reduce human error.
Lack of visibility and transparency in design revisions. A lack of visibility into design changes created confusion and inefficiencies during implementation. The systems designer at the fitness company explained that developers could only view the most recent version of a design and had no insight into what had changed: “Prior to Dev Mode, you really could only see the latest version of a screen unless the designer made multiple versions of it and annotated it themselves manually. But with Dev Mode, you can just click through the version history of a particular screen and see the evolution of a design.” This lack of transparency often led to follow-up meetings and clarification requests, which disrupted workflows and extended project timelines.
Manual and time-consuming documentation and specification. Interviewees said that before using Dev Mode, teams spent significant time manually documenting designs and generating code snippets. The distinguished technologist at the high-tech firm noted that prior to Dev Mode, documentation was labor-intensive: “We don’t have to put too much effort on the documentation site anymore.”
The chief design officer in financial services said their firm faced similar challenges, with designers required to manually annotate and redline designs: “The amount of time spent manually redlining … it was an abomination.” These manual processes delayed handoffs and diverted time away from higher-value design work.
Developer friction and context switching. Developers frequently experienced friction due to the need to switch between their development environments and design tools. This context switching not only disrupted their workflows, but it also introduced unnecessary cognitive overhead. The distinguished technologist in the high-tech industry explained that developers at their firm were required to open Figma and navigate its interface — which was often unfamiliar territory for engineers — just to inspect design specifications: “Before using Dev Mode, we had begun developing internal plugins to replicate some of the functionality that Dev Mode would later provide natively.”
Based on the interviews, Forrester constructed a TEI framework, a composite company, and an ROI analysis that illustrates the areas financially affected. The composite organization is representative of the interviewees’ organizations, and it is used to present the aggregate financial analysis in the next section. The composite organization has the following characteristics:
Description of composite. The composite organization is a global, multibillion-dollar B2B2C enterprise with annual revenues of $5 billion, of which 70% is consumer-facing and 30% is B2B. It serves a diverse customer base through both direct and partner channels, offering digital products and services that require continuous design and development innovation. The organization employs 5,000 people, including between 100 and 1,000 designers and a similar number of developers, with an average of 3,000 total users engaged in design-to-development workflows. Headquartered in a major metropolitan region, the organization operates across multiple geographies and maintains a strong digital presence to support its global operations.
Deployment characteristics. The composite organization begins using Figma in 2019 and initiates a trial of Dev Mode with a limited group of developers in 2023. Following successful early adoption, the organization expands usage to a broader team in 2024 and completes a full rollout to all developers by 2025. The deployment is phased across all operational regions and teams, replacing legacy design handoff tools in stages. The composite begins gradually reducing contracts for previously used design collaboration tools in 2022 and expects to fully eliminate them by the end of 2025. The organization aims to unify design and development workflows, improve collaboration, and streamline the translation of design into code.
B2B2C organization
$5B annual revenue
30% of revenue is from B2B
70% of revenue is consumer-facing
5,000 employees
3,000 average users
100 to 1,000 designers
100 to 1,000 developers
| Ref. | Benefit | Year 1 | Year 2 | Year 3 | Total | Present Value |
|---|---|---|---|---|---|---|
| Atr | Developer efficiency | $465,920 | $2,795,520 | $6,988,800 | $10,250,240 | $7,984,700 |
| Btr | Increased profit due to faster time to market | $640,000 | $800,000 | $960,000 | $2,400,000 | $1,964,237 |
| Ctr | Decreased business risk | $80,000 | $80,000 | $80,000 | $240,000 | $198,948 |
| Total benefits (risk-adjusted) | $1,185,920 | $3,675,520 | $8,028,800 | $12,890,240 | $10,147,885 |
Evidence and data. Interviewees said one of the most immediate and measurable benefits of adopting Figma’s Dev Mode was an increase in developer efficiency during the design-to-code handoff. Prior to Dev Mode, developers frequently encountered delays due to unclear specifications, inconsistent file versions, and the need to confirm design intent through messaging applications, meetings, or manual redlining. These inefficiencies not only slowed down development but also introduced quality risks and rework.
After implementing Dev Mode, developers were able to directly inspect finalized designs, access tokens and variables, and confidently begin implementation without waiting for clarification. This shift enabled teams to reduce time spent on handoff, eliminate redundant communication, and accelerate the build phase. Finally, developers gained the ability to work more independently and confidently, reducing inefficient context switching.
Interviewees described how Figma’s Dev Mode allowed their organizations’ developers to increase productivity:
The senior product lead in the entertainment industry estimated a 20% to 30% increase in developer productivity driven by reduced time spent on repetitive tasks (e.g., inspecting designs, searching for code, clarifying design specifications). They described conducting an ROI analysis for a feature available within Dev Mode called Code Connect that displays real-time code from an organization’s production system: “By driving engineers to use Dev Mode and thus Code Connect, we would be incurring cost to buy Dev Mode licenses. While we incur extra license costs, the ROI of what we’re saving in terms of engineering efficiency far outweighs that initial investment. Code Connect is a valuable resource for engineers, allowing us to quickly access and retrieve code, rather than having to read the design system documentation and then navigate to our internal GitHub [repository] to find the component. The component is presented to you, and Code Connect even has VS Code integration, so engineers don’t even need to leave their IDEs (integrated development environments); it’s all there, and developers are very grateful for that. We were able to drive massive efficiencies. We had to triple check the number because it was so high, but it was 560%.”
Interviewees explained that by using Jira Dev Mode, developers and designers can access ticket context, update statuses, and leave comments directly within one platform, reducing the need to switch tools and saving time overall. The systems designer at the fitness organization said: “We rely heavily on the integration with Jira, which is a big time-saving aspect for our developers. All our work scopes have tickets in Jira linked directly to the designs in Dev Mode. The developers and designers see all the context of the ticket in Dev Mode, and they don’t have to go into Jira. Being able to do all your work in Dev Mode without switching platforms saves time.”
The distinguished technologist at the high-tech firm conducted an internal survey of approximately 200 developers to measure the impact of Figma’s Dev Mode and build a business case for its adoption. The survey revealed that developers were saving an average of 98 minutes per week due to features like code snippets, streamlined design-to-development integration, and reduced context switching. Most of the time savings were attributed to developers because Dev Mode simplified processes such as inspecting designs and interpreting specifications.
Modeling and assumptions. Based on the interviews, Forrester assumes the following about the composite organization:
The composite has 50 developers using Dev Mode in Year 1, 300 in Year 2, and 750 in Year 3.
There are 2,080 working days in a year.
Developers spend 25% of their time programming and writing code.4
Developers spend 11% of their time testing and performing QA.5
Developers spend 18% of their time in business analysis or design.6
With Dev Mode, developers save 15% of the time they spend on programming.
With Dev Mode, developers save 25% of the time they spend on testing and QA.
With Dev Mode, developers save 75% of the time they spend on business analysis and design improvement.
Of the time developers save, 50% is recaptured for work on other tasks and initiatives. This is a conservative estimate.
Risks. Developer efficiency improvement may vary by:
The total number of developers.
The size and scope of the organization.
The geographic location of the organization, which impacts salaries.
Results. To account for these risks, Forrester adjusted this benefit downward by 20%, yielding a three-year, risk-adjusted total PV (discounted at 10%) of $8 million.
Time savings for developers on business analysis and rework
| Ref. | Metric | Source | Year 1 | Year 2 | Year 3 | |
|---|---|---|---|---|---|---|
| A1 | Developers | Composite | 50 | 300 | 750 | |
| A2 | Working time for developers (hours) | Composite | 2,080 | 2,080 | 2,080 | |
| A3 | Percent of time spent programming | Forrester research | 25% | 25% | 25% | |
| A4 | Percent of time spent testing or Q/A | Forrester research | 11% | 11% | 11% | |
| A5 | Percent of time in business analysis or design | Forrester research | 18% | 18% | 18% | |
| A6 | Percent of time saved during programming with Dev Mode | Interviews | 15% | 15% | 15% | |
| A7 | Percent of time saved during testing with Dev Mode | Interviews | 25% | 25% | 25% | |
| A8 | Percent of time saved during business analysis or design improvement with Dev Mode | Interviews | 75% | 75% | 75% | |
| A9 | Time saved during programming (hours) | A1*A2*A3*A6 | 3,900 | 23,400 | 58,500 | |
| A10 | Time saved during testing (hours) | A1*A2*A4*A7 | 2,860 | 17,160 | 42,900 | |
| A11 | Time saved during business analysis or design (hours) | A1*A2*A5*A8 | 14,040 | 84,240 | 210,600 | |
| A12 | Total time saved (hours) | A9+A10+A11 | 20,800 | 124,800 | 312,000 | |
| A13 | Fully burdened hourly rate for a developer | Composite | $70 | $70 | $70 | |
| A14 | Productivity recapture | TEI methodology | 40% | 40% | 40% | |
| At | Developer efficiency | A12*A13*A14 | $582,400 | $3,494,400 | $8,736,000 | |
| Risk adjustment | ↓20% | |||||
| Atr | Developer efficiency (risk-adjusted) | $465,920 | $2,795,520 | $6,988,800 | ||
| Three-year total: $10,250,240 | Three-year present value: $7,984,700 | |||||
Evidence and data. One key driver of increased revenue was the acceleration of the design-to-development workflow, which interviewees said enabled teams to ship features and products to market more quickly and capture revenue earlier. They explained that before using Figma’s Dev Mode, design and engineering teams experienced inefficient workflows during the handoff process due to fragmented communication, unclear or outdated design specifications, and the need to manually extract assets or measurements from static design files. These inefficiencies frequently led to meetings, emails, and messaging threads to clarify design intent, resulting in rework cycles. These delays caused slowdowns in sprint velocities and extended product release timelines.
After implementing Figma’s Dev Mode, developers gained direct access to structured, inspectable design files that included embedded specifications, assets, and documentation. Interviewees said Dev Mode eliminated the need for redundant clarification meetings, enabling engineering teams to begin implementation immediately after design approval or after a design was marked as “Ready for dev” in Dev Mode.
Interviewees shared several examples of how Dev Mode accelerated delivery:
The chief design officer at the financial services organization said: “We’ve seen testing savings on average of 85% to 90% reduction. For example, the previous version of the same capability required approximately 126 people-hours to complete the testing. When developers reused the component for the first time, that testing took less than one day. This has made delivering features and capabilities significantly faster.”
The systems designer at the fitness organization said: “With Code Connect, our Android developers can copy the exact production-ready code for components directly from Dev Mode. This removes the need for trial and error or searching through documentation. It’s a huge time saver and makes implementation much faster.”
The distinguished technologist at the high-tech organization said: “Dev Mode ensures that what you see is what you get. Before, developers had to interpret designs, which led to mistakes, such as misalignments or missing elements. Now they get exact code snippets that match the designer’s intent. Using approved code snippets reduces the risk of errors, ensures pixel-perfect quality, and avoids delays caused by rework.”
These improvements enabled the interviewees’ organizations to launch revenue-generating features earlier, thereby generating additional profit.
Modeling and assumptions. Based on the interviews, Forrester assumes the following about the composite organization:
The total annual revenue for the composite organization is $5 billion.
With Dev Mode, the composite designs and ships products faster by 0.2% in Year 1, 0.25% in Year 2, and 0.3% in Year 3.
The composite has an operating margin of 8%.
Risks. The increase in profit due to faster time to revenue may vary by:
The organization’s size, type, and industry.
The cadence that the organization releases new features or products.
The organization’s overall operating margin.
Results. To account for these risks, Forrester adjusted this benefit downward by 20%, yielding a three-year, risk-adjusted total PV (discounted at 10%) of $2 million.
| Ref. | Metric | Source | Year 1 | Year 2 | Year 3 | |
|---|---|---|---|---|---|---|
| B1 | Total revenue` | Composite | $5,000,000,000 | $5,000,000,000 | $5,000,000,000 | |
| B2 | Revenue increase due to faster time to market | Interviews | 0.20% | 0.25% | 0.30% | |
| B3 | Operating margin | Composite | 8% | 8% | 8% | |
| Bt | Increased profit due to faster time to market | B1*B2*B3 | $800,000 | $1,000,000 | $1,200,000 | |
| Risk adjustment | ↓20% | |||||
| Btr | Increased profit due to faster time to market (risk-adjusted) | $640,000 | $800,000 | $960,000 | ||
| Three-year total: $2,400,000 | Three-year present value: $1,964,237 | |||||
Evidence and data. Interviewees said Figma’s Dev Mode reduced business risk by eliminating design and implementation inconsistencies, enhancing compliance with brand and accessibility standards, and minimizing the likelihood of costly rework, production errors, or hefty fines due to noncompliance with accessibility standards. For instance, in the United States, organizations with digital experiences that aren’t accessible to individuals with disabilities can face lawsuits under the Americans with Disabilities Act (ADA) or Section 508.7
Interviewees said before adopting Dev Mode, their organizations put themselves at risk when they didn’t adhere to design system standards due to fragmented design systems, inconsistent implementation, or the lack of visibility into how developers translated designs into code. The distinguished technologist in the high-tech industry described developers at their company relying on custom plugins and documentation to interpret designs, which introduced ambiguity and increased the risk of misinterpretation along with the added cost of building and maintaining the plug-ins.
Interviewees said that after implementing Dev Mode, their organizations reduced these risks significantly:
The senior product lead in the entertainment industry said their company eliminated redundant implementations of the same functions and improved consistency across platforms by aligning engineers around a single source of truth: “We’ve got robust policies around accessibility. If we receive feedback that screen readers can’t navigate our app or that something is not accessible to individuals with disabilities or those using assistive technologies, that poses a reputational risk. You can imagine a scenario where if something ships that might restrict an entire segment of users, that’s a pretty big reputational risk.” They also mentioned the risk of shipping a product that is off-brand: “Maintaining brand consistency is crucial. If the colors are mismatched or if the interaction patterns don’t align with the overall design of the app, it often leads to negative feedback. Customers may report these issues as bugs through our customer service channels.”
The systems designer at the fitness company said: “With Dev Mode, developers can be more autonomous and rely on the specifications directly in Figma, which reduces the chances of miscommunication or errors. Previously, there was more back and forth and risk of misinterpreting designs. But now everything is clear up front, helping avoid mistakes and ensuring the final product matches the design vision. … Dev Mode can help mitigate risk because it reflects poorly on us if we release a poor-quality product, and it’s not something we are okay with. We strive for top quality. It’s something [we] are known for. We rely on Figma’s Dev Mode to help us with that goal and that mission.”
The chief design officer at the financial services firm said: “The inclusive design requirements are all built in. These elements have been very, very important. By embedding accessibility into the components of our design system, teams don’t need to reinvent or revalidate these features every time. It ensures compliance and reduces the risk of missing critical requirements, which is essential for a highly regulated industry like financial services.”
The distinguished technologist at the high-tech organization said: “Dev Mode ensures that what you see is what you get. Previously, developers had to interpret designs, which led to mistakes such as misalignments or missing elements. Now they get exact code snippets that match the designer’s intent. This reduces the risk of errors, ensures pixel-perfect quality, and avoids delays caused by rework. Additionally, for accessibility requirements like Section 508 compliance, we’ve configured Dev Mode to flag required properties, such as alt text for images. This helps us ensure compliance with regulations, which is critical in sectors like government.”
Modeling and assumptions. Based on the interviews, Forrester assumes the following about the composite organization:
The total annual revenue for the composite organization is $5 billion.
If the composite is noncompliant with accessibility standards, it receives fines of 0.01% of its revenue (which is a conservative estimate) and loses sales due to brand inconsistency.
The composite attributes a 20% decrease in business risk to Figma’s Dev Mode.
Risks. The decreased business risk may vary based upon:
The type, size, and scope of the organization.
How highly regulated the organization is and the number of fines assessed.
Results. To account for these risks, Forrester adjusted this benefit downward by 20%, yielding a three-year, risk-adjusted total PV (discounted at 10%) of $199,000.
| Ref. | Metric | Source | Year 1 | Year 2 | Year 3 | |
|---|---|---|---|---|---|---|
| C1 | Total revenue | Composite | $5,000,000,000 | $5,000,000,000 | $5,000,000,000 | |
| C2 | Potential fines | Composite | 0.01% | 0.01% | 0.01% | |
| C3 | Percent reduction due to Dev Mode | Interviews | 20% | 20% | 20% | |
| Ct | Decreased business risk | C1*C2*C3 | $100,000 | $100,000 | $100,000 | |
| Risk adjustment | ↓20% | |||||
| Ctr | Decreased business risk (risk-adjusted) | $80,000 | $80,000 | $80,000 | ||
| Three-year total: $240,000 | Three-year present value: $198,948 | |||||
Interviewees mentioned the following additional benefits that their organizations experienced but were not able to quantify:
Improved use of IT resources. The distinguished technologist in the high-tech industry said that prior to using Dev Mode, their firm maintained a dedicated team to build and support internal plug-ins that translated design files into developer-ready code. With Dev Mode’s built-in capabilities, these resources were reallocated to higher-value initiatives (e.g., building new internal tools and features), which improved team output and innovation velocity. They explained: “We had a whole team building plug-ins to do what Dev Mode does now. That team is now working on new features we could output related to our design system.”
Improved developer experience and retention. By eliminating tedious manual tasks like annotating designs or translating specs, Dev Mode significantly improved developer experiences. Interviewees said developers at their organizations describe it as a “non-negotiable” part of their workflow, with the systems designer in the fitness industry stating: “You cannot take this away from me. I can’t work without this.”
The same interviewee said Dev Mode also reduced friction between teams, which contributed to higher satisfaction and improved retention: “Dev Mode allows the builders to focus on building and not on the extra stuff that comes with the job, like the manual annotations. Engineering doesn’t have to be the person to hound the designer, ask them tons of questions, and go back and forth for clarifications. They can do a lot of the things themselves versus having to ask the designer to do a lot of that stuff for them. I would not want to work at a company that still uses [legacy design tools] or still uses [legacy collaboration tools].”
Improved value of the design system. Interviewees said using Dev Mode made their organizations’ design systems more accessible and actionable for developers and explained how this benefits developers. They said it provides a component library and guidance that allows developers to quickly access and use prebuilt UI elements, speeding up the development process. It also ensures consistency across the product by enforcing common visual styles and interaction patterns, which reduces the time developers spend making design decisions and frees them to focus more on the core functionality.
Forrester research emphasizes using design systems to improve consistency and support developer collaboration during implementation — aligning with the idea that well-documented systems promote more maintainable solutions.8
The systems designer at the fitness organization said: “Because of the design system we have integrated into Figma, we can build and ship products a lot faster. But the design system alone can only take us so far. Figma’s Dev Mode allows us to use the design system and shows values and variables, and it’s been a tremendous time save for us and has allowed us to build and ship things very quickly.”
Improved design-engineering culture. Interviewees said Dev Mode shifted the dynamic between design and engineering from a linear handoff model to a collaborative co-creation process. This fostered mutual respect, improved communication, and helped establish more integrated product development cultures. The senior product lead from the entertainment company said: “Now that we’ve built this process in Dev Mode using Figma, engineers have a proper tool in Figma that didn’t exist before. So, now, designers are not throwing their work over the wall to developers. It’s a journey that they have to go through together that makes collaboration so much better. The discussions that engineers and designers have are now much clearer because they can come together and collaborate within Dev Mode, and they can understand your problem problems and solutions together.”
Voice of the Customer
Interviewees said Figma’s Dev Mode increased the value and impact of design systems by seamlessly integrating them into developer workflows while enhancing adoption, accuracy, and scalability and reducing maintenance overhead. The chief design officer in financial services explained that Dev Mode was a key enabler in scaling their firm’s design system by simplifying the discovery and implementation of standardized components:
“Our Dev Mode success story is tightly bound to the success metrics of our design system. The way we’ve been measuring success is in the uptake of the design system itself and what we’re measuring as ‘reuse value.’ Essentially, it’s the cost that it’s taken us to create a chunk of reusable functionality or a reusable component like a button. But it’s those larger chunks that have much more value. Once we’ve created a component and it gets used by a second, a third, a fifth, and a tenth team, that is the value that we’re measuring. So we see Dev Mode as an enabler of that. Designers now have a reuse value measure in their annual goals and objectives. These reuse objectives have now begun to expand to product teams, and they have goals and objectives, as well. That has just catapulted the use of Dev Mode. If a product team starts utilizing it, the developers have inherently come along for the ride. Last year, we began developing and using the design system, and we realized a reuse value of $4 million. This year, we’re on track to surpass $10 million, and we’re being very conservative about it.”
The value of flexibility is unique to each customer. There are multiple scenarios in which a customer might implement Dev Mode and later realize additional uses and business opportunities, including:
Benefits for designers. Interviewees said Figma’s Dev Mode impacts the designer experience by streamlining the design-to-development workflow and fostering closer collaboration with engineers. It reduces the need for manual annotations and handoff meetings by automatically surfacing design specs, variables, and component properties, and by allowing designers to mark files as “ready for dev,” track changes, and ensure that components are used consistently, which can improve quality and reduce rework. These efficiencies allow designers to focus more on creative tasks rather than administrative overhead. The systems designer at the fitness organization said: “Designers are no longer forced to do the boring work of calling out sections or leaving multiple iterations of a screen. All of that extra fluff work doesn’t have to happen anymore on the design side, and they can focus on the actual work because Figma handles that for them, which benefits design.”
Interviewees also explained that Dev Mode helps designers better understand how their work is implemented in code, increasing empathy and accountability. They said this reinforces the use of design system components, which ensures accessibility, brand consistency, and UX standards are maintained. By making the design intent more transparent and more actionable for developers, Dev Mode not only improved product quality, but it also strengthened the relationship between these organizations’ design and engineering teams.
Benefits for product managers. Interviewees also said Figma’s Dev Mode benefits product managers by enhancing collaboration between design and development teams, which streamlines workflows and accelerates product delivery. This efficiency enabled product managers to focus on strategic priorities and oversee more projects within the same timeframes. Additionally, interviewees explained that Dev Mode enforces the adoption of standardized design system components, ensuring consistency in branding, accessibility, and UX across products through the reuse of validated design system components. This can lead to faster time to market and higher-quality products. And product managers also benefit from reduced risk because Dev Mode minimizes errors in implementation — particularly for accessibility compliance (which can have reputational and financial implications). Interviewees said Dev Mode ultimately empowers product managers to drive innovation and deliver customer-centric solutions more effectively.
Flexibility would also be quantified when evaluated as part of a specific project (described in more detail in Total Economic Impact Approach).
| Ref. | Cost | Initial | Year 1 | Year 2 | Year 3 | Total | Present Value |
|---|---|---|---|---|---|---|---|
| Dtr | Fees paid to Figma | $0 | $90,000 | $540,000 | $1,350,000 | $1,980,000 | $1,542,374 |
| Etr | Internal costs | $54,600 | $247,800 | $516,600 | $0 | $819,000 | $706,815 |
| Total costs (risk-adjusted) | $54,600 | $337,800 | $1,056,600 | $1,350,000 | $2,799,000 | $2,249,189 |
Evidence and data. Interviewees said Figma enterprise level licenses are meant for businesses that are designing multiple products or brands; require enterprise level security; and want scalable design systems and simpler admin management. Enterprise-level licenses include:
Unlimited files and projects.
Teamwide design libraries.
Advanced Dev Mode inspection.
Unlimited teams.
Shared libraries and fonts.
Centralized admin tools.
Custom team workspaces.
Design system theming and APIs.
System for Cross-Domain Identity Management (SCIM) seat management.
Full seats include Dev Mode, FigJam, Figma Slides, Figma Draw, and Figma Design. Dev Seats include: Dev Mode, FigJam, and Figma Slides.
Modeling and assumptions. Based on the interviews, Forrester assumes the following about the composite organization:
The composite buys 50 full and developer seats in Year 1, 300 full and developer seats in Year 2, and 750 full and developer seats in Year 3.
Each month, the composite pays $90 per full seat for enterprise-level access.
Each month, the composite pays $35 per developer seat per for enterprise-level access.
Risks. Fees paid to Figma will vary based upon:
The size and scope of the organization.
The number of designers and developers.
Results. To account for these risks, Forrester adjusted this cost upward by 20%, yielding a three-year, risk-adjusted total PV (discounted at 10%) of $1.5 million.
| Ref. | Metric | Source | Initial | Year 1 | Year 2 | Year 3 |
|---|---|---|---|---|---|---|
| D1 | Full seats | Composite | 50 | 300 | 750 | |
| D2 | Developer seats | Composite | 50 | 300 | 750 | |
| D3 | Enterprise-level cost of a full seat per month | Figma | $90 | $90 | $90 | |
| D4 | Enterprise-level cost of a dev seat per month | Figma | $35 | $35 | $35 | |
| D5 | Total cost of full seats | D1*D3*12 months | $54,000 | $324,000 | $810,000 | |
| D6 | Total cost of dev seats | D2*D4*12 months | $21,000 | $126,000 | $315,000 | |
| Dt | Fees paid to Figma | D5+D6 | $75,000 | $450,000 | $1,125,000 | |
| Risk adjustment | ↑20% | |||||
| Dtr | Fees paid to Figma (risk-adjusted) | $0 | $90,000 | $540,000 | $1,350,000 | |
| Three-year total: $1,980,000 | Three-year present value: $1,542,374 | |||||
Evidence and data. The interviewees said their organizations incurred training and enablement costs to support the adoption of Figma’s Dev Mode across design and engineering teams. Training and enablement included formal workshops, internal documentation, and asynchronous learning resources. On average, developers received 6 hours of training, while designers received 1 hour. Interviewees also estimated their organizations had design system teams dedicate 4 hours to create internal enablement materials. These efforts were primarily concentrated during the first year of adoption to ensure consistent usage and alignment across teams.
Internal implementation and rollout required coordination across stakeholders, pilot testing, and change management. Interviewees said that, on average, this required the effort of one full-time equivalent (FTE) for three months, with additional support from the design system team and executive stakeholders. They also described ongoing administrative overhead as minimal but present, with approximately 1 hour per week needed to manage seat requests and quarterly license reconciliations.
Modeling and assumptions. Based on the interviews, Forrester assumes the following about the composite organization:
The composite organization starts training during the initial period.
The composite organization buys 50 full and dev seats in Year 1, 300 in Year 2, and 750 in Year 3.
The composite dedicates 100 hours to planning the implementation and rollout of Dev Mode.
Each developer with a seat receives 6 hours of online or virtual training.
Each designer with a seat receives 1 hour of online or virtual training.
The average hourly rate for each employee trained is $70.
Each year, FTEs spend 2 hours per seat performing administrative functions for Dev Mode.
Risks. Internal costs will vary based upon:
The length of time and number of resource that teams invest to the planning and deployment process.
The team’s familiarity with existing design and development tools, which affects the level of orientation and onboarding.
Results. To account for these risks, Forrester adjusted this cost upward by 20%, yielding a three-year, risk-adjusted total PV (discounted at 10%) of $707,000.
| Ref. | Metric | Source | Initial | Year 1 | Year 2 | Year 3 |
|---|---|---|---|---|---|---|
| E1 | Full seats | D1 | 50 | 300 | 750 | |
| E2 | Developer seats | D2 | 50 | 300 | 750 | |
| E3 | Cost of time spent planning for Dev Mode | Interviews | $7,000 | |||
| E4 | Training time per developer for Dev Mode (hours) | Interviews | 6 | 6 | 6 | |
| E5 | Total developer training time for Dev Mode (hours) | Composite | 350 | 1,750 | 3,150 | |
| E6 | Average hourly rate for a trainee | A13 | $70 | $70 | $70 | |
| E7 | Training costs | E5*E6 | $24,500 | $122,500 | $220,500 | |
| E8 | Ongoing maintenance time (hours) | Interviews | 200 | 1,200 | 3,000 | |
| E9 | Ongoing maintenance costs | E6*E8 | $14,000 | $84,000 | $210,000 | |
| Et | Internal costs | E3+E7+E9 | $45,500 | $206,500 | $430,500 | $0 |
| Risk adjustment | ↑20% | |||||
| Etr | Internal costs (risk-adjusted) | $54,600 | $247,800 | $516,600 | $0 | |
| Three-year total: $819,000 | Three-year present value: $706,815 | |||||
| Initial | Year 1 | Year 2 | Year 3 | Total | Present Value | |
|---|---|---|---|---|---|---|
| Total costs | ($54,600) | ($337,800) | ($1,056,600) | ($1,350,000) | ($2,799,000) | ($2,249,189) |
| Total benefits | $0 | $1,185,920 | $3,675,520 | $8,028,800 | $12,890,240 | $10,147,885 |
| Net benefits | ($54,600) | $848,120 | $2,618,920 | $6,678,800 | $10,091,240 | $7,898,696 |
| ROI | 351% | |||||
| Payback | <6 months |
The financial results calculated in the Benefits and Costs sections can be used to determine the ROI, NPV, and payback period for the composite organization’s investment. Forrester assumes a yearly discount rate of 10% for this analysis.
These risk-adjusted ROI, NPV, and payback period values are determined by applying risk-adjustment factors to the unadjusted results in each Benefit and Cost section.
The initial investment column contains costs incurred at “time 0” or at the beginning of Year 1 that are not discounted. All other cash flows are discounted using the discount rate at the end of the year. PV calculations are calculated for each total cost and benefit estimate. NPV calculations in the summary tables are the sum of the initial investment and the discounted cash flows in each year. Sums and present value calculations of the Total Benefits, Total Costs, and Cash Flow tables may not exactly add up, as some rounding may occur.
From the information provided in the interviews, Forrester constructed a Total Economic Impact™ framework for those organizations considering an investment in Dev Mode.
The objective of the framework is to identify the cost, benefit, flexibility, and risk factors that affect the investment decision. Forrester took a multistep approach to evaluate the impact that Dev Mode can have on an organization.
Interviewed Figma stakeholders and Forrester analysts to gather data relative to Dev Mode.
Interviewed four decision-makers at organizations using Dev Mode to obtain data about costs, benefits, and risks.
Designed a composite organization based on characteristics of the interviewees’ organizations.
Constructed a financial model representative of the interviews using the TEI methodology and risk-adjusted the financial model based on issues and concerns of the interviewees.
Employed four fundamental elements of TEI in modeling the investment impact: benefits, costs, flexibility, and risks. Given the increasing sophistication of ROI analyses related to IT investments, Forrester’s TEI methodology provides a complete picture of the total economic impact of purchase decisions. Please see Appendix A for additional information on the TEI methodology.
Benefits represent the value the solution delivers to the business. The TEI methodology places equal weight on the measure of benefits and costs, allowing for a full examination of the solution’s effect on the entire organization.
Costs comprise all expenses necessary to deliver the proposed value, or benefits, of the solution. The methodology captures implementation and ongoing costs associated with the solution.
Flexibility represents the strategic value that can be obtained for some future additional investment building on top of the initial investment already made. The ability to capture that benefit has a PV that can be estimated.
Risks measure the uncertainty of benefit and cost estimates given: 1) the likelihood that estimates will meet original projections and 2) the likelihood that estimates will be tracked over time. TEI risk factors are based on “triangular distribution.”
The present or current value of (discounted) cost and benefit estimates given at an interest rate (the discount rate). The PV of costs and benefits feed into the total NPV of cash flows.
The present or current value of (discounted) future net cash flows given an interest rate (the discount rate). A positive project NPV normally indicates that the investment should be made unless other projects have higher NPVs.
A project’s expected return in percentage terms. ROI is calculated by dividing net benefits (benefits less costs) by costs.
The interest rate used in cash flow analysis to take into account the time value of money. Organizations typically use discount rates between 8% and 16%.
The breakeven point for an investment. This is the point in time at which net benefits (benefits minus costs) equal initial investment or cost.
Total Economic Impact is a methodology developed by Forrester Research that enhances a company’s technology decision-making processes and assists solution providers in communicating their value proposition to clients. The TEI methodology helps companies demonstrate, justify, and realize the tangible value of business and technology initiatives to both senior management and other key stakeholders.
Online Resources
More information about the Code Connect feature is available at https://www.figma.com/code-connect-docs/.
1 Source: The Design Workflow Tools Landscape, Q1 2025, Forrester Research, Inc., Jan. 28, 2025.
2 Source: Understand Developer Experience To Improve Business Outcomes, Forrester Research, Inc., June 21, 2023.
3 Total Economic Impact is a methodology developed by Forrester Research that enhances a company’s technology decision-making processes and assists solution providers in communicating their value proposition to clients. The TEI methodology helps companies demonstrate, justify, and realize the tangible value of business and technology initiatives to both senior management and other key stakeholders.
4 Source: Forrester’s Q3 2024 Developer Survey
5 Ibid.
6 Ibid.
7 Source: Civil Monetary Penalties Inflation Adjustment Under Title III, ADA.gov; Rehabilitation Act of 1973, U.S. Access Board.
8 Source: The Forrester Design Framework, Forrester Research, Inc., Dec. 20, 2024.
Readers should be aware of the following:
This study is commissioned by Figma and delivered by Forrester Consulting. It is not meant to be used as a competitive analysis.
Forrester makes no assumptions as to the potential ROI that other organizations will receive. Forrester strongly advises that readers use their own estimates within the framework provided in the study to determine the appropriateness of an investment in Dev Mode.
Figma reviewed and provided feedback to Forrester, but Forrester maintains editorial control over the study and its findings and does not accept changes to the study that contradict Forrester’s findings or obscure the meaning of the study.
Figma provided the customer names for the interviews but did not participate in the interviews.
Amy Harrison
August 2024
ABOUT FORRESTER CONSULTING
Forrester provides independent and objective research-based consulting to help leaders deliver key transformation outcomes. Fueled by our customer-obsessed research, Forrester’s seasoned consultants partner with leaders to execute on their priorities using a unique engagement model that tailors to diverse needs and ensures lasting impact. For more information, visit forrester.com/consulting.
© Forrester Research, Inc. All rights reserved. Unauthorized reproduction is strictly prohibited. Information is based on best available resources. Opinions reflect judgment at the time and are subject to change. Forrester®, Technographics®, Forrester Wave, and Total Economic Impact are trademarks of Forrester Research, Inc. All other trademarks are the property of their respective companies.
https://mainstayadvisor.com/go/mainstay/gdpr/policy.html
PDF