advertisement
advertisement

As Design And Engineering Blur, Figma Wants To Be Their Platform

This design tool is built for the web, which gives it the potential to simplify the messy process of melding concepts and code.

As Design And Engineering Blur, Figma Wants To Be Their Platform
[Photo: courtesy Figma]

When Figma debuted in 2015, a Fast Company story described it as a Google Docs for designers—which was as good a way as any to describe the basic concept. A tool for creating user-interface designs, it competes with Photoshop, Sketch, and InVision, all of which have their loyalists. However, instead of making you download and install desktop software, Figma runs in a web browser and stores designs in the cloud. That streamlines adoption, encourages collaboration, and—perhaps most important—ensures that everybody is always working with the latest version of a file.

advertisement

But Figma’s internet-native DNA opens up other opportunities beyond those that are immediate and obvious. Today, the company is unleashing one of them by turning itself into a platform.

Figma cofounders Evan Wallace and Dylan Field. [Photo: courtesy Figma]

At launch, that means that Figma has created an API which makes it relatively simple for a developer to reach into a Figma repository and specify a design (or lots of designs) to use in a third-party app or service. As in the past, there’s still one true version of a design: It stays in Figma, and the current iteration is always available through the API.

By giving coders direct access to its files, Figma is reflecting the collaborative vision it had all along as well as acknowledging design’s ever-increasing strategic value to companies of all sorts. “The context that we started Figma in is that design is more important than ever before, and everyone wants to participate in the design process,” says Dylan Field, the company’s cofounder and CEO. No aspect of that collaboration is more crucial than the intersection between design and engineering, which has become less of a Checkpoint Charlie-like demarcation than a blur.

As Figma VP of engineering Kris Rasmussen explains it, designs “have to encode not only how something looks but also how it reacts and behaves and responds to different devices, form factors, resolutions. And as a result, the entire process is a lot more iterative. It’s not like it starts at design and ends at engineering. It goes from design to engineering and back and forth many times through the evolution of a product.”

Other design tools understand that dynamic as well, and are working to build functionality to smooth it out. But among currently available options, “Figma’s the first one made out of web stuff,” says John Lilly, who invested in the company as a partner at venture-capital firm Greylock and is a member of its board. “That’s going to open up a million possibilities for us going forward, and nobody else can do that.” Figma may not be as feature-rich as some of the category’s longer-established players, but it also doesn’t have a desktop-based legacy to leave behind.

[Image: courtesy Figma]

Platform Potential

As Figma has been constructing its platform, the company’s engineers have whipped up a number of proof-of-concept demos to show off its capabilities. In one, interface designs stored in Figma get automatically rendered on screens in photographs—like one of a woman gazing at a smartphone—so that they appear in context. “There are entire companies built around this idea of, how do you preview your designs in these real photos?” says Rasmussen. But a single developer put together Figma’s take on the concept in a day.

advertisement

Another one of Figma’s test applications takes Figma designs and turns them into working code using React, a widely used library of JavaScript snippets. That opens up the ability to do things incorporating an on-screen clock which tells the actual time. “There’s other services that do this, for instance with Sketch files, but the cool thing about this is that you only need a URL,” says Figma engineer Karl Jiang, who built this functionality over his holiday break at the end of last year. “You plop it in and the code does the rest. And you’re confident that whatever you’re pulling from the website is up to date.”

In recent weeks, several Figma customers have also been throwing their own challenges at the platform. GitHub for example has been experimenting with using the API to help distribute its Octicons, an open-source set of symbols—such as arrows, thumbs-up and thumbs-down indicators, and a trashcan—which third parties can use in their own software. As the Octicon set evolves and expands, handling the whole process via Figma would simplify a process which GitHub currently accomplishes by shuffling icons created in Sketch around from machine to machine. “Being able to more closely connect the developer and design workflow is really desirable,” says manager of design systems Diana Mounter. “This opens up those possibilities.”

Uber, another early adopter of the platform, plans to pluck designs out of Figma and display them on TVs in offices in four cities, giving everybody a can’t-miss-it preview of works in progress. The company is also working on a Figma-powered portfolio website for its designers, akin to Behance or Dribbble. And Airbnb is using the API to help automatically check designs for consistency and alert their creators to issues such as if they veer from approved typefaces and color schemes.

Figma in use at Uber. [Photo: courtesy Uber]

More To Come

For all the things the first incarnation of the Figma platform is capable of, it’s just a start. For one thing, it offers just read-only access to design files. That means that third-party developers can pull designs out of the repository but can’t make changes and then write them back in for use within Figma.

“A lot of our customers that we’re talking to about this API are like, ‘Oh my gosh, I made this amazing thing, and how amazing would it be if you had a write API?'” says Field. Adding that functionality is next on Figma’s to-do list. After that will come technology which will let third-party developers create functionality which lives inside the Figma experience itself—an addition with plenty of potential, but also more pitfalls than the API approach Figma is starting out with. (Figma rivals such as Sketch already support such extensions, which have a nasty habit of breaking when the software they sit atop gets updated.)

For now, according to Field, the write-only API satisfies many of the requests of Figma customers who have been itching to make the service even more integral to their design workflows. And as with any platform, what matters most will be what people other than its creators make of it. “It’s been pretty exciting to see how many use cases people have outside of Figma,” he says. “Every time we see someone build on this, I’m like, “Holy shit, I never thought of that before.'”

About the author

Harry McCracken is the technology editor for Fast Company, based in San Francisco. In past lives, he was editor at large for Time magazine, founder and editor of Technologizer, and editor of PC World.

More