techlist.io
KREN

Figma

736 posts

www.figma.com/blog/engineering

Filter by tag

Figma528Design Systems246User Experience140Prototyping135AI110Figjam98Product Design76User Interface63Generative AI47Collaborative Design47Accessibility41React39+1265
figma3 min readCurated summary

Six Memos for the Future of Digital Creation | Figma Blog

The article presents six Figma “memos” about the future of digital creation in 2025. Drawing on the tradition of influential workplace memos, it argues that documenting observations, strong opinions, and emerging opportunities can stimulate dialogue and change. The themes range from creative coding and broader definitions of design to emotional differentiation, handmade websites, and generalist careers. ## The Memo as a Tool for Shaping the Future - Figma frames the memo as a concise way to communicate ideas, critique strategy, and encourage organizational change. - The article references influential examples, including Bill Gates’s advocacy for graphical interfaces and Stewart Butterfield’s “We don’t sell saddles here” memo for Slack. - Memos can be strategic, metaphorical, playful, or reflective documents that preserve how thinking develops over time. - Figma’s six contributors use the format to examine trends across design, development, product, writing, analysis, and community work. ## Developers Should Embrace Creative Coding Again - Modern browsers now support capabilities that often exceed those available in conventional design tools. - Developers are encouraged to move beyond templates and standardized production workflows. - The memo calls for renewed experimentation with the web as a creative medium. - Creative coding is presented as a way to explore the browser’s full expressive and interactive potential. ## Expanding the Definition of Design - The second memo argues for a broader understanding of what design encompasses. - Its inclusion reflects the article’s wider focus on how digital creation crosses traditional professional boundaries. ## When to Leave the Product Roadmap - The third memo examines when teams should move beyond planned roadmap work. - It suggests that product development may require responding to unexpected opportunities rather than following predetermined priorities exclusively. ## Emotion as a Competitive Advantage - The fourth memo identifies emotion as an emerging source of competitive differentiation. - As digital products become increasingly similar in function, how they make people feel may matter more to their success. ## Making Space for a Handmade Web - The fifth memo advocates preserving room for distinctive, human-made experiences on the web. - It contrasts this idea with increasingly standardized, templated, and automated digital production. ## The Rise of the Generalist - The final memo focuses on the growing importance of people who work across disciplines. - Its inclusion reinforces the article’s view that future digital creation will depend on collaboration between design, development, product, writing, and other fields. The article’s practical recommendation is implicit: observe emerging patterns, write down strong ideas, and share them. Memos can turn informal workplace thoughts into conversations that influence products, teams, and the broader direction of digital creation.

Read original(opens in new tab)
Product DesignWeb DevelopmentDesign ToolsCreative Coding+2
figma3 min readCurated summary

Making Space for a Handmade Web | Figma Blog

The web’s early personal, expressive character has been diminished by commercialization, platform standardization, and pressure to optimize for broad audiences. Chia Amisola argues that a “handmade web” still exists in pockets such as Neocities and internet-art communities, and that anyone can support it by making a website without forcing it to serve a conventional purpose. Websites can instead be temporary, obscure, playful, poetic, or collectively imagined spaces. ## From Personal Webpages to Standardized Platforms - In the 1990s, services such as GeoCities gave people small parcels of digital space to build personal webpages. - GeoCities hosted as many as 38 million pages, organized into themed “neighborhoods” and shaped by amateur creativity. - Although the web now contains more sites than ever, efficiency, commercialization, and social media have reduced its visual and expressive variety. - Many people retreat into the internet’s “dark forest,” limiting public self-expression because of judgment, surveillance, or pressure to conform. ## The Handmade Web Still Exists - Neocities continues GeoCities’ legacy by offering free hosting and has grown to nearly one million sites. - Organizations including Rhizome, the Center for Net Art, and the School for Poetic Computation support internet art through exhibitions and workshops. - Decentralized-web initiatives supported by groups such as the Internet Archive promote an internet shaped and owned by its users rather than concentrated platforms. ## Websites as Living, Personal Spaces - Making a website is presented as the most direct way to participate in the handmade web. - A website does not need to be a resume, portfolio, blog, homepage, or comprehensive representation of its creator. - It can be treated as a changing environment that grows over time, rather than a fixed destination. - Personal sites can be short-lived or maintained for decades, focused on one subject or combining many interests, and addressed to a broad community or a single person. ## Websites with Time Limits - Websites can deliberately operate only at particular times or for limited durations. - B&H’s website reflects the closing schedule of its physical stores during religious observances. - “Cloudwatching” and “Stargazing” are accessible only during the day and night, respectively. - Temporary projects such as Internet Stoop and Reddit’s The Button demonstrate how expiration and scarcity can create meaningful online experiences. - Digital spaces are inherently impermanent because domains expire and sites require ongoing maintenance. ## Websites That Resist Discovery - A site can be rewarding precisely because it is difficult to find. - Cassie McQuater’s *Black Room* uses an intentionally illegible URL, while *Default Filename TV* collects videos that retain their original camera-generated filenames. - Obscurity offers an alternative to search-engine optimization, algorithmic distribution, and polished branding. - These sites encourage “surfing” through links and rewarding accidental discovery. ## Websites Without Clear Ownership - Websites can outlive or separate themselves from their original creators, much like abandonware. - Anonymous or ownerless sites can function as fictional tools, alternate realities, or spaces where visitors construct their own meanings. - JODI’s long-running site presents a maze of ASCII landscapes, while the collectively authored SCP Foundation uses a fictional wiki to build a shared mythology. The practical recommendation is simple: make a website without requiring it to be useful, polished, permanent, or widely understood. Its value may lie in being personal, strange, temporary, and shaped by the people who encounter it.

Read original(opens in new tab)
HTMLWeb DesignDigital ArtHandmade Web+2
figma2 min readCurated summary

It’s Time We Expand Our Definition of Design | Figma Blog

Figma argues that design should no longer be viewed as the exclusive domain of professional designers. Marketers, developers, product managers, and other collaborators already make visual and communication decisions every day, but often lack the confidence or tools to do so effectively. Expanding access, simplifying workflows, and changing organizational mindsets can help more people participate meaningfully in design. ## Design Tools as Spaces of Belonging - Figma files can feel intimidating to non-designers, much like entering an unfamiliar gallery or professional critique. - Simply inviting someone into a design tool does not guarantee that they will feel comfortable contributing. - Tools can help create belonging by making collaboration more approachable and welcoming. ## Everyday Work Is Design - The author describes repeatedly creating thumbnails, event invitations, and other assets in marketing, product, and sales roles to avoid design bottlenecks. - These activities involve visual communication, creativity, and decisions about how audiences understand and engage with information. - Products such as FigJam, Dev Mode, and Figma Slides are already helping marketers, developers, and other partners work more confidently. - The larger shift requires organizations and individuals to recognize that design participation is not limited by job title. ## Making Design More Inclusive - Teams can support “everyday designers” through: - Templates that provide a reliable starting point. - Simpler, more accessible tools. - Features for staying on brand and finding approved assets. - Assistance with copy exploration and approval workflows. - Organizations should also educate, validate, and celebrate colleagues who want to improve their design skills. - As work becomes faster and more collaborative, these forms of support become increasingly important. Figma’s broader recommendation is to treat design as a shared organizational practice. By giving non-designers better guidance, accessible tools, and permission to contribute, teams can produce stronger work while helping more people feel that they belong in the design process.

Read original(opens in new tab)
FigmaDesign SystemsFigjamCollaborative Design+2
figma2 min readCurated summary

The Best Advice to Bring to Work in 2025 | Figma Blog

The article gathers practical workplace advice from leaders at Ableton, Snapchat, Coda, and other companies. Their principles emphasize finding inspiration beyond familiar sources, automating low-value work, shortening users’ path to meaningful results, designing meetings around clear purposes, and maintaining momentum through difficult work. Together, they argue that effective work depends less on rigid formulas than on experience-based judgment. ## Look Beyond Design for Inspiration - Pablo Sánchez of Ableton recommends drawing ideas from emotions, memories, science, nature, and other fields—not just existing design conventions. - Designing for yourself first can produce work with genuine personal energy that resonates with users. - Ableton’s Note app borrowed from Brutalist architecture rather than traditional music software, creating a stripped-down experience focused on immediacy. ## Automate Work That Gets in the Way - Product managers should focus primarily on understanding customers, delivering value, and enabling sound decisions—not perfecting internal artifacts. - When documentation, reviews, or OKRs consume as much time as product development, teams should delegate or automate them. - Peter Yang uses AI to synthesize brainstorms, summarize customer feedback, and improve product requirement documents. ## Accelerate Users’ Time to “Magic” - Products should help new users reach their first meaningful “aha moment” quickly instead of overwhelming them with tutorials. - The goal is to move people from following instructions to confidently creating and sharing something of their own. - Snapchat’s Lens Studio team mapped the user journey and reduced the path from download to first submitted project from 19 steps to four milestones. ## Cultivate Different Types of Meetings - Coda’s Shishir Mehrotra distinguishes three meeting categories: - **Cadence meetings:** Regular staff meetings, standups, and syncs that track progress against goals. - **Catalyst meetings:** Decision-making forums, product reviews, and design critiques that resolve questions and drive change. - **Context meetings:** All-hands meetings, off-sites, and orientations that share information, establish context, and build connections. - Teams need a healthy balance, since too many catalyst meetings can cause burnout. ## Keep Moving Through Difficult Work - Dan Mall compares difficult progress to the tedious parts of training that are usually omitted from an exciting montage. - His advice is to build momentum to counteract the discouragement and monotony that can accompany worthwhile goals. The broader recommendation is to focus attention on meaningful outcomes: use unconventional sources of inspiration, remove unnecessary effort, guide users quickly toward value, give meetings a clear purpose, and keep building momentum when progress feels slow.

Read original(opens in new tab)
FigmaAIDesign SystemsUser Experience+3
figma2 min readCurated summary

27 FigJam Activities to Spark Creativity in the Classroom | Figma Blog

FigJam’s collaborative canvas can make classroom participation more inclusive, creative, and engaging across subjects. The post presents 27 adaptable activities that use sticky notes, drawings, widgets, and shared templates to support community-building, discussion, problem-solving, creative breaks, and assessment. Its central conclusion is that familiar teaching activities become more interactive when students can contribute visually and collaboratively. ## Building Classroom Community - Icebreakers help students share interests, personalities, hobbies, dreams, and favorite subjects. - “Let me introduce myself” activities use sticky notes, stickers, and sketches. - Scavenger hunts prompt students to find classmates with shared experiences or interests. - A virtual “shoe rack” lets students express their individuality creatively. - FigJam tools such as drawing, voice recordings, and photobooths give students multiple ways to participate and connect. ## Making Language and History Come Alive - Shared canvases turn reading and historical analysis into group activities rather than isolated assignments. - Students can visualize character relationships, track plot developments, and discuss themes together. - Templates such as book chats support collaborative literary discussion. - History activities can encourage students to debate perspectives and investigate events collectively. ## Visualizing STEM Concepts - FigJam activities help students represent abstract scientific, mathematical, and technical ideas visually. - Collaborative diagrams, notes, and sketches can support group problem-solving. - The flexible canvas allows teachers to adapt activities for different subjects and grade levels. ## Taking Creative Brain Breaks - Short, playful FigJam exercises can reenergize students between lessons. - Drawing, visual prompts, and collaborative challenges provide a creative change of pace. - These breaks maintain engagement while still encouraging communication and imagination. ## Checking Understanding Together - Teachers can use shared templates to see how students are processing a lesson. - Students can contribute answers, questions, reflections, and visual explanations in one collaborative space. - Group responses make misconceptions easier to identify and create opportunities for peer discussion. Overall, the post recommends using FigJam as a flexible classroom workspace rather than limiting it to presentations. Its free education access and adaptable templates make it suitable for teachers who want more inclusive, participatory learning activities.

Read original(opens in new tab)
FigmaFigjamVisual CollaborationEducational Technology+1
figma2 min readCurated summary

Updates to our pricing, seats, and billing experience | Figma Blog

Figma announced changes to pricing, seat types, and billing workflows taking effect March 11, 2025. The company is raising prices for Figma Design, consolidating seat management, and giving administrators advance approval over paid seat upgrades. The changes are intended to improve billing visibility while allowing users temporary access during approval. ## New Pricing and Seat Structure - Figma Design prices will increase, with changes applying to Full seats. - Existing plans will transition to four seat types: - Full - Dev - Collab - View - Paid seats will include access to FigJam and Figma Slides. - The free Starter plan will remain available. ## Admin Approval for Seat Upgrades - Previously, users could trigger seat upgrades and admins reviewed them afterward. - Under the new model, paid seat upgrades will require admin approval by default. - Admins will manage one seat per user rather than separate seats for each product. - Users can temporarily access the requested seat for up to three days while approval is pending. - During this period, they can create files and edit files where collaborators have granted edit access. - Approved seats will appear on the next invoice, prorated from the approval date through the end of the subscription period. ## Migration and Timing - Existing plans will migrate to the new seat structure and approval workflows beginning March 11, 2025. - Full-seat price increases and updated proration rules will apply at the first renewal on or after that date. - Figma says existing customers will receive additional details by email. ## Connected Projects for Freelancers and Agencies - The billing changes prepare the way for Connected Projects, planned for later in 2025. - Freelancers and agencies will be able to collaborate with clients using their existing seats. - This is intended to eliminate the need to purchase licenses across multiple plans for client collaboration. Organizations should review their seat assignments and establish an approval process before the March 2025 migration.

Read original(opens in new tab)
FigmaFigjamAuto LayoutFigma Slides+3
figma2 min readCurated summary

The Long and Short of It: Issue no.8 | Figma Blog

Figma’s Issue No. 8 reflects on how its community shaped the company’s 2024 releases and culture. The year included 180 product updates, a major Config conference, expanded tools for developers and product teams, and a refreshed brand identity. The central message is that Figma builds products through continuous dialogue with the people who use them. ## A Year Shaped by the Community - Figma published 180 new releases in 2024. - More than 10,000 people attended Config. - Over 220 Friends of Figma groups operated worldwide. - The company emphasizes that users do more than receive new features: they influence how those features evolve in practice. ## Expanding Figma’s Products - Figma refined its UI3 interface to give users more control. - AI tools were reworked with a more deliberate approach. - Dev Mode was enhanced to improve connections between design and code. - Figma Slides was launched to support presentations and give design work a broader stage. - The company highlights that the design process continues after launch, when users apply new tools to real workflows. ## Config and the Future of Product Building - Config 2024 was Figma’s largest conference yet, held in San Francisco with more than 10,000 attendees. - Figma points readers toward talks and advice from Config speakers. - Featured guidance focuses on creating memorable presentations and sessions that genuinely inspire audiences. - Early-bird tickets for Config 2025 were already available. ## A New Brand and Web System - As Figma expanded toward developers, marketers, and broader product teams, it updated its visual identity. - The redesign introduced a new typeface and a refreshed brand system. - Figma used its own tools to audit and rebuild its web system. - The process included streamlining components, improving workflows, refining variables and styles, and preparing the system for future growth. ## Design Inspiration and Cross-Functional Collaboration - Community templates for Figma Slides offer ways to create more engaging presentations. - Ableton Note designer Pablo Sánchez shares seven principles for designing surprising and memorable digital experiences. - One North’s Nick Villapiano argues that developers should participate actively in design rather than treating design as a handoff. - These examples reinforce Figma’s broader view that design is collaborative and extends across disciplines. Figma’s year-end message is ultimately a recommendation to keep building in conversation with users. Product launches, brand systems, developer workflows, and community events become more valuable when people actively shape how they are used.

Read original(opens in new tab)
FigmaDesign SystemsUser InterfaceDev Mode+2
figma4 min readCurated summary

Figma 2024: We shipped it, you shaped it | Figma Blog

Figma’s 2024 product work was driven by community feedback, spanning 180 releases, UI3, AI tools, performance improvements, and new workflows for moving from concept to delivery. The company’s central conclusion is that meaningful progress comes from reducing friction while preserving designers’ existing habits. Community input shaped both major launches and small refinements across Figma, FigJam, and Figma Slides. ## UI3: Putting the Work Front and Center - Figma redesigned its interface for the first time substantially since 2019, updating typography, layout, colors, icons, labeling, and panel behavior. - Early UI3 testing revealed that floating panels disrupted users’ speed and daily workflows. - Based on feedback, panels became docked and resizable, while users could hide panels to maximize canvas space. - The eyedropper was upgraded to reuse styles and variables, switch between color formats, and create new styles or variables. ## Improving Core Design Workflows - Multi-edit simplified making changes across multiple designs. - Typography improvements added support for italic, bold, underline, underline styling, mixed paragraph spacing, and better local-font detection. - File organization improved through pinning, enhanced search filters, page dividers, and split tabs. - Drafts, content transfers, and file-moving workflows became easier for teams working across organizations. - “Suggest Auto Layout” helped users make designs more responsive. - Figma also introduced playful retro cursors inspired by DOS, Y2K, skeuomorphism, and Windows Vista. ## Performance, Collaboration, and Administration - Dynamic page loading made large design files more manageable. - Memory optimization and a revamped memory-management system improved performance in large files. - Multiplayer collaboration became smoother and more reliable. - Admin tools received new sidebar navigation and a dedicated content-management tab. - Infrastructure improvements included EU-localized file hosting, better support for large asset libraries, and stronger Enterprise security controls. ## AI Features That Reduce Friction - Visual search lets users find designs by uploading an image or selecting part of the canvas. - Asset search understands context instead of relying only on exact component names. - AI-assisted layer renaming improves file organization. - Replace Text Content generates realistic copy, while Rewrite, Translate, and Shorten help revise text. - Make an Image enables image creation and editing directly on the canvas, and Remove Background isolates subjects without requiring another tool. - FigJam’s AI mindmaps became a popular way to explore ideas and visualize connections. - Figma AI can turn a FigJam board into a Figma Slides outline and generate presenter notes. - First Draft, formerly Make Designs, was redesigned to help users move from an idea to an initial design. It was in limited beta, with planned support for custom libraries and deeper integration with existing design systems. ## Moving from Work in Progress to Shipping - Figma continued expanding tools intended to connect design work with development and presentation. - Dev Mode and Code Connect aimed to reduce developer context switching by translating design components into code. - Figma Slides supported creating high-fidelity presentations, extending Figma’s workflow beyond interface design. - The broader goal was to help teams move more smoothly from early concepts to implementation and delivery. ## Community-Led Product Development - Figma reported 10,000 Config attendees and more than 220 Friends of Figma groups worldwide. - Product decisions were shaped through beta testing, user conversations, and feedback from individual designers and organizations. - The company emphasized thoughtful AI development: AI should help express ideas and remove tedious work without replacing designers’ judgment. - Community members influenced both flagship features such as UI3 and First Draft and smaller quality-of-life improvements. Figma’s 2024 updates show a strategy focused on practical acceleration rather than novelty alone: improve the fundamentals, apply AI where it removes real friction, and build stronger bridges between design, development, and presentation. For teams, the most valuable improvements are likely the cumulative ones—better organization, faster search, stronger performance, and workflows shaped directly by how people already work.

Read original(opens in new tab)
FigmaAIDesign SystemsProduct Design+4
figma3 min readCurated summary

Pablo Sánchez’s 7 Rules for Designing the Unexpected | Figma Blog

Pablo Sánchez argues that memorable digital products come from personal conviction, unexpected sources of inspiration, and a willingness to imagine alternatives to the present. His work on Ableton Note demonstrates this approach: instead of reproducing conventional music-production tools, the app emphasizes tactile, immediate experimentation through features like “Capture,” which loops phrases after they are played. ## Design for Yourself - Strong design begins with personal conviction rather than detached objectivity. - Designers should create something that inspires them, since personal enthusiasm can make the final product feel authentic. - For Ableton Note, Sánchez replaced an expected MIDI editor with directly playable instruments suited to mobile interaction. - User testing later validated the direction, and the app launched without a MIDI editor. - Note lets users tap rhythms on a 16-pad grid, play melodies and chords, and develop variations in Session View. ## Brainstorm Without References - Starting with existing design references can lock a team into familiar solutions. - Brainstorming without references encourages ideas drawn from personal experience and absorbed cultural influences. - Sánchez describes this process as creating an “assemblage” from the collective ideas designers carry with them. - Although Note’s influences were not copied directly, apps such as Samplr and Borderlands Granular contributed to its creative foundation. ## Look Beyond Design - Inspiration can come from literature, dance, nature, science, emotions, and personal memories—not only other interfaces. - Sánchez wanted Note to feel as immediate as picking up a guitar and experimenting. - He also drew from Brutalist architecture, particularly its emphasis on materiality, simplicity, and the removal of unnecessary ornament. - This led to a minimal interface that reduces the complexity of music production and lets users interact directly with sound. - Note includes features such as a microphone-based sampler and a visual sound interface. ## Design for Tomorrow - Sánchez distinguishes between: - **Affirmative design**, which solves existing problems and reinforces the current world. - **Critical design**, which questions current conditions and explores how the world could be different. - Unexpected design combines both approaches by imagining new possibilities while encouraging people to investigate them. - Designers are encouraged to speculate beyond present assumptions rather than simply repeating familiar patterns. - The article invokes xenofeminist thinking—“If nature is unjust, change nature!”—as an example of challenging supposedly fixed conditions. The excerpt presents unexpected design as a practice of trusting personal intuition, combining diverse influences, and designing toward possibilities that do not yet exist. Ableton Note illustrates how a focused, unconventional vision can produce a more playful and distinctive experience than simply implementing expected features.

Read original(opens in new tab)
User ExperienceUser ResearchMobile App DesignMusic Production+4
figma3 min readCurated summary

The Making of the Figma Pattern Library | Figma Blog

Figma rebuilt its internal design system during the UI3 redesign after years of growth had produced inconsistent components, detached instances, and a fragmented workflow. The resulting Figma Pattern Library (FPL) was created through close designer-engineer collaboration and uses variables, APIs, and shared standards to keep design intent aligned with shipped code. Its goal is to provide both a reliable source of truth and a flexible foundation for building consistent, accessible products across Figma’s product suite. ## Why Figma rebuilt its design system - Figma’s internal system had become increasingly fragmented as the company and product portfolio expanded. - Components that were intended to be identical had accumulated subtle but important differences. - Detached component instances made consistency difficult to maintain. - The upcoming UI3 rollout made these problems impossible to ignore. - The team needed a foundation that could support consistent, efficient development across all Figma products. ## A paired design-and-engineering approach - A five-person team of designers and engineers led the rebuild. - The team modeled its workflow on pair programming: - One discipline would actively build. - The other would review and provide immediate feedback. - This collaboration helped bridge the gap between design intent and technical implementation. - The system was designed to be both: - A source of truth for shared UI decisions. - A springboard for future product development. - The effort resulted in the new Figma Pattern Library, or FPL. ## Using variables as a shared language - The previous system relied on Figma styles for designers and a separate Google Sheet for engineers’ color tokens. - Because the spreadsheet often lagged behind product changes, designs and production code diverged. - FPL replaced this disconnected process with Figma variables and the Figma REST API. - Typography variables were introduced and aliased through existing typography styles. - Color styles were migrated to color variables as a centralized source of truth. - CSS definitions were added to color variables so Dev Mode could display the correct variable names during inspection. ## Primitive and semantic color systems - FPL organized colors into two main variable collections: - **Primitive variables:** Color ramps organized by hue and numbered from 100 to 1000. - **Semantic variables:** Contextual names based on Figma’s dark-mode schema. - Semantic variables support multiple themes and products, including: - Light and dark modes. - Figma Design. - FigJam. - Slides. - Dev Mode. - Semantic variables alias primitive variables, allowing colors to be changed across themes and products without manually updating every component. - This structure enables shared components to adapt to different contexts while preserving visual consistency. The practical lesson is that a scalable design system requires more than a component library: it needs shared ownership, synchronized design and engineering tokens, and variable-based foundations that can support multiple products and themes.

Read original(opens in new tab)
FigmaDesign SystemsAccessibilityDesign Tokens+4
figma2 min readCurated summary

Why Devs Should Play an Active Role in Design | Figma Blog

Developers should participate actively in design rather than treating design files as read-only specifications. Nicholas Villapiano argues that Figma’s Dev Mode reduces friction, improves confidence, and creates a shared workflow between designers and developers. Teams should advocate for these tools because they understand day-to-day collaboration problems better than management often does. ## Shared Tools Create a Common Language - Dev Mode gives developers a dedicated space within Figma instead of forcing them to work cautiously in designer-oriented files. - It treats developers as contributors to the product process, not merely implementers of finished designs. - Figma’s Auto Layout offered an early example of shared understanding by resembling CSS Flexbox and making designs behave more like responsive web layouts. - Dev Mode extends that connection into a broader framework for collaboration between design and engineering. ## Developers Should Advocate for Better Workflows - Managers may not see the practical pain points developers encounter when translating designs into code. - Developers already advocate for change through GitHub issues, pull requests, and technical discussions, so they should apply the same behavior to design and collaboration tools. - Useful opportunities to raise these needs include one-on-ones, sprint retrospectives, and team meetings. ## Exploring Designs Without Fear - Dev Mode is read-only by default, preventing accidental edits or deleted work. - This works much like branch protection on `main`: developers can investigate freely without risking the source file. - Greater confidence encourages developers to explore designs instead of avoiding or cautiously navigating them. ## Comparing Design Changes Clearly - Dev Mode provides version history and visual comparisons similar to Git commit history and pull requests. - Developers can see what changed, when it changed, and who made the change. - Differences become an actionable checklist, such as updating copy, adjusting margins, or adding a component variant. ## Reducing Context Switching - Developers often lose time switching between design files, documentation, and code. - Dev Mode and related tools such as Code Connect aim to bring implementation details closer to the design workflow. - Centralizing relevant information can reduce the “tab-switching tax” and make design-to-code work more efficient. ## Practical Recommendation Developers should actively evaluate and promote shared design-development tools like Dev Mode. By creating safer exploration, clearer change tracking, and a common language around implementation, teams can improve productivity, collaboration, and morale.

Read original(opens in new tab)
FigmaDesign SystemsGithubReal Time Collaboration+3
figma2 min readCurated summary

8 Ways to Craft an Unforgettable Config Talk | Figma Blog

The post presents memorable Config talks as a source of inspiration and a practical rubric for future speakers. Its central lesson is that standout presentations challenge conventional thinking, tell a personal story, and show genuine care for the people affected by the work. The excerpt focuses on taking creative risks rather than blindly following industry best practices. ## Taking Risks and Rejecting Convention - Josh Wardle’s talk, **“Opting for the opposite,”** explains how he created Wordle by deliberately ignoring common growth tactics. - Wordle: - Could be played only once per day. - Did not link back to the game when shared. - Was built as a personal gift for Wardle’s partner, not as a viral product. - The talk resonated with Config speakers because it demonstrates that: - Simplicity can outperform metrics-driven optimization. - Conventional wisdom is not always appropriate for a specific audience. - Building with deep care for users can matter more than maximizing engagement. - The broader message is to show how a meaningful product decision emerged from a willingness to do things differently. ## Creating an Inspirational Presentation - The article frames memorable talks as more than informational sessions: they should change assumptions and leave audiences thinking differently. - Other referenced Config sessions include: - **“An Infinite Canvas,”** by Linda Dong and Mike Stern, about spatial-computing design. - A discussion between George Kedenburg III and Humane co-founder Imran Chaudhri about the development and vision of the Ai Pin. - These examples suggest that strong talks combine: - A distinctive perspective. - A compelling story about the work. - Clear attention to users and real-world impact. When preparing a Config talk—or any presentation—focus on a genuine insight or unconventional decision, explain the reasoning behind it, and connect it to the people you are building for.

Read original(opens in new tab)
FigmaProduct DesignWeb DevelopmentUser Experience Design+2
figma2 min readCurated summary

Updating Our Web System For A New Era | Figma Blog

Figma refreshed its web design system to support the company’s evolution from a single design tool into a broader platform for product teams. The previous system had accumulated overly similar components, inflexible colors, and typography that no longer suited its content. By auditing real-world usage and simplifying its component library, Figma created a more focused, flexible foundation aligned with its new brand. ## Why the Web System Needed to Change - Figma’s 2020 website was designed primarily to introduce a new design tool. - By 2024, Figma had expanded into a platform serving many kinds of product teams. - The existing system had begun to create friction: - Many components differed only slightly, making selection difficult. - The color system could not accommodate the evolving brand palette. - Typography was not flexible enough for the range of content Figma now produced. - The brand refresh—including Figma Sans, a new color palette, and a revised illustration style—created an opportunity to update the website system as well. ## Auditing and Simplifying Components - The Web Experience team created a script to measure: - Which components were being used - How frequently they appeared - Which pages used them - The audit exposed unnecessary complexity and opportunities to consolidate similar options. - The “Flex” component had grown to 48 variants over time. - After reviewing actual usage, Figma reduced it to 24 variants while preserving its essential functionality. - The team removed centered text as an option and established left alignment as the default across the web system. - The resulting property panel was more focused, easier to navigate, and better aligned with the refreshed visual language. ## Building a More Flexible System - Simplifying the library gave designers and content builders a smaller set of stronger, more purposeful choices. - Figma created templates for common page layouts. - New “building block” components can be combined in different ways to produce on-brand pages. - The system’s atomic elements include inputs, primitives, icons, and navigation components. Figma’s approach demonstrates the value of auditing how a design system is actually used before expanding it further. Removing redundant variants, establishing consistent defaults, and providing reusable templates can make a system easier to use while keeping it flexible enough for future growth.

Read original(opens in new tab)
FigmaDesign SystemsTypographyComponent Library+1
figma2 min readCurated summary

How We Built AI-Powered Search in Figma | Figma Blog

Figma’s AI search emerged from a practical problem: designers often struggled to find existing work, sometimes relying on Slack to locate files from screenshots or vague descriptions. The team initially pursued design autocomplete, but research showed that designers more often reuse and adapt prior work than create from scratch. This led Figma toward visual and semantic search, launched in 2024, using AI to help users find and reuse relevant designs. ## The Problem of Finding Existing Designs - Designers frequently knew what they wanted visually but not where the source file was located. - At Figma, hundreds of Slack messages showed designers asking colleagues to identify files from screenshots or descriptions. - Traditional keyword search was insufficient when users did not know a component’s exact name or file location. ## From Design Autocomplete to AI Search - Figma began with a three-day AI hackathon in June 2023. - One prototype, design autocomplete, suggested likely next components—for example, a “Get started” button in an onboarding flow. - The team believed AI should handle repetitive tasks so designers could focus on higher-level thinking and user needs. - Internal testing and user interviews revealed that designers commonly revisit old explorations, reuse existing work, and build on prior designs rather than starting from nothing. ## Using Search to Improve AI Suggestions - Figma built search infrastructure alongside autocomplete. - Retrieval-Augmented Generation (RAG) could improve AI responses by supplying relevant examples from existing designs. - Finding designs similar to the user’s current work could make autocomplete recommendations more useful and context-aware. - As testing continued, the team recognized that locating and reusing existing work was a more fundamental need than predicting the next component. ## Visual and Semantic Search - **Visual search** allows users to search with: - A screenshot - A selected frame - A quick sketch - **Semantic search** interprets the meaning and context of text-based queries, even when users do not know the precise component name or description. - Search results can help users discover designs and components and then open, preview, or insert them into their projects. Figma’s experience shows that successful AI features often emerge through iteration rather than from an initial prototype. The practical recommendation is to start with real user behavior, test ambitious ideas, and use AI where it removes friction—in this case, helping designers quickly find and reuse relevant existing work.

Read original(opens in new tab)
Large Language ModelsRAGSemantic SearchAi Search+2
figma3 min readCurated summary

Made in Figma: The National Park Service Goes From Paper to Pixels | Figma Blog

The National Park Service turned decades of printed visitor guides into a unified digital app serving 431 parks and monuments. GuideOne and Twohy Design Works drew on Massimo Vignelli’s 1977 Unigrid system to create a flexible interface that could accommodate diverse park data, long-term government use, and varied accessibility needs. Figma helped the NPS, designers, and developers collaborate on a practical design system that works for both visitors and park staff. ## A Digital System for 431 Parks - The NPS manages an unusually diverse collection of sites, ranging from major national parks to small historic memorials. - Each park controls much of its own data and writes its own content, making consolidation difficult. - The app needed to bring inconsistent information into one reliable system. - It includes: - Interactive maps - Self-guided tours - Essential visitor information - Content useful to both the public and NPS employees - The app launched in 2021 after the NPS moved from separate apps for individual parks to a single consolidated experience. ## Designing for Durability and Accessibility - Government software must remain useful for many years rather than follow short-lived product trends. - The app serves people with widely different accessibility requirements. - Designers had to balance a consistent national system with the individual character and needs of each park. - Collaboration between the NPS, GuideOne’s developers, and designers helped ensure concepts were feasible with the available data and engineering resources. ## Adapting the Unigrid - Before 1977, NPS brochures varied widely in format and visual style. - Massimo Vignelli’s Unigrid standardized: - Graphic components - Layout structures - Typography and visual hierarchy - Print-production methods - The system gave the NPS a recognizable identity while allowing individual parks to present their own stories. - GuideOne and Twohy Design Works treated Unigrid as a foundation for the app rather than copying the brochures directly. - The challenge was translating a print-based grid and editorial system into interactive screens, maps, and digital navigation. ## Figma as a Collaboration Tool - Figma made it easy to circulate designs among the NPS, designers, and engineering teams. - Shared prototypes exposed practical constraints around park data and implementation. - The workflow supported ongoing feedback instead of separating design from development. - This helped turn a historical visual system into a robust digital product. The project demonstrates how a well-established design system can be modernized without losing its identity. For complex public platforms, combining strong historical principles with collaborative prototyping, flexible data structures, and accessibility-focused design can produce a product that remains useful across many users and locations.

Read original(opens in new tab)
FigmaDesign SystemsUser ExperienceAccessibility+2