Trigger GitHub Actions build from a Figma plugin

Time to place the final cherry on the top. Cue up "I've got the power"!

Time to place the final cherry on the top. Cue up "I've got the power"!

Continuously throughout the course, we've weaved the roles of technical lead or architect—in regards to tooling, processes, and ways of working—with the more production-oriented roles of the designer and the developer. In each and every lesson of this course, we've used numerous tools and techniques to shorten the time between idea and feature rollout. Not to mention, we set all of this up in ways that empower each role in relevant ways.

For this last lesson, I want to show you a little something that can further decrease the dependency on people and specialist roles.

What is cooler than code generation?#

It would probably be very easy to find a boatload of low-resolution memes about devs and designers doing handoffs or working together, generally. The innermost truth of this admittedly mostly "for the lulz" attitude is that a designer and developer typically do not share the same set of concerns, nor do they share the same set of tools. At this point in the course, I hope you have seen that a modern palette of tools and a moderate degree of automation could do wonders to solve some of those problems.

So, if I'd rhetorically ask, "what is the biggest thing you could do to ease the transition from a design being done to it being rolled out," what would you answer?

If you'd say "code generation," I'd be happy. And by now, you know Figmagic does some of that. Cool. So, some of that is solved.

If you'd then instead say, "but, what about actually building code straight from Figma and entirely sidestepping the developer?" I'd be even happier because that's what we'll do right now.

Building code from Figma sounds dangerous (?)#

This, for some, will sound ridiculous, reckless, and dumb. And it sure can be. But if we go with the line we've set in this course, where we—instead of relying on heavy-handed processes—enforce a more modern DevOps-inspired approach that combines automation with a degree of competent, manual verification steps, it's all actually safe. And that's an important thing because if someone—say your manager—gets cold feet here, then it's all pretty much dead in the water anyway.

Meet the Continuous Design plugin for Figma#

Okay, before we continue, what I am going to show you is actually not a great revelation by itself. We will use a Figma plugin written by myself. The plugin is fittingly called Continuous Design, and you will install it into Figma. The plugin allows you to authenticate to GitHub and then start a named workflow there. That's it, but given that this is something previously only done by developers, I'd argue that it's a powerful new capability we are giving designers.

Start a new discussion. All notification go to the author.