Figma Goes All In On Developers

Summary

The video discusses Figma's acquisition of Dinoboard, a low-code tool that helps build web apps. Figma likely acquired Dinoboard because it was struggling financially and this helps Figma expand into targeting developers more. Figma wants to become the central hub connecting design, dev tools, and project management. The video explores how Figma is focusing on developer workflows to increase efficiency between design and engineering. It suggests developers impacted by Dinoboard shutting down could look into similar low-code tools like Retool or the open-source Refine.

Takeaways

• 😮 Figma acquired Dinoboard, a low-code IDE focused on building web apps
• 🤑 Dinoboard previously raised $6.6M at likely $30-60M valuation
• 🤔 Acquisition suggests Figma expanding its developer focus
• 📈 Figma likely benefited from its $1B breakup fee from failed Adobe deal
• 💰 Acquisitions often involve stock swap rather than pure cash deals
• 🛠 Figma introduced Dev Mode last year with code generation features
• ⚙️ Figma integrating with developer tools like GitHub and Storybook
• 📈 Teams using Figma boosted dev efficiency 35%
• 💡 Dinoboard users could pivot to Retool or open-source Refine
• 🤔 Figma deepening its platform play for designers and developers

Q & A

What is Figma and who uses it?

Figma is a design and prototyping tool used primarily by designers and product teams to collaborate on digital product designs.

Why is Figma becoming more important for developers?

As Figma is used to design web and app interfaces, developers need to take those designs and turn them into working code. Figma is trying to make this process smoother by building integrations and code export features.

What is DinBoard and why did Figma acquire it?

DinBoard is a low-code platform that aimed to make building web apps easier. Figma likely acquired it to integrate its capabilities into Figma to better serve developers.

How much funding had DinBoard raised?

DinBoard raised $6.6 million in seed funding in June 2022, implying a likely valuation between $30-60 million.

Why did Figma's failed acquisition by Adobe enable the DinBoard deal?

When the Figma-Adobe deal fell through, Figma got a $1 billion breakup fee from Adobe. This gave Figma more cash to pursue acquisitions like DinBoard.

What developer-focused features has Figma already launched?

Figma has launched Dev Mode for generating code snippets from designs, as well as VS Code and other developer tool integrations.

How can the DinBoard shutdown be avoided?

Retool and refine.io are low-code alternatives that can help transition DinBoard users before it shuts down on April 30, 2023.

How can Figma accelerate development efficiency?

By centralizing design, project management, and code tools together into one integrated platform anchored in Figma.

Who is the target audience for the video?

The video seems geared towards developers who are interested in how Figma and design tools integrate with and impact their workflows.

What is the overall perspective on Figma's acquisition of DinBoard?

Quite positive - it's seen as a strategic move by Figma to better serve developers by integrating low-code capabilities that smooth the design to development process.

Outlines

00:00

😊 Figma acquires Dino, a low-code tool aimed at developers

Paragraph 1 discusses Figma's acquisition of Dino, a low-code AI-powered IDE focused on helping developers build web applications quickly. It provides background on Dino, estimating its valuation at $30-60 million in 2022. The paragraph suggests Dino likely struggled to raise more funding and sees the Figma deal as a lifeline.

05:00

😲 Dino shutting down entirely; Figma likely after their expertise

Paragraph 2 notes Dino will fully shut down services by April 2030. It speculates Figma wants Dino's expertise to build similar functionality natively within Figma to better serve developers, an audience they are aggressively pursuing.

10:01

😎 Figma's developer strategy aims to centralize workflow

Paragraph 3 explores Figma's broader developer strategy, including the Dev Mode feature set and various integrations with developer tools. It sees Figma aiming to become the central hub connecting design, dev workflows, project management etc.

Keywords

💡Figma

Figma is a design and prototyping tool used by designers and product teams to create digital product designs. The video discusses how Figma is becoming increasingly important for developers as well, since Figma designs are often the starting point for building the actual product. The video explores how Figma is trying to better integrate with developer workflows.

💡Design to code

The idea of automatically generating code from design mockups and prototypes. The video talks about AI tools that can turn Figma designs into actual working code and applications. Bridging this gap between design and development is still a major challenge.

💡Acquisition

Figma acquired a startup called Dinboard which makes tools for low code application development. The video analyzes why Dinboard may have been struggling and needed to get acquired, based on their funding and valuation history.

💡Integrations

A key part of Figma's developer strategy seems to be integrating with various developer tools and workflows like GitHub, Jira, Storybook etc. This allows Figma to become a central hub connecting design and development.

💡Developer efficiency

One of Figma's stated benefits is improving developer efficiency by up to 35% by better connecting design and engineering. This shows the business impact of making design-to-code easier.

💡Adobe

Figma was supposed to be acquired by Adobe but the deal was blocked for monopoly concerns. This gave Figma a $1 billion breakup fee from Adobe that it can now invest into areas like developer tools.

💡Stock acquisition

The video explains how in startup acquisitions, stock is often swapped instead of cash payments. This ties the rewards for Dinboard founders to Figma's later IPO success.

💡Low code

Tools and platforms that allow building applications with little to no coding, using visual drag-and-drop interfaces. Dinboard and competitors like Retool are focused on the low code space.

💡Data integrations

A key low code benefit is the ability to easily connect to data sources, APIs, services etc. and wire them up through a visual interface instead of heavy coding.

💡Open source

As an alternative to commercial low code tools, the video recommends open source options like Refine. Open source provides more control compared to relying on a startup.

Highlights

Figma acquired Dinoboard, an AI-powered low code IDE, to bridge the gap between design and development

Dinoboard valued itself around $30-60 million in 2022 but was likely struggling to raise more funding

Dinoboard is shutting down and integrating its team and technology into Figma

Figma has $1B from its failed acquisition by Adobe, which it's using to fund acquisitions like Dinoboard

Figma is courting developers with Dev Mode features to translate designs into code

Figma aims to be the connective layer between design, code, project management and more

Teams using Figma increased development efficiency by 35%, showing its value for developers

Adobe struggles with developers, while Figma courts them - an interesting contrast

Options like Retool and Refine provide low-code solutions if you need an alternative to Figma

Refine is an open-source React-based low-code platform that Figma aims to provide

Refine lets you easily combine data sources, APIs, UI libraries into applications

Figma's acquisition of Dinoboard shows its ambition to own the design-to-dev workflow

This could be game-changing if Figma nails developer workflows and integrations

Losing Dinoboard is disappointing, but Figma aims to provide those capabilities natively

It will be interesting to see if Figma can win over developers and collapse the design-code gap

Transcripts

we talk about figma a lot on this

channel which kind of makes no sense

because figma's for designers not

developers and we're a developer channel

that said figma's more and more crucial

to our workflows as developers

especially more web and application

focused devs because figma we the ideas

that our product teams or individuals

have shape with the designers what the

thing should be and then we go and code

it there's been a lot of work to make

things like AI tools that will turn your

figma designs into code that actually

works and runs but the tools that bridge

this Gap and make it easier for

developers to be meaningfully involved

with than using figma itself that Gap

hasn't been bridged sure we can export

svgs and CSS from our figma code but

that's not enough usually we're just

using it for Mock and then recreating

everything in our code bases this might

finally change though because figma's

made a massive acquisition I never would

have expected and this acquisition is

squarely targeting developers like

ourselves here so what the hell's going

on figma bought Dino board if you don't

already know Dino board which is totally

understandable I wasn't super familiar

before it's a low code AI supercharged

IDE but it's actually focused on the IDE

part it wants to be a way to build with

code actual web applications for my

quick read through of all the features

and things that Dino board supports it

seems like a hybrid trying to combine

what you would do with something like

the Wix codu design tools as well as

something like retool and how it gives

you a single surface area to attach

random data sources to third party

providers to off layers to all these

things with a single interface where you

can write code to get these things to

come together and then the design is

something you don't do the design like

how the UI looks how the buttons work

how all those things behave that's

abstracted into the component system

that they've built for you our job when

we use it is to use code to link all

these parts together it's a very

interesting place for figma to dive in

and the more I think about it the more I

realize it kind of makes sense some

quick important context here back in

June of 2022 they raised 6.6 million in

seed funding it's important to know that

that's not the value of the company

that's the money they raised probably

less than 30% of the company likely even

less than that like when I raised we

sold way less than 10% of the company in

our Race So giving up more than 30 would

be absurd if we assume a conservative

20% we do a little bit of math here that

would be 6.6 and this would be over a

value that we don't know compared to 20

over 100 so time 100 / 20 $33 million

valuation in 2022 assuming not great

percentage of the company being sold if

it was 10% instead of 20 you can double

that number which would be totally

realistic so this company by my

estimates valued itself in 2022 between

$30 and $60 million chances are they

were struggling to succeed with that

pitch over time and raising more money

when your valuation is already that high

becomes really difficult they convinced

investors from all of these places

including but not limited to mantis the

chain smokers yes like the band The

Chain Smokers as well as these other

firms as well as individuals from all

these places these people all invested

in a company that they believed was

worth at least $30 million there's no

way over the last 2 years they've become

more valuable than that and if they

spent the money that they raised at the

time they were probably running out of

it and if they were struggling to find

investors that would believe in them

enough to invest against a higher

valuation then they can't raise more

money then they die because $6 million

over two years is not a great burn

overall specifically because this is a

seed round this is pre-series a they

were still early stage in every regard

other than the amount of they had so

here we can see in 2021 2022 there was

just insane amounts of deals of

companies getting money invested in them

these numbers are really hard to

calculate super accurately but you could

see 2021 to 2022 the numbers were really

big and then as 2022 ended 2023 started

things started to get worse so it makes

sense that now if they were raising

during this huge Peak bubble and we're

also offering to compete with retool

which is one of the biggest recent early

stage startups in terms of how fast it

grew they went from Tiny to

multi-billion Dollar company in like 3

years the possibility of grabbing some

of that market was really exciting to

these investors many of which probably

felt like they missed out on the retool

deal and since they feel like they

missed that retool deal they're now

actively looking for potential

competitors to take some of that market

which if you're raising in that market

you can get a good amount of money for a

pretty good deal so with all that in

mind it's hard to know for sure what the

state of the company was but my guess is

they were low on money and didn't have a

great path to make a lot of money long

term but they did have a a good path to

work with a company like figma to help

them achieve their goals so let's talk a

bit about those goals din board aimed to

bridge the gap between idea and

production we believe figma to be the

best place to continue our work

designers and developers globally use

figma to design and build phenomenal

digital products we've long been

inspired by the groundbreaking

multiplayer canvas their commitment to a

high standard of Excellence and their

fun-loving creative Spirit Dino board is

excited to be joining figma to magnify

our impact together as we integrate into

figma we'll be phasing out Dino board

services on April 30th this year we have

paused new registrations and billing our

current customers will be notified via

email with more information and best

steps for transitioning your

applications and tools interesting this

is a full shutdown I would not have

guessed that immediately but makes sense

my guess is they're being brought on to

use some amount of their code but more

of their expertise to build something

similar within figma because figma's

been very clearly trying to Target

Devore I know this because they're

hitting me up all of the time to join

their I think it's like the figma

associates or something I don't remember

what it's called ambassadors they really

want me to be a figma ambassador and I

haven't done it because I don't show

things on my Channel that I don't use

regularly and it's not because figma's

bad it's just not where I spend my time

right now so not surprised that they're

going through all of these angles and

Loops to try and get devs to think about

figma more use it more and eventually

develop their applications using figma

to our dedicated customers collaborators

and Community Your Enthusiasm and

creativity have made this the adventure

of a lifetime We Are Forever grateful

you made a bet on us and shared our

dream of making web applications easier

to build we hope you enjoyed using Dino

board as much as we enjoyed building it

happy hacking Alex overall solid blog

post it's not quite as apologetic to the

users that are getting screwed as I

would have liked I don't know how many

there are and how valuable those users

are I get why they're doing what they're

doing I don't know how many employees

are at this company it seems relatively

small yeah it looks like there are six

Associated members which is not always

the most reliable thing but 2 to 10

employees sounds about right this

acquisition is only possible because of

how much the figma Adobe breakup sucked

you should probably watch my Adobe gives

up on developers video before going too

deep into this one CU I think it's

useful context figma was supposed to be

acquired by Adobe it failed because of

regulations in the EU and concerns about

monopolistic practices we could debate

all day whether or not that was valid

regardless figma got a billion dollar

breakup fee from Adobe that they're now

using to do Acquisitions like this so

this type of purchase might have been in

talks before the Adobe figma stuff even

started much less the breakup happened

but the additional money makes it much

easier for them to do things like this

interesting overall one more useful

detail about these types of Acquisitions

is pretty often when a company like

figma that's not publicly traded is

acquiring company like Dino board

they're not just paying out a flat fee

so if this Dino board acquisition was 10

million theoretically fig was not

handing $10 million to the owners of

Dino board they are allowing them to

trade some percentage of the stock for

equivalent valued again unlisted figma

private Equity so figma's worth $1

billion in Dino boards worth $10 million

they would take some amount of the stock

that exists at figma in this case 1% of

it and they would give that out to the D

board employees or stockholders whoever

as an exchange this also happens when a

company is acquired an example on the

publicly traded side is that when I was

an owner of slack stock and then

Salesforce bought them my stock got

traded into Salesforce stock some amount

of it was paid out cash immediately some

amount of it became stock at Salesforce

that's probably what's happening here so

these employees they don't just take

this money and run they now have to be

part of the figma bet so to speak in

order for their stock to be worth

something in the future they have to

help figma get to the point where it can

IPO at which point the stock they've now

traded has some value this is part of

why these Acquisitions aren't as

immediately lucrative and exciting as

people seem to think because even if

Dino board's Founders get aund million

out of this exchange that's stock on a

vesting schedule that is only worth

something if the company succeeds so

you're actually kind of giving up a

little bit of your control during these

Acquisitions where the founders of D

board now are part of a bigger machine

that they don't have much control of

they might be able to help in certain

ways but the value of their stock is no

longer determined by their efforts it's

determined by the leadership at the

place that they got acquired by so as

exciting and lucrative as these deals

might seem initially it's not always the

case in order to really understand the

impact here we need to see a bit more of

figma's strategy around devs last year

figma announced Dev mode which is a new

space in figma for devs with features

that help you translate designs into

code faster I have a whole video where I

go a bit more in depth on what's

exciting and different about the figma

Devo mode stuff but as you see here it

generates production ready CSS Snippets

primarily for your code Design Systems

they even have the ability to spit out

in this case that is a bunch of Swift UI

code it's cool that it has those options

but again it's just CSS and design stuff

keep work aligned and connected

streamline your workflow and stop

jumping between your design libraries

codebase and project management tools

when you bring everything together in

figma project management tools are they

going after linear as well that'll be

fun oh no they have it right there as a

plugin generally it seems like a lot of

figas Focus here isn't just adding code

to figma it's building an integration

layer between figma and all the other

pieces that developers work with because

developers are kind of where these parts

meet the gap between the design team and

your issue tracker is often the

engineers in the middle so having the

developer tool focus on integrating

GitHub jera storybook linear all those

types of things alongside your designs

in one place kind of makes figma the

home base for how your company

orchestrates development since design is

what what leads the development projects

in a lot of these companies it makes

sense that figma could become the home

for all of that it's also particularly

funny when you realize just how bad

Adobe is at handling developers that

figma is going like opposite way here

very very interesting stuff they even

put out a vs code extension because

again they're not pretending they can

build the solutions to all of these

problems they're focused on integrating

with existing solutions to make a good

experience teams using figma increased

development efficiency by 35% there's

even a report about that cool but

specifically this isn't just like or

efficiency this is development

efficiency up by 35% that's nuts that's

crazy that in the current state devs

using figma are already accelerating

that much more I'm excited to see where

this goes I do want to offer a quick

life raft to any of the people who are

being dropped there's a couple cool

options here obviously retool is the

popular one that everyone knows

beautiful website my CTO used to work at

retool so very very familiar with the

product wow they really W up their

website cool to see there's also an open

source alternative which I highly

recommend because if it's open source

you're much less at risk of this thing

disappearing when it gets acquired you

can host it yourself if you need refine

is dope quick bias check I'm an investor

in refine they were NY combinator and as

soon as I said what they were building I

knew I had to throw money at them

because I'm really hyped about it refine

is a react based open- Source tool for

low code building and attaching all of

these different crazy data sources I

think this picture perfectly summarizes

what is exciting about refine to me

where uh there are a ton of different

places that you might be getting data

from it platforms like Frameworks be it

off providers data providers live

services oh a Integrations like react

table react form access control stuff

and refine is the layer that let you to

combine all those things I'd almost flip

this a little bit where I'd put like

react and next and those things on the

other side and say that refine is the

layer that lets you take all of these

things and then render them in the ways

you want to really really powerful stuff

and if you're looking for a way to do

this that's open source and headless and

pretty easy to adopt so what do you

think are you a Dev that uses figma or

are you a figma user that hates devs

really curious what your thoughts are

let me know in the comments and in the

future we can talk more about figma

thank you guys as always and until next

time peace nerds