Logo

Workflow lab: From design system to campaign in Figma Weave

Autor

Aldrin

Fecha de publicación

Welcome to Workflow Lab, where we present a sample workflow

A design system is typically built with product designers in mind, giving them guidance on everything from button states to layouts for different screen sizes. But brand designers use many of the same building blocks, including type, color, and layout, which they leverage for marketing assets like billboards or social media posts. Figma Weave


gives brand designers a way to draw on a product’s design system as they explore ideas for campaign work.


In this example workflow, a product designer at the Museum of Speculative Futures (MOSF), a fictional museum exploring how culture imagines what comes next, uses Weave to bring elements from the museum’s design system into a campaign promoting the exhibition. Follow along as they transform type, color, and layouts from their product designs into expressive collateral and create a repeatable workflow the team can reuse.

The problem

A few weeks before a new exhibition launch, Tomorrow Rehearsed, MOSF’s brand designer is out on unexpected leave. Instead of hiring an agency or a temporary backfill, one of the product designers with a deep appreciation for brand design offers to take over the project to keep the ball rolling. They know MOSF’s design system inside and out, but they’ve never used that system to create assets for a promotional campaign.

The Tomorrow Rehearsed exhibition imagines a future where nature can thrive undisturbed. One installation displays grass growing on the steps at a train station concourse. Another features a bench that has become a planter and a drinking fountain furred with moss. The designer needs to capture that mood across all the exhibition collateral without giving too much of the exhibition away.

Rather than start from scratch, the designer brings familiar references—including the design system—from Figma Design into Figma Weave: existing text layouts, the museum’s color palette, and typography. They use those references to explore how MOSF’s existing visual language can express the exhibition’s mood, then carry that direction across three assets at different scales: a poster, billboard, and social media posts.