Bringing Dev Mode to Figma (Interview)

The Changelog: Software Development, Open Source

This week on we’re joined by Emil Sjölander from Figma — talking about bringing Dev Mode to Figma. Dev Mode is their new workspace in Figma that’s designed to bring developers and design to the same tool.

The question they’re trying to answer is “How do you create a home for developers in a design tool?” We go way back to Emil’s startup that was acquired by Figma called Visly, how we iterated to here from 20 years ago (think PSD > HTML days), what they did to build Dev Mode, what they’re doing around codegen, the popularity of design systems, and what it takes to go from zero to Dev Mode.

Leave us a comment

Changelog++ members get a bonus 5 minutes at the end of this episode and zero ads. Join today!

Sponsors:

• Neon – The fully managed serverless Postgres with a generous free tier. We separate storage and compute to offer autoscaling, branching, and bottomless storage.
• Socket – Secure your supply chain and ship with confidence. Install the GitHub app, book a demo or learn more
• Traceroute – Listen and follow Season 3 of Traceroute starting November 2 on Apple, Spotify, or wherever you get your podcasts!
• Fly.io – The home of Changelog.com — Deploy your apps and databases close to your users. In minutes you can run your Ruby, Go, Node, Deno, Python, or Elixir app (and databases!) all over the world. No ops required. Learn more at fly.io/changelog and check out the speedrun in their docs.

Featuring:

• Emil Sjölander – Twitter, GitHub
• Adam Stacoviak – Mastodon, Twitter, GitHub, LinkedIn, Website
• Jerod Santo – Mastodon, Twitter, GitHub, LinkedIn

Show Notes:

• Dev Mode: Building a design tool that works harder for developers

Something missing or broken? PRs welcome!

Capitole

1. This week on The Changelog (00:00:00)

2. Sponsor: Neon (00:01:14)

https://neon.tech

3. Start the show! (00:05:53)

4. Visly > Figma (00:06:37)

5. Iterating to here (00:10:13)

6. Remember PSD to HTML? (00:13:30)

7. Throwback to Grooveshark (00:15:09)

8. Getting to Dev Mode (00:19:46)

9. Sponsor: Socket (00:25:31)

https://socket.dev/?utm_source=changelog&utm_medium=podcast&utm_campaign=changelog-interviews

10. Building Dev Mode (00:28:55)

11. Is codegen the end game? (00:43:40)

12. Is codegen production code? (00:47:59)

13. Sponsor: Traceroute (00:49:17)

https://deploy.equinix.com/traceroute/

14. How popular are design systems? (00:50:52)

15. Design systems not required (00:53:29)

16. From zero to Dev Mode (00:54:42)

17. Using Dev Mode to build Dev Mode? (00:57:59)

18. Is Visly at all present in this? (01:00:52)

19. PSD > PTSD > OMG! (01:02:21)

20. Figma as a developer platform (01:05:28)

21. We can't talk about AI (01:14:07)

22. Poll + next week! (01:14:55)