One of the biggest challenges organizations face is syncing up design work happening in Figma with what ultimately gets built in code – what the end user experiences.
While it’s tempting to lean on automated tools to try and generate the coded output from the design environment, the unfortunate reality is that these tools don’t yet support the quality of implementation needed for mission critical platforms and experiences. That’s why, at Knapsack, our focus is on making cross-functional human workflows sustainable and scalable with modern tooling.
Bringing design closer to user experiences
In order to bring user reality (code) closer to design intent (Figma), Knapsack treats design assets much like code assets, syncing with design tools to provide cross-functional teams a single place to view and interact with all the ways their system elements exist across teams and tools.
Now we’re taking our integration with Figma to the next level to unlock a host of new platform capabilities (and superpowers for our users).
Beginning in January, Knapsack will leverage Figma’s powerful REST API to pull data from design files and assets in Figma directly into Knapsack workspaces, where it can be used to improve hand-off, documentation, quality assurance, and more.
Some of the first features you can expect from this enhanced Figma API integration include easily associating Figma components like Buttons or Headers with their coded counterparts. Within Knapsack, you’ll be able to see all the variants like size or color options for each component from Figma. All variants and instances of the Figma component will automatically be shown, documented, and kept up to date.
Automated documentation for component properties, styles, and variations in Figma
Coming soon after, Knapsack will automatically generate documentation that compares component properties, styles, and variations between Figma and code. This helps surface any disconnects earlier to save headaches down the road, and provides an easy way to align expectations set in design tools with the implementation performed by engineers.
This powerful integration with Figma will enhance a critical part of Knapsack’s unified design system platform, and provide a foundation for how teams manage their design systems moving forward - with greater clarity and fewer communication breakdowns.
The first release of Knapsack’s advanced Figma integration will launch early January 2024. Be sure to check in then to see how we’re tackling the critical challenge of design-code alignment.
