figmaAug 6, 2025

Getting into the groove: How music shaped the scatter brushes in Figma Draw | Figma Blog (opens in new tab)

Figma Draw’s 10 new scatter brushes were inspired by music genres, using rhythm, repetition, and texture as guides for visual experimentation. Product designer Rogie King created 99 designs, which the team narrowed down to brushes named Bubblegum, Witch house, Shoegaze, Honky-tonk, Screamo, Drone, Doo-wop, Spoken word, Vaporwave, and Oi!. The project also emphasizes making digital art feel approachable and expressive for users without formal artistic training. ## Music as a Design Framework - Scatter-brush patterns resemble musical beats because their elements repeat along a stroke. - Brush settings such as gap, wiggle, and jitter parallel musical controls like tempo, texture, and volume. - UX writer Molly Rosen Marriner gathered genre ideas from the Every Noise At Once genre map and Figma employees. - Visually suggestive genres—including Electroclash, Drone, and Witch house—helped guide the brush concepts. ## From Genres to Brush Strokes - Rogie began with familiar uses such as stippling and shading, then explored more expressive interpretations. - He listened to representative songs and researched each genre’s visual culture. - The Screamo brush, for example, drew on early-2000s imagery associated with mosh pits, dark clothing, and heavy eyeliner. - He also consulted others, including his son, to better understand genres such as Shoegaze. ## Selecting the Final Collection - Rogie produced 99 scatter-brush designs through an intentionally exploratory process. - The Figma team voted on designs that offered the most flexibility and expressive potential. - Molly later matched the selected brushes to music genres, sometimes inventing or adjusting associations to fit the visuals. - The final set includes 10 brushes designed for stippling, shading, texture, and playful decoration. ## Making Digital Art More Accessible - The brushes expand the emotional and stylistic range available in Figma Draw, from mysterious wisps to repeated smiley-face splatters. - The genre-based names avoid overly technical art-school terminology. - Rogie wanted users to feel free to experiment without needing formal artistic education or experience with physical media. - The collection presents artistic expression as accessible, playful, and open to everyone.

vector-editingfigmagraphic-designfigma-draw+2

figmaJul 2, 2025

How We Shaped the Visual Identity for Config 2025 | Figma Blog (opens in new tab)

Figma’s Brand Studio spent 10 months developing Config 2025’s visual identity for a large, global audience and a wide range of physical and digital formats. The team centered the system on expressive animated glyphs made from basic shapes, creating an identity that could adapt as the event evolved. By combining conceptual flexibility, component-based design, motion, and Figma’s refreshed brand language, they made Config feel tactile, dynamic, and distinctly connected to the spirit of making. ## Building a Flexible Visual Concept - The creative process began with broad exploration rather than fixed moodboards or a narrowly defined style. - The team focused on a concept that could support varied execution: - Social media content - Main-stage screens - Physical installations - Attendee badges and merchandise - Spatial experiences - Creative Director Damien Correll emphasized constraining the concept without constraining execution, allowing the identity to remain adaptable. - Because event plans and requirements change, the visual system needed “wiggle room” and the ability to evolve over time. ## Glyphs as a Language of Making - The visual identity revolved around animated glyphs built from simple shapes, or primitives. - Each glyph combined inner and outer elements that interacted with one another. - Their shifting forms represented: - Dynamism - Change - Adaptability - The unpredictable nature of creative work - Motion allowed a single glyph to trigger ripples and transform an entire composition. - The concept aligned with Config’s product announcements, including Figma Draw and Figma Sites, which focused on helping users express themselves in new ways. ## A Component-Based Toolkit - The team created a glyph library directly in Figma. - Glyphs were built as reusable components, making it easy for partners and vendors to: - Swap variations - Customize compositions - Adapt assets to different surfaces - This approach helped maintain consistency while supporting many applications and production constraints. ## Extending Figma’s Refreshed Brand - Config’s identity built on Figma’s recently updated visual language. - The team adapted the refreshed: - Color palette - Typeface, Figma Sans - Playful primitive-based design approach - This connection allowed Config to feel like an extension of Figma’s broader brand while still having its own expressive event personality. Figma’s approach demonstrates how a strong event identity can combine a clear conceptual foundation with modular, adaptable assets. Designing the system as reusable components—and allowing motion and variation to carry meaning—enabled Config 2025 to remain cohesive across thousands of touchpoints without becoming rigid.

vector-editingfigmatypographymotion-design+3

figmaMay 6, 2025

Config 2025 Launches Deepen Figma's Design Capabilities As Its Platform Expands | Figma Blog (opens in new tab)

Figma’s Config 2025 announcements expand the platform from collaborative design into a broader product-development environment. New tools combine AI, code, visual design, websites, and marketing workflows, enabling teams to move from ideas to production within Figma. The company’s conclusion is that design and AI can help more people contribute throughout the development lifecycle. ## New Products - **Figma Make** turns written prompts or existing designs into working prototypes and applications. - **Figma Sites** lets designers build and publish dynamic websites with customizable interactions, code, and AI. - **Figma Draw** adds advanced vector editing and illustration tools to Figma Design. - **Figma Buzz** helps brand and marketing teams produce visual assets at scale while preserving brand consistency, with integrated AI features. ## Expanded AI Capabilities - New image-generation and image-editing tools support faster visual exploration. - Contextual auto-suggestions provide workflow guidance and help users work more efficiently. - FigJam receives additional AI features for brainstorming and collaboration. - Together with Figma Make, these tools are intended to make ideas easier to visualize and turn into functional outputs. ## Responsive Design and Developer Handoff - **Grid** introduces responsive layouts that adapt across screen sizes. - Grid can generate CSS code in Dev Mode, improving communication between designers and developers. - The feature supports Figma’s broader effort to connect design work more directly with implementation. ## Figma’s Expanding Platform - The new offerings join Figma Design, FigJam, Dev Mode, and Figma Slides. - About two-thirds of monthly active users in Q4 2024 worked outside traditional design roles, including roughly 30% who identified as developers. - The announcements reflect Figma’s shift from a design tool toward an integrated platform for ideation, design, development, publishing, and marketing. ## Global Growth - Figma announced full localization for Brazil, including Portuguese translation, culturally adapted interfaces, and dedicated language support. - Brazilian support joins existing Japanese, Spanish, and Korean localization. - Approximately 85% of Figma’s monthly active users were outside the United States in Q4 2024, while more than half of its 2024 revenue came from non-U.S. markets. - The company now employs more than 1,600 people worldwide. The new products and features will roll out over the following weeks. Overall, Figma is positioning itself as a unified environment where designers, developers, marketers, and other collaborators can take products from early concepts through launch.

vector-editingfigmaprototypinggen-ai+4

figmaMay 6, 2025

Express Yourself with Figma Draw | Figma Blog (opens in new tab)

Figma Draw is a new workspace within Figma Design that combines streamlined vector editing with expressive illustration tools. It aims to help designers move between precise UI work and more creative, tactile design without switching applications or disrupting their workflow. The feature emphasizes faster iteration, improved control, and a workspace tailored to visual expression. ## A Workspace for Visual Expression - Figma Draw reorganizes Figma’s interface around illustration and vector design. - New expressive tools include: - Brushes and pencils - Dynamic strokes - Progressive blur - Texture and noise effects - Text on a path - The redesigned workspace includes: - **Layers panel:** Thumbnail previews for frames, groups, shapes, vectors, and images make assets easier to navigate. - **Toolbars:** Pen, brush, and pencil tools are more prominent, while specialized vector features are easier to access. - **Properties panel:** Larger previews, sliders, expanded stroke controls, and preselected fills, strokes, and effects reduce repetitive adjustments. ## Faster, More Precise Vector Editing - Quality-of-life improvements make it easier to: - Select vertices - Align and distribute objects - Tab between selected geometries - Close open paths - Update vector handles - Upgraded boolean and outline-stroke engines make combining and subtracting shapes more fluid. - Multiple node editing allows users to select and edit several vector nodes simultaneously. - Keyboard shortcuts support faster workflows: - **Enter** edits selected nodes together. - **Shift-click** adds nodes to a selection. - **Command-click** jumps into vector editing on another node. - The shape builder tool helps construct icons and logos from multiple shapes. - Lasso selection makes it easier to select irregular groups of objects or detailed regions of the canvas. ## Tools for Creative Experimentation - Figma Draw expands Figma beyond production-focused vector work into illustration and visual exploration. - Brushes can create more distinctive marks, while texture and noise effects add tactile qualities. - Progressive blur introduces depth and softness to designs. - The goal is to let designers create icons, illustrations, branding assets, social graphics, and other expressive work without relying on external tools or plugins. Figma Draw is positioned as a way to keep both precise and expressive design work inside one canvas. Designers who regularly switch between interface design, illustration, branding, and visual assets may benefit most from its unified workflow and expanded vector controls.

vector-editinggraphic-designfigma-designillustration+2