Figma

736 posts

www.figma.com/blog/engineering

Filter by tag

Figma528 Design Systems246 User Experience140 Prototyping135 AI110 Figjam98 Product Design76 User Interface63 Generative AI47 Collaborative Design47 Accessibility41 React39+1265

figmaOct 5, 20252 min readCurated summary

Turn Your ChatGPT Brainstorms Into FigJam Diagrams | Figma Blog

Figma’s new ChatGPT app turns brainstorms, sketches, uploaded files, and technical documents into editable FigJam diagrams. It supports flowcharts, sequence and state diagrams, and Gantt charts, helping users move quickly from exploration to collaborative artifacts. The feature is powered by Figma’s remote MCP server and is available to logged-in ChatGPT users outside the EU. ## Turning Conversations into Diagrams - Users can mention Figma in a prompt, such as “Figma, make a diagram from this sketch.” - ChatGPT can recommend the Figma app when diagramming is relevant. - Photos, drawings, PDFs, and other files can provide context. - Generated diagrams can be revised, expanded, or represented in alternative formats. - Figma plans to add more diagram types over time. ## Accelerating Design Iteration - Hand-drawn sketches can become shareable FigJam files. - Designers can ask ChatGPT to update diagrams or explore different visualizations. - Dense documents can be uploaded so ChatGPT can produce an initial draft. - This helps teams move ideas from informal notes or whiteboards into a collaborative workspace. ## Clarifying Technical Systems - Developers can use uploaded documentation and screenshots to create or update software architecture diagrams. - ChatGPT can research technical approaches using blogs and case studies, then visualize them. - Screenshots, such as a pricing page, can be used to map likely React component structures. - The resulting diagrams support system design discussions, technical communication, and interview preparation. ## Planning Products and User Experiences - Product managers can visualize tradeoffs, such as simplicity versus power in a permissions flow. - PRDs can be converted into user journey or process flowcharts. - Product, engineering, and design requirements can be combined into Gantt charts for launch planning. - ChatGPT supports individual exploration, while FigJam enables teams to review and iterate together. The feature is currently live for logged-in ChatGPT users outside the EU. It offers a practical workflow for using ChatGPT to generate a first visual draft and FigJam to refine, discuss, and collaborate on it.

Figma Figjam React Chatgpt+4

figmaSep 24, 20252 min readCurated summary

Bringing Figma Make to the Canvas | Figma Blog

Figma is bringing its AI-generated Figma Make previews directly into the Figma Design canvas through a new “Copy design” feature. Users can copy previews as editable, structured layers rather than static screenshots, making it easier to refine ideas collaboratively and move from prompt to prototype to production. Figma views this as the first step toward making Make outputs fully native and integrated with Design. ## Copying Make previews as editable layers - “Copy design” lets users bring any design from a Figma Make preview into Figma Design. - Imported previews become editable layers that can be: - Edited and remixed - Refined by teams - Used as building blocks for further design work - The feature removes the need for extra exporting, naming, or switching between separate workflows. - A product manager, for example, can generate and refine a mockup in Make, then place it into the Design canvas for the team to develop further. ## From screenshots to collaborative building blocks - Figma emphasizes that Make outputs should be more than finished-looking images. - Structured layers preserve context and enable direct iteration on the canvas. - This creates a more flexible path from: - Natural-language prompt - Prototype - Collaborative design - Production-ready work - The canvas becomes a shared space where anyone can contribute to and evolve AI-generated ideas. ## Learning from html.to.design - Figma acquired the technology behind <div>RIOTS’ `html.to.design` plugin. - The plugin converts live prototypes and HTML into editable Figma frames. - Figma Make users had already adopted the plugin to reconnect generated prototypes with the Design canvas. - The technology was demonstrated at Config 2025 and has been developed over three years, reaching nearly two million users. - <div>RIOTS will continue independently building and maintaining `html.to.design` and its other tools. - The partnership is intended to accelerate future development and new plugin features. ## Figma’s broader vision for Make - Figma wants AI to accelerate existing creative workflows rather than create isolated outputs. - The company sees the canvas as a place where ideas from any source can be imported, explored, and transformed collaboratively. - Copy design is presented as an early step toward deeper integration between Figma Make and Figma Design. Figma’s recommendation is implicit: use Make for rapid idea generation, then bring those ideas into Design as editable layers for collaborative refinement and production work.

AI Prototyping Figma Make CSS+3

figmaSep 23, 20252 min readCurated summary

Why You Should Care About Design Context | Figma Blog

Design files are becoming an important input for agentic coding tools, so their organization and clarity directly affect the quality of generated code. Figma argues that designers should treat handoff as carefully as the design itself, providing developers and AI agents with explicit links between visual decisions and implementation details. The central recommendation is to build strong design-system foundations and structure files so they are easy for both humans and tools to interpret. ## Design systems as implementation foundations - Components and shared variables for color, spacing, sizing, and typography promote consistency and reuse. - These foundations become more valuable when connected directly to the codebase: - **Code Connect** links Figma components to their coded equivalents and displays accurate snippets in Dev Mode. - **Variable code syntax** defines how design variables should be represented across web and native platforms. - With the Dev Mode MCP server, AI agents can retrieve this design-system context directly instead of searching through an entire codebase. - A component such as a card can therefore be generated with the correct variants, properties, spacing, colors, typography, and states. - Embedding this information in shared Figma libraries allows the benefits to scale across teams and projects. ## Structuring files for developer consumption - Clear page hierarchies, frame names, layer names, and layouts make files easier to work with during design and easier for developers and MCP-powered tools to understand. - Create frames for important responsive breakpoints and major visual changes, such as a navigation bar becoming a menu icon. - Use auto layout to express how designs should respond to viewport widths, breakpoints, and changing text. - Intentional structure turns a design file into useful implementation context rather than merely a visual reference. Designers can improve development speed and AI-generated code by treating Figma files as structured technical documentation. Establish reusable, code-connected foundations first, then organize layouts and responsive states explicitly so developers and coding agents can reliably translate designs into production.

Figma Design Systems AI Agents Model Context Protocol+3

figmaSep 22, 20253 min readCurated summary

Design Context, Everywhere You Build | Figma Blog

Figma’s latest MCP server and Code Connect updates aim to make design-system and codebase context available wherever teams build. Remote MCP access connects Figma to IDEs, AI agents, and browser-based tools, while Figma Make integration exposes underlying prototype code. New in-app component mapping further links designs to production components, helping AI generate more consistent, production-aware code. ## Remote Access to the Figma MCP Server - The MCP server previously ran locally through Figma Dev Mode; it now supports remote access. - Developers can connect Figma to IDEs, AI coding agents, and browser-based models without installing the Figma desktop app. - Figma context can include responsive layouts, interaction details, design-system rules, and visual-program structure—not just static images. - Integrations are available through Figma’s partner catalog, with support involving tools such as Android Studio, Replit, and Warp. - Figma plans to expand the server’s functionality and partner ecosystem during and after its beta. - Companies including Affirm and Coinbase report significantly faster development, with Affirm rebuilding major product flows in under two days. ## Connecting Figma Make to Codebases - The MCP server can now expose the underlying code in Figma Make files rather than only rendered prototypes. - It indexes Make-file code so developers and AI agents can request specific files, reuse code, or reference its logic and design patterns. - The feature is available through partners including Anthropic, Cursor, Windsurf, and VS Code. - Figma is also working toward allowing partner MCP servers to connect into Figma Make. ## Improved Component Mapping with Code Connect - Code Connect links Figma components to their corresponding production components and usage guidelines. - A new in-app mapping workflow lets users browse Figma components, select the correct code and file, and identify mapped or missing relationships. - This complements the Code Connect CLI, which provides production-ready snippets and prop or variant mappings across frameworks. - When combined with MCP, Code Connect gives AI agents both design context and production awareness, including component locations and usage rules. - Figma’s internal evaluations and early customer testing showed more consistent code, faster file navigation, and better token efficiency. ## Integration Reliability - Figma is also introducing integration reviews and rate limits as it expands connections with external tools. - These measures are intended to make the growing extensibility ecosystem more reliable. Figma’s overall direction is to make design context portable and actionable across the development workflow. Teams can get the most value by combining remote MCP access for broad design understanding with Code Connect for accurate, production-ready component usage.

Design Systems AI Agents Model Context Protocol Code Generation+3

figmaSep 18, 20253 min readCurated summary

The Branding for Intercom’s AI Summit Looks Like an Alien Superbloom | Figma Blog

Intercom’s 2025 Pioneer AI summit branding uses an “alien superbloom” concept to express how rapidly AI is evolving. Its Creative Studio built a flexible system of surreal flowers, pollen-like particles, motion, and dot-matrix imagery that could work across digital campaigns, the website, event spaces, and merchandise. Figma served as the central workspace for exploration, collaboration, prototyping, feedback, and refinement. ## Building a Broad Creative Direction - Intercom Creative Studio began with expansive mood boards in Figma Design. - Teams combined motion clips, still images, vectors, logos, collages, and written concepts to explore multiple creative territories. - Motion designers, brand designers, and copywriters could experiment together in the same files. - Embedded video helped the team test logo treatments and messaging against motion references early in the process. - The selected direction evolved from the previous year’s “planted seeds” concept into an AI superbloom. ## Developing the Superbloom Visual Language - The central motif became surreal, alien-looking flowers blooming at unusual scales and speeds. - Pollen particles inspired a stippled aesthetic used in the logo, speaker portraits, and static imagery. - The visual system was designed to feel dynamic in motion while remaining restrained enough for print. - Intercom collaborated with Colors and the Kids to explore flower forms, animation styles, pollen density, and movement. - Figma Draw allowed designers to annotate video frames and specify changes to motion and flower shapes without switching applications. ## Presenting and Refining the Brand - Instead of conventional slide decks, the team presented concepts on long, scrollable Figma artboards. - Stakeholders could review work and leave comments directly on each board. - Separate pages organized successive feedback rounds, allowing explorations to develop into polished case studies. - Figma functioned both as a presentation tool and as an organizational system for the distributed 30-person creative team. ## Prototyping the Website - The Pioneer website was designed, prototyped, and quality-assured in Figma. - Designers and developers could review changes in one environment rather than moving between multiple platforms. - Live comments enabled immediate conversations during iteration, replacing slower back-and-forth through tools such as Slack. - The same brand principles could be tested across the web experience alongside event and campaign materials. The project demonstrates how a unified design workspace can help a distributed creative team move from broad visual exploration to a cohesive, motion-ready identity. For complex event branding, combining shared mood boards, in-context feedback, motion prototyping, and website testing can make the process faster and more connected.

Figma AI Design Systems Prototyping+3

figmaSep 17, 20253 min readCurated summary

Figma Rendering: Powered by WebGPU | Figma Blog

Figma replaced its WebGL-based renderer with a WebGPU backend to unlock GPU compute, clearer resource management, and better error handling. The migration required more than swapping APIs: Figma redesigned its graphics interface, supported both WebGL and WebGPU, and built tooling to translate existing shaders. The project also improved the existing WebGL renderer by making rendering inputs explicit and reducing opportunities for state-related bugs. ## Why Figma Moved Beyond WebGL - Figma originally chose WebGL to deliver a smooth, browser-based infinite canvas when most design tools were native applications. - WebGPU, supported by Chromium since 2023, enables: - Compute shaders that move parallelizable work from the CPU to the GPU. - Less reliance on WebGL’s bug-prone global state. - More capable and understandable error handling. - The transition had to preserve WebGL compatibility and avoid performance regressions or disruptions during rollout. ## Making Draw Calls Explicit - The previous interface mirrored WebGL’s global-state model: - Buffers, textures, materials, and framebuffers were bound separately. - Resources remained bound after a draw call. - Developers could accidentally reuse stale state. - Figma redesigned `draw()` so that required resources are passed directly as arguments. - The WebGL implementation lazily updates bindings only when necessary, preserving efficiency while making dependencies explicit. - This redesign fixed several WebGL bugs before WebGPU support was introduced. ## Supporting GLSL and WGSL Shaders - WebGL uses GLSL, while WebGPU uses WGSL. - Maintaining separate GLSL and WGSL versions of every shader would have created excessive duplication and maintenance work. - Figma built a custom shader processor that: - Parses existing WebGL 1–compatible GLSL. - Translates it into a newer GLSL structure. - Uses the open-source `naga` tool to convert it to WGSL. - Generates both GLSL and WGSL outputs. - Extracts shader metadata such as input types and data layouts. - Supports file includes for shader reuse and modularity. - This allowed engineers to continue writing and maintaining one primary shader source while supporting both rendering backends. ## Adapting Uniform Data - Uniforms provide shader inputs such as colors and transformations. - WebGL allows uniforms to be updated individually through calls such as `uniform1f` and `uniformMatrix3fv`. - Figma’s original graphics interface followed this model with methods such as `setUniform1f`. - WebGPU requires uniforms to be grouped into uniform buffers and uploaded together. - Consequently, simply switching APIs could have reduced performance; Figma needed to redesign uniform handling carefully rather than directly reproducing WebGL behavior. ## Practical Outcome Figma’s WebGPU migration was an architectural modernization as much as a graphics API upgrade. The recommended approach is to introduce an explicit, backend-independent rendering interface, automate shader translation, and optimize data layouts carefully so WebGPU’s capabilities improve performance without sacrificing compatibility.

Webgl Shaders Webgpu Gpu Rendering+3

figmaSep 14, 20253 min readCurated summary

Free Association: Production Designer Jeremy Hindle on Building Severance | Figma Blog

Jeremy Hindle’s production design for *Severance* began with a minimal script description—“four desks, large room”—and developed into Lumon Industries’ eerie, emotionally charged world. Drawing on modernist architecture, industrial design, cinema, and television, Hindle prioritized how spaces feel over what they communicate intellectually. His conclusion is that the show’s unsettling power comes from the tension between sterile order, vast scale, and profound loneliness. ## Designing Emotion - Hindle describes his goal as creating an atmosphere that is “stunning and lonely.” - His experience designing hundreds of commercial offices informed Lumon’s corporate environments. - Rather than focusing only on narrative information, he designs for viewers’ “kinetic” responses—the physical and emotional sensations produced by a space. - The sparse script gave him room to build a complete visual language around emptiness, repetition, and institutional control. ## *Playtime* and Architectural Absurdity - Jacques Tati’s *Playtime* was a central reference for *Severance*. - Tati’s film satirizes modern corporate architecture through vast, impersonal spaces and carefully choreographed movement. - Its mixture of comedy, alienation, and architectural scale helped shape Lumon’s uncanny office environment. ## John Deere Headquarters and Lumon’s Monumental Scale - Kevin Roche and Eero Saarinen’s 1964 John Deere headquarters provided a blueprint for Lumon’s institutional architecture. - Its monumental structure influenced the show’s sense of corporate permanence and authority. - The building also inspired the iconic desks used by the Macrodata Refinement team. - Hindle translated large-scale architectural references into environments that feel both imposing and strangely empty. ## Dieter Rams and Controlled Modernism - Lumon’s largely fabricated sets include selected real design classics, including Dieter Rams’s Braun TS 45 and TG 60 wall console. - Rams’s restrained, functional aesthetic reinforces the company’s carefully controlled visual identity. - The inclusion of recognizable industrial design creates a believable mid-century modern world while making Lumon’s environment feel more curated and artificial. ## Lessons from Film Production - Hindle’s work on *Zero Dark Thirty*, his first feature film, strengthened his commitment to constructing large-scale physical worlds. - He used full-scale models to help the entire crew understand how environments would function and remain visually readable. - This experience supported the detailed spatial planning required for *Severance*’s complex office interiors. ## Negative Space and the Scale of *Fargo* - A single still from the Coen brothers’ *Fargo* influenced Hindle’s vision for the scale of *Severance*. - The image demonstrated how negative space can make characters appear isolated and vulnerable. - Hindle showed the reference to director Ben Stiller, using it to communicate the show’s desired balance of composition, distance, and loneliness. ## The Emotional World of *Her* - Spike Jonze’s *Her*, with production design by K.K. Barrett and costumes by Casey Storm, served as another important reference. - Hindle admired the film’s ability to create a complete emotional world through design. - Its coordinated use of architecture, interiors, color, and clothing helped inform *Severance*’s approach to character and atmosphere. ## *Twin Peaks* and Television with Staying Power - David Lynch’s *Twin Peaks* represented the kind of distinctive, enduring television Hindle hoped *Severance* could become. - Although he had not previously been strongly interested in television, the project offered an opportunity to build a world with lasting cultural and visual identity. - Like *Twin Peaks*, *Severance* combines recognizable everyday settings with surrealism, mystery, and an unsettling sense of place. Hindle’s work shows how production design can make an abstract corporate dystopia physically memorable. By combining modernist architecture, precise industrial objects, cinematic negative space, and emotionally charged emptiness, *Severance* turns Lumon into one of the story’s most powerful characters.

Figma Visual Design Industrial Design Architecture+3

figmaSep 11, 20253 min readCurated summary

Is the App Layer Where AI Proves Its Value? | Figma Blog

AI’s next breakthrough may come less from larger models than from the application layer that makes them useful and accessible. Like graphical interfaces made personal computers mainstream, well-designed AI products can translate complex capabilities into intuitive, context-specific experiences. The products that succeed will combine reliable infrastructure with thoughtful interaction design and emotional resonance. ## From MS-DOS to the App Layer - Today’s prompt-driven AI resembles the MS-DOS era: powerful, but requiring users to know how to issue precise commands. - Existing models have a “capabilities overhang,” meaning much of their potential remains difficult to access. - Personal computers became mainstream through graphical user interfaces, not MS-DOS itself. - Similarly, browsers, search engines, smartphone apps, and services such as Uber and Instagram transformed underlying technology into everyday tools. ## Design Makes Technology Adoptable - Building an app layer is not enough; adoption depends on the quality of the interactions surrounding the technology. - Successful products combine functionality with intuitive design: - Pinch-to-zoom and inertial scrolling on smartphones - Live maps in Uber - Simple navigation in browsers and search engines - AI products will need new interaction patterns that make model capabilities feel natural rather than like conversations with a raw chatbot. ## AI Products Must Be Context-Specific - Most people will use AI through specialized products rather than directly interacting with language models. - Effective AI applications will adapt their content, tone, interface, and responses to particular audiences and situations. - The Good Inside parenting app illustrates this approach: - It uses a chatbot trained on Dr. Becky’s parenting guidance. - Vague prompts receive empathetic, actionable advice. - Simple cards, a calm color palette, readable typography, and subtle animations create a reassuring experience. - The same principle applies to products for lawyers, doctors, designers, artists, and other professional or consumer groups. ## The Interface Can Matter More Than the Model - User reactions to GPT-5’s simplified model picker showed that interface changes can provoke stronger responses than improvements to model capability. - This does not make the underlying models unimportant, but users primarily experience AI through how its capabilities are packaged and presented. - Atlassian’s acquisition of The Browser Company suggests that even browsers may evolve into active AI interfaces that help applications work together, rather than merely displaying tabs. ## Design as a Competitive Advantage - AI products will compete on the feelings and confidence they create: - Support for parents - Inspiration for artists - Confidence for lawyers - Product teams must choose interactions that present AI outputs seamlessly while maintaining reliable, scalable systems. - Many new AI applications will emerge, but the strongest may distinguish themselves through design and become as transformative as graphical user interfaces were for computing. The practical opportunity for AI builders is to focus not only on model performance, but on designing specialized, emotionally resonant products that turn raw capability into useful everyday experiences.

Large Language Models Generative AI Product Design Interaction Design+3

figmaSep 9, 20252 min readCurated summary

Issue No.12: New Roles, New Rules | Figma Blog

Figma’s “New roles, new rules” highlights how AI and faster iteration are blurring traditional boundaries between product roles. Product managers, designers, and developers are increasingly working across disciplines, using prototypes and shared principles to collaborate directly. The issue argues that effective teams are replacing rigid handoffs with experimentation, co-creation, and better systems for guiding AI. ## Shifting Roles - Research found that: - 64% of product builders identify with two or more roles. - 56% of non-designers perform design-related work. - Faster development cycles and AI tools are enabling people to contribute further outside their formal specialties. - As responsibilities expand, teams are also reconsidering how they manage time, ownership, and collaboration. ## Prototyping to Create Shared Understanding - Figma product designer Natasha Tenggoro struggled to explain how video playback should work in Figma Buzz. - Instead of relying on verbal descriptions, she used Figma Make to build prototypes herself. - The prototypes helped the team reach three “aha” moments and provided a clearer basis for discussion. - The example demonstrates how building interactive artifacts can replace lengthy explanations and accelerate alignment. ## Music-Inspired Design in Figma Draw - Figma Draw’s new scatter brushes were shaped by musical concepts such as tempo, texture, and volume. - Designers translated the character of genres including Honky-tonk, Screamo, Doo-wop, and Vaporwave into brush behavior. - The release adds 10 scatter brushes, giving designers more control over attributes such as gap, wiggle, and jitter. ## Duolingo’s Collaborative Method - Duolingo’s Math team is changing the traditional design-to-engineering handoff for its math games. - Designers and engineers work through co-creation, scrappy prototypes, and continuous experimentation. - Shared principles—including “show, don’t tell” and distinguishing between a v1 and an MVP—help the team move quickly while refining ideas. - Collaboration is treated as an ongoing product practice rather than a stage that ends when design is handed off. ## Broader Changes in Creative Work - Agencies and freelancers are also abandoning rigid client boundaries and involving clients throughout the creative process. - Design systems can improve AI-generated code by giving agents structured, relevant, and brand-consistent input. - MCP servers are presented as an important connection between design systems and AI-powered workflows, helping agents produce more useful output. Overall, the issue recommends embracing broader roles and replacing formal handoffs with shared prototypes, collaborative iteration, and well-structured design systems—especially as AI becomes more involved in product development.

Figma AI Design Systems Product Design+2

figmaSep 9, 20253 min readCurated summary

Are Roles and Responsibilities a Thing of the Past? | Figma Blog

Product teams are moving away from rigid job boundaries toward more fluid, overlapping responsibilities. Figma’s research, based on 51 interviews and a survey of 1,199 product professionals, found that 64% of respondents identify with at least two roles, while more than a third span three or more. This shift can improve collaboration and speed, but it also creates friction through tool overload and requires teams to coordinate more deliberately. ## Roles Are Becoming More Fluid - Product development responsibilities increasingly overlap across design, product management, engineering, research, data, and marketing. - 56% of non-designers say they participate heavily in at least one design-related task. - PMs are prototyping ideas, engineers are contributing to early design decisions, and marketers and content specialists are commenting directly in design files. - Figma conducted the research with Factworks and Fusion Hill through 51 qualitative interviews and a survey of 1,199 participants. ## Design Isn’t Just for Designers - Non-designer participation in design tasks such as mockups and brand exploration rose by 10% in the past year. - 70% of product managers create low-fidelity mockups or wireframes, and 59% create interactive prototypes. - One in four product builders has recently adopted a new design tool; 42% of those who have not yet adopted one plan to do so within a year. - Cross-functional design work can: - Help teams align on ideas earlier. - Expose technical feasibility problems before implementation. - Reduce back-and-forth and save time. - Designers can use the time saved for research, strategy, design-system maintenance, and craft. - The goal is not to eliminate design expertise, but to encourage shared visual communication and earlier collaboration. - Teams can support this transition by building stronger relationships, establishing a shared vision early, and welcoming contributions from colleagues who are still learning design tools. ## Tool Overload Is Causing Friction - 72% of respondents identify AI tools as the main force changing their roles. - Tools such as Figma Make, Claude Code, and GitHub Copilot make prototyping and code generation more accessible. - Notion, Figma Buzz, and Airtable similarly support rapid marketing production and project management. - Role expansion has led 71% of respondents to use more tools and software. - Participants use tools across an average of 7.6 out of 16 categories, including spreadsheets, project management, graphic design, and coding assistants. - Although new tools enable more people to contribute, the growing number of platforms can make workflows harder to manage and reduce the effectiveness of individual tools. Teams should treat overlapping roles as an opportunity for earlier alignment and broader participation, while actively simplifying their tool ecosystems. Clear collaboration practices—not rigid ownership boundaries—will be essential as product work continues to evolve.

Figma AI Design Systems Prototyping+3

figmaSep 8, 20252 min readCurated summary

How to Harness Skills That AI Can’t Automate | Figma Blog

Great products require more than AI-generated functionality; they depend on human craft, including curiosity, intuition, taste, and intention. AI accelerates prototyping and iteration, but people must decide what questions to ask, when to expand the scope, and whether an experience truly resonates. The article argues that these uniquely human skills are essential for steering AI toward thoughtful, high-quality outcomes. ## Curiosity: Starting from First Principles - Curiosity means asking “why” and “what if,” exploring multiple directions, and validating ideas through iteration. - Tools such as Figma Make, Claude, and ChatGPT make it faster to generate prototypes, campaign concepts, and alternative approaches. - AI can expand possibilities within a prompt, but it cannot independently challenge the original scope, follow an unexpected hunch, or recognize that a tangent deserves deeper investigation. - Early exploration improves confidence and reduces rework: - Figma designer Natasha Tenggoro used Figma Make to test video-playback concepts for Figma Buzz. - Prototyping exposed edge cases, clarified feasibility, and helped engineers understand the feature before implementation. - Curiosity can also lead to valuable scope expansion: - While designing icons for four new Figma products, Tim Van Damme realized the existing icon family needed a broader redesign. - He explored hundreds of variations and redesigned the suite for greater consistency, distinctiveness, scalability, and a unified Figma identity. ## Intuition: Following a Feeling - AI can help bring products to market quickly, but it cannot determine what will emotionally or practically resonate with customers. - Human designers can recognize when an interaction feels confusing even if it technically works. - Intuition may also identify qualitative improvements—such as adding white space to a crowded layout—that are difficult to express as strict requirements. - Eliel Johnson of CVS Health describes design as an active practice centered on asking whether an experience “feels good,” not merely whether it satisfies functional constraints. The practical lesson is to use AI for speed and breadth while reserving human judgment for direction, exploration, emotional resonance, and quality. Human craft is what turns technically workable output into a product people genuinely value.

Figma User Experience Prototyping Generative AI+2

figmaSep 8, 20253 min readCurated summary

The Anatomy of a Summer Campaign: How Instacart Staged a Sick ’90s Throwback | Figma Blog

Instacart’s “Summer Like It’s 1999” campaign used nostalgia to recreate the carefree feeling of a late-’90s summer. The campaign combined discounted retro snacks, a cohesive visual identity, immersive advertising, and a free Third Eye Blind concert. Its success depended on close collaboration across creative, marketing, CPG partners, and external agencies, with Figma serving as the shared source of truth. ## Recreating ’90s Nostalgia - Instacart reduced prices on nostalgic products such as Bagel Bites, Capri-Sun, and Otter Pops to their approximate 1999 prices. - The campaign culminated in a free Third Eye Blind concert in New York City. - Its visual language drew on: - Chunky typography - Bright, vivid colors - Fish-eye photography - Oversize clothing and other recognizable ’90s references - The team aimed to evoke nostalgia while keeping the work distinctly recognizable as Instacart. ## Building an All-in-One Creative Toolkit - Instacart’s in-house creative studio held daily meetings to align on: - Typography - Color palettes - Illustration - Photography - Logo and lockup treatments - Designers explored a wide range of ’90s references before reducing them to the essential elements that fit the brand. - The resulting toolkit documented the campaign’s colors, illustrations, typography, and other visual rules. - It became a living Figma file that internal teams, marketers, and external partners could use to create new assets. - The toolkit supported later campaign extensions, including a Venmo partnership and an advertisement inspired by the ’90s movie theater experience. ## Cross-Functional Collaboration - Creative, marketing, and CPG co-marketing teams worked together from the beginning rather than relying on formal handoffs. - Marketers had direct access to Figma, enabling frequent reviews, rapid changes, and visibility into work in progress. - The shared workspace helped maintain consistency across many campaign touchpoints, including: - The app icon - Splash pages - Television commercials - Billboards - Partner executions - The toolkit provided a flexible “north star” while allowing teams to remain expressive and adapt the campaign as new needs emerged. ## Developing a Detailed Photography Brief - The photography brief specified not only the products and scenes to capture, but also the precise visual treatment. - The team planned: - Low camera angles - Fish-eye effects - Idyllic outdoor locations - ’90s-inspired styling - Product placement required careful planning because the brief passed through multiple stakeholders. - Illustrations, typography, and textures were designed to layer over the photography, adding complexity and reinforcing a unified campaign style. Instacart’s campaign demonstrates how a strong, flexible design system can turn a broad creative idea into a coordinated, multi-channel experience. Establishing shared guidelines early—and keeping them accessible throughout production—helped the company move quickly without losing brand consistency.

Figma Design Systems Typography Photography+3

figmaSep 4, 20252 min readCurated summary

How To Build A Resilient Design Team | Figma Blog

Design teams must build resilience by creating psychological safety, encouraging experimentation, and preserving high standards of craft. The article argues that leaders should prepare teams to adapt to changing technologies, roles, and constraints rather than rely on a fixed playbook. Resilience comes from trust, flexibility, thoughtful capacity planning, and a willingness to question established assumptions. ## Start with Team Health - Stress, burnout, overwork, and fear prevent people from doing their best creative work. - Leaders should build trust and a shared mission while encouraging candid, non-personal critique. - Provide both synchronous and asynchronous ways for people to contribute so the loudest voices do not dominate. - Make it safe to share work at every stage, from rough sketches to polished designs. - Use regular 1:1s, career conversations, and feedback surveys to identify problems early. - Plan realistically around team bandwidth instead of overcommitting. - Model vulnerability by openly acknowledging uncertainty and personal challenges. ## Encourage Experimentation and Shifting Roles - Designers have different strengths, so teams should combine complementary skills and create opportunities for mutual learning. - Boundaries between design, research, product, and engineering are becoming more fluid. - Encourage designers to work closer to production through AI prototyping and code experimentation. - Sharing unfinished work and lessons learned—such as through Figma’s `#design-wip` channel—helps normalize experimentation. - Invite cross-functional partners into design critiques to bring broader perspectives into the process. - Balance shipping current work with inventing and testing new approaches as technology changes. ## Treat Craft as a Differentiator - High-quality, carefully executed products can distinguish a company in crowded markets, strengthen user loyalty, and drive growth. - Craft is especially valuable in enterprise software, where design quality is often neglected. - Strong execution requires attention to detail and may involve trade-offs, such as refining the user experience instead of adding more features. - Fast-moving teams must deliberately protect time for visual consistency, clarity, and overall product quality. ## Practical Recommendation Build resilience as an ongoing operating practice: protect team health, make experimentation routine, support fluid collaboration across roles, and treat quality as a strategic advantage rather than an optional extra.

Figma Design Systems User Experience Product Design+2

figmaSep 3, 20253 min readCurated summary

Why Is Corpcore Suddenly Such a Thing? | Figma Blog

Software merchandise has shifted from ordinary corporate swag to desirable streetwear, a trend the article calls “corpcore.” Vintage Apple and Microsoft shirts now command high resale prices, while new collections from companies like Figma attract crowds comparable to major fashion drops. The appeal combines nostalgia, brand loyalty, irony, and a renewed interest in technology’s cultural influence. ## The Rise of Tech Merchandise - Vintage Apple T-shirts, many with simple designs commemorating teams or projects, can sell for hundreds of dollars on Depop and Grailed. - Even the 1997 book *Apple T-Shirts: A Yearbook of History at Apple Computer* can cost up to $850. - Contemporary company merchandise is also attracting serious demand: - Figma’s 2025 Config conference featured a pop-up store with long lines. - The collection included apparel and Otto plush toys. - Its development involved eight months of work between Figma’s Brand Studio and Garrett Elizabeth Office. - Designer Jeff Staple compared Figma’s release to a Supreme drop, highlighting how tech merchandise now operates within streetwear culture. ## Nostalgia for Early Technology - Vintage corpcore appeals to people who remember the early web and their first encounters with companies such as Apple and Microsoft. - The merchandise evokes a period when technology seemed rebellious and disruptive—young programmers challenging established corporate power. - Wearing an old company shirt signals affiliation with a successful or influential group, much like a bumper sticker or sports jersey. - Vintage tech apparel also allows people to celebrate that history from a deliberately ironic distance. ## A Post-Ironic Corporate Style - Modern corpcore blends sincere brand enthusiasm with absurdity and irony. - Examples include: - Cash App’s 2023 club-kid fashion line designed by Marshall Columbia and modeled by Julia Fox. - Overtime’s limited-edition Dunkin’ Donuts streetwear. - Fashion items featuring Lockheed Martin branding, including polo shirts and tactical tracksuits. - Designers must balance making merchandise feel genuinely desirable without losing the humor or self-awareness associated with corporate branding. ## From Company Swag to Cultural Identity - People increasingly wear app and software logos on shirts, hats, totes, and water bottles as they would wear band merchandise or sports jerseys. - The trend reflects both affection for technology brands and the growing influence of software companies on everyday culture. - “Corpcore” succeeds because it turns corporate identity into a form of personal expression rather than merely advertising an employer. The broader lesson is that thoughtful, culturally aware merchandise can transform a company logo into a fashion symbol. Brands that understand nostalgia, scarcity, design quality, and the tension between sincerity and irony can make corporate swag feel genuinely collectible.

Figma Github Microsoft Apple+3

figmaSep 2, 20252 min readCurated summary

IDC Study Says the Global Workforce Engaged in Software Design Is Expanding | Figma Blog

IDC forecasts that the global workforce involved in software design and development will grow by more than 30%, reaching 144 million people by 2029. This expansion reflects the growing role of design as a competitive differentiator and the increasing demand for design talent. Generative AI is expected to accelerate product development while raising expectations for usability and visual quality. ## Workforce Growth in Software Design - The population of knowledge workers and developers designing digital products and interfaces is projected to grow from **107 million in 2025 to 144 million in 2029**. - The research covers multiple industries, company sizes, and roles involved in software design and product development. - IDC based its model on quantitative research involving more than 1,000 IT and business leaders. ## UX Design Leads Growth - UX professionals are expected to grow at a **7.6% compound annual growth rate** between 2025 and 2029. - This growth is expected to outpace other knowledge-worker categories. - IDC links the trend to rising demand for design-intensive digital products and solutions. ## Generative AI Raises the Bar - Generative AI will increase the speed and volume of software development. - Faster development may give users more product choices and enable better-designed digital experiences. - Designers and developers will face greater pressure to make AI-powered features highly usable, appealing, and intuitive. Overall, the study suggests that companies should treat design as a strategic capability and invest in UX talent as software development becomes faster and more AI-driven.

Figma User Experience Generative AI User Interface+3