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

figmaFeb 27, 20222 min readCurated summary

What’s new in Figma: February 2022 | Figma Blog

Figma’s February 2022 updates focus on making design collaboration easier, from finding files to brainstorming in FigJam. Search now offers previews and file-type filters, while FigJam—now out of beta—adds more flexible editing and clearer collaboration tools. Overall, the release aims to keep teams aligned and help ideas move smoothly from brainstorming to implementation. ## Updated Search and Discoverability - Search results now include file previews, making it easier to identify the correct design. - Users can filter recents, team pages, and search results by Figma or FigJam file type. - These changes reduce the time spent locating current designs and resources. ## FigJam Collaboration Improvements With FigJam available to all teams, Figma added several refinements for brainstorming and diagramming: - **Centralized resource menu:** Components, templates, widgets, and other resources are now accessible from one simplified toolbar menu. - **Flexible font sizing:** Text can be resized to any size by dragging the corners of a text box, supporting clearer hierarchy and emphasis. - **Persistent stamps and highlights:** Reactions and highlights stay attached to the objects they reference when content is moved. - **Faster color and shape changes:** Updated toolbar icons make it easier to swap colors and shapes while building diagrams. - **Image borders:** Users can add borders to images to draw attention to selected visuals. - **Simpler selection borders:** Thinner borders and larger selection corners make objects easier to select and resize. Figma’s release reinforces its broader goal of bringing more people into the design process while keeping collaboration organized, discoverable, and visually clear.

Figma Figjam User Interface Design Collaboration+2

figmaFeb 7, 20223 min readCurated summary

Jamming on FigJam: a journey from beta to GA | Figma Blog

FigJam emerged from Figma’s shift to remote work and the growing need for a shared digital space for collaboration and connection. Figma launched it in beta to avoid perfectionism, learn quickly from users, and balance immediate needs with a longer-term product vision. Its path from inception to general availability was driven by cross-functional teamwork, rapid decisions, and continuous user feedback. ## A Collaborative Product Culture - Product Manager Emily Lin describes her role as a facilitator rather than a sole decision-maker. - Figma’s culture encourages ideas and decisions from anyone, with designers, engineers, product, support, sales, and marketing working together. - This collaborative model was especially important for building Figma’s second product. ## Why FigJam Was Created - As Figma began working remotely, the company saw users using its design tool to connect, brainstorm, socialize, and collaborate beyond traditional design work. - Figma employees experienced the same need for a digital gathering space during a difficult transition to remote work. - Because the need was urgent and FigJam became a company-wide priority, teams across Figma contributed to its development. ## Using Beta to Avoid Perfectionism - Building a second product created pressure to match the quality and care associated with Figma. - The team recognized that trying to perfect every detail could slow development and prevent them from responding to real user needs. - A beta launch allowed Figma to ship sooner, gather feedback, and iterate while continuing to pursue a broader product direction. ## Prioritizing Decisions and Feedback - The team focused first on questions that could block future decisions, such as how FigJam should relate to Figma and whether it needed to be a separate application. - Rather than extensively deliberating over every detail, they made decisions, consulted stakeholders, and adjusted based on feedback. - Hundreds of alpha testers participated through a shared Slack workspace and supplied ongoing insights. - Requests were divided into launch-critical fixes and fast-follow improvements: - Author names on sticky notes were required for the initial launch. - A timer could be released after launch as a follow-up feature. ## Iterating After the Beta Launch - After FigJam’s April 2021 beta introduction, product decisions continued to center on solving user problems. - A panel of users opted into new features and provided proactive feedback. - Ideas also came from support conversations, Twitter, and internal teams across the company. - The process emphasized giving active FigJam users the functionality they actually needed rather than following a rigid predetermined roadmap. The FigJam launch demonstrates the value of shipping an adaptable beta, resolving foundational questions early, and involving users and cross-functional teams throughout development. For products facing uncertainty or time pressure, iterative learning can be more effective than waiting for a perfectly defined first release.

Figma User Experience Figjam Slack+3

figmaJan 31, 20222 min readCurated summary

Design needs everyone: new plans for companies that design together | Figma Blog

Figma’s 2022 plan updates aim to make design a company-wide activity while reducing the organizational complexity that comes with more participants. FigJam is leaving beta with expanded collaboration features and new pricing, while Figma Enterprise adds structure, controls, security, and administrative support for larger organizations. The central goal is to help teams collaborate from brainstorming through implementation without overwhelming users or administrators. ## FigJam Becomes a Full Collaboration Product - FigJam was launched in beta to support brainstorming, diagramming, planning, meetings, and informal collaboration. - Teams adopted it for varied uses, including: - Dwell’s company-wide idea “swarms” - Square’s employee onboarding - Twitter’s cross-functional bug-bashing sessions - Figma expanded FigJam with plugins, widgets, and ready-to-use templates. - FigJam is free on the Starter plan, including: - Unlimited personal whiteboards - Three shared whiteboards - Unlimited collaborators - Unlimited shared whiteboards for an organization start at $3 per editor per month. ## Figma Enterprise for Larger Organizations - As more departments joined the design process, companies faced: - More files and projects to navigate - Less flexibility for individual teams - Greater administrative responsibility - The Enterprise plan is designed for organizations needing more structure, granular controls, advanced security, and support. - Pricing begins at: - $75 per editor per month for Figma - $5 per editor per month for FigJam - Features were being released immediately or planned for the following months. ## Workspaces Reflect Company Structure - Enterprise workspaces let organizations create dedicated areas for departments, product groups, or functions. - Workspaces help users focus on relevant content while preserving access to company-wide resources. - Administrators can define default teams and libraries for each workspace. - Users can limit searches to a particular workspace to find files, people, and components more quickly. ## Administration at Company Scale - Enterprise tools are intended to manage large numbers of files, users, and permissions more efficiently. - Workspace administration can be delegated to people familiar with each group’s users. - Delegated responsibilities include membership, roles, and true-ups. - Role-setting through SCIM is also introduced to automate administrative workflows. Figma’s broader recommendation is that companies should invite more people into design while using FigJam for inclusive collaboration and Enterprise workspaces and controls for organization-wide scale.

Figma Figjam Design Collaboration Scim+2

figmaJan 25, 20223 min readCurated summary

Little Big Updates: fixes and features for a better workflow | Figma Blog

Figma’s “Little Big Updates” introduces 32 small but meaningful improvements aimed at making Figma and FigJam faster, more accessible, and easier to navigate. The updates cover text editing, keyboard shortcuts, component publishing, libraries, exporting, and FigJam collaboration. Together, they streamline common workflows and reduce friction for designers and teams. ## Faster Editing and Accessibility - Text editing is up to 10 times faster in Figma and FigJam. - macOS accent-menu support is available by long-pressing letters. - HEIC image uploads are supported, making it easier to use iPhone photos. - Bullets remain consistent across mixed text styles. - Home and End keys navigate to the beginning or end of text areas. - External-link interstitials have been removed to preserve workflow continuity. - Retina screenshots pasted from Chrome will use the correct dimensions. - Text highlights on blue FigJam backgrounds are now more visible. ## Canvas Navigation and Keyboard Shortcuts - `⌘L`/`Ctrl+L` copies links to files and selected frames in the desktop app. - `⌘R`/`Ctrl+R` renames elements while the interface is hidden. - Holding `⌘`/`Ctrl` while clicking selects top-level frames directly. - Quick actions (`⌘+/` or `Ctrl+/`) can show or hide the FigJam UI. - Quick actions can also unlock all objects. - Hovering over the FigJam toolbar reveals additional keyboard shortcuts. - Connector text now supports new lines with Return or Enter. - Objects continue snapping to the grid while being dragged. ## Design Tools and Components - Vector network regions can be filled with different colors. - Components and instances can be searched when inserting (`Shift+I`) or swapping. - Any component can be published via its right-click menu. - Components can be searched in the publishing modal. - Published files now have a distinct icon for easier identification. - Invalid components can be located directly from the publishing modal. - The publishing modal allows users to choose which components appear in the asset list. - Unpublished changes can be published directly from the relevant interface. - A “Return to instance” option is available when selecting a main component. - SVG strokes on parent objects export correctly. - Libraries can be accessed directly from organization subscription settings. ## FigJam Improvements - FigJam shapes support more flexible resizing. - Right-clicking an element copies a direct link to it. - Stamps can be dragged directly from the stamp wheel. - The red shape color is now a truer red. - Team libraries are prioritized in the library-selection modal. - Connector text editing is simpler with standard Return or Enter behavior. The updates demonstrate how incremental improvements to shortcuts, performance, publishing, and collaboration can substantially improve everyday workflows. Designers and teams can explore the changes through Figma’s accompanying Community file.

Figma Design Systems Figjam Macos+4

figmaJan 25, 20223 min readCurated summary

Little Big Updates: Dispatches from Quality Week | Figma Blog

Figma’s Quality Weeks dedicate focused time to bugs, edge cases, and features that technically work but feel broken. The post argues that software quality is not defined only by code correctness: browser behavior, user expectations, perceived responsiveness, and inconsistent support can all make a product feel buggy. Small fixes—sometimes only a few lines of code—can therefore have disproportionately large effects. ## Quality Week and the macOS Accent-Menu Bug - Figma periodically holds Quality Weeks to address forgotten bugs, oddities, and issues outside normal feature work. - A macOS accent-menu problem caused letters to repeat or fail to appear. - The issue involved the complex sequence of keyboard and text-input events handled by the operating system and browser before Figma received them. - Molly developed a fix of fewer than ten lines that worked in Firefox and Safari and supported both keyboard and mouse input. - Chrome, Figma’s most widely used browser, still exhibited the problem, showing that a technically correct fix may not solve the user-facing issue for most customers. - She also reported the underlying browser issue to Chrome developers for a possible future fix. ## The Difference Between a Technical Bug and a Real Bug - In theory, a bug consists of: - How the software is supposed to behave. - How its current behavior differs. - Real-world systems make those definitions ambiguous: - Intended behavior may not be clearly defined. - A perfect fix may be impractical or impossible. - Some problems require choosing a new, less-buggy direction rather than restoring the old one. - Historical examples such as Y2K, the Pentium FDIV error, and the Mars Climate Orbiter failure demonstrate that identifying a problem and knowing its cause does not automatically make it easy to resolve. - Figma treats issues as worthy of attention when they materially affect users, even if they do not fit a strict engineering definition of “bug.” ## When Missing Support Feels Like a Bug - HEIC image support illustrates the difference between “never implemented” and “broken” from a user’s perspective. - Figma’s inconsistent handling of HEIC files—especially images dragged from iPhones and iPads—made the product feel unreliable. - Sawyer added support in 98 lines of code. - The new support exposed a second usability problem: large, high-resolution HEIC files could take many seconds to process, during which the canvas appeared to ignore the drop. - Jackie identified that a loading state could communicate progress and prevent users from assuming the feature had failed. - The example shows that fixing one problem can reveal another, and that perceived responsiveness is part of product quality. Figma’s approach is to prioritize issues based not only on technical correctness but also on how users experience the product. Quality work should address the small inconsistencies that make software feel unreliable, particularly when a modest implementation can remove substantial frustration.

Figma Figjam Macos Quality Assurance+3

figmaJan 19, 20222 min readCurated summary

From experiment to launch: how data shaped a new comments experience | Figma Blog

Figma used a series of data-driven experiments to redesign its comments experience and encourage collaboration among both editors and viewers. Although comments strongly predicted team retention and growth, they were underused because users struggled to discover them. Experiments confirmed that improving visibility increased comment creation, while an intuitive-looking relocation of the comments control unexpectedly reduced discoverability. ## Collaboration and Comments - Teams that collaborate during their first month are: - 1.75× more likely to be retained. - 6.5× more likely to become customers. - Figma identified comments as a potential “front door” to collaboration because both editors and viewers can use them. - Despite their value, comments were not widely used, prompting the data science team to investigate the gap between user needs and behavior. ## Testing Comment Discoverability - Users previously entered comment mode through an icon in the upper-left corner of the editor. - Research sessions suggested that comments were valuable but difficult to find. - Figma tested a prompt encouraging view-only developers to leave comments. - After two weeks in a 50/50 experiment: - Comment creation increased by 45% in the test group. - The rate of users returning to comments the following week did not change. - The result showed that simply making comments more visible could substantially increase usage. ## An Unexpected Result - Figma hypothesized that moving the comments entry point from the left side of the menu bar to the right would improve discoverability. - The reasoning was that the left side emphasized creation tools, while the right side contained collaboration and viewing features more relevant to cross-functional users. - Among new users, the change caused a 20% decrease in comment discovery within seven days of signup. - The failed experiment demonstrated that seemingly logical product changes can significantly harm user behavior. - It also reinforced the value of controlled experiments: product hypotheses are often wrong, and teams should expect testing to disprove many ideas. Figma’s experience illustrates that effective product development depends on combining user research with rigorous experimentation. Rather than relying on intuition about interface placement, teams should validate each change with real behavioral data and use unexpected results to guide subsequent iterations.

Figma Collaboration User Research Data Science+2

figmaJan 9, 20222 min readCurated summary

The year ahead: a conversation with Soleio, Julie Zhuo, and May-Li Khoe | Figma Blog

The article explores how creative work may evolve in 2022 as remote and hybrid work become permanent. Soleio argues that collaboration will move further into digital tools, requiring stronger documentation, asynchronous processes, and organizational discipline. He also predicts that creative tools will spread across the workforce and increasingly incorporate automated, virtual collaborators. ## Hybrid Work Will Reshape Creative Collaboration - Creative work will increasingly reflect hybrid workforce models. - Institutional knowledge and team context will move from physical offices into digital environments. - Traditional brainstorming sessions may shift from conference rooms to tools such as FigJam. - Creative software will become more accessible and collaborative, encouraging people outside traditional creative roles to use it. ## London’s Growing Technology Ecosystem - Relocating from Silicon Valley to London required Soleio to adjust his understanding of the two technology ecosystems. - Whereas technology dominates the Bay Area, it remains a newer and more disruptive sector in many other regions. - London is attracting more early-stage investors and becoming a stronger home for ambitious startups. - This growth may allow founders to build major technology companies without moving to Silicon Valley. ## Global Teams Need Better Organizational Hygiene - Distributed teams must deliberately coordinate feedback and decision-making across time zones. - Clear writing, recorded video feedback, and structured processes will become more important. - Remote teams cannot rely on shared office space or informal conversations to maintain context. - Transparent documentation and decision-making will become a competitive advantage. ## Automation and Virtual Collaborators - Design exploration and feedback are expected to become increasingly automated. - Future knowledge work may involve non-human agents that provide feedback, support iteration, and perform tasks currently handled manually. - These tools could fundamentally change the nature of teamwork by making virtual collaborators part of everyday creative processes. Teams preparing for the future should invest not only in collaborative tools, but also in documentation, asynchronous communication, and transparent organizational practices.

Figma Figjam Open Source Collaborative Design+3

figmaDec 15, 20212 min readCurated summary

Frame 2021: design by the numbers | Figma Blog

Figma’s 2021 data shows how remote and hybrid work reshaped design collaboration. Teams increasingly worked across borders and included product managers and developers earlier, using FigJam for ideation and Figma for interface design and handoff. The overall trend was toward a more open, continuous design process spanning idea to implementation. ## Building Across Borders - Figma users represented 235 countries and territories. - Collaboration activity grew across regions and time zones as organizations adopted virtual-first and hybrid work. - In the U.S., New York and California remained major collaboration hubs, while Washington and Texas gained activity. - Globally, the U.S. and Russia were established hubs, with India, Brazil, and Indonesia increasingly active. - Nearly 14% of collaboration occurred between different continents, up from 8% in early 2020. - Examples included teams collaborating between Madrid and Wellington, and between Beijing and Buenos Aires. ## From Ideas to Shipped Products - About 52% of users collaborated with others in 2021. - Shared files had a median of four invited collaborators. - Product managers and developers were the largest groups of Figma users outside designers. - FigJam supported early-stage brainstorming and freeform exploration before teams moved into Figma to build interfaces. - Around 15% of active FigJam users began with templates, with brainstorming templates the most popular. ## A More Open Design Process - The first collaborator viewed a Figma file an average of 10 days after creation, compared with 19 days in 2019. - This suggests cross-functional partners were being involved earlier in design. - Developers participated in 40% of collaborative files. - When developers joined, handoff typically began 33 days after design creation and continued for 45 days after the first code inspection. - Handoff activity often continued well after the final design edit. ## Collaboration Beyond Design - Teams increasingly used digital tools for activities traditionally held in person. - FigJam supported stand-ups, icebreakers, roadmapping, retrospectives, and other team exercises. - The shift reflects a broader move toward virtual-friendly collaboration across the entire product development process. Figma’s findings recommend treating design as a shared, end-to-end process rather than an isolated stage. Bringing cross-functional partners into FigJam and Figma early can improve collaboration across locations, disciplines, and the full path from concept to code.

Figma Figjam Design Collaboration Remote Work+2

figmaDec 15, 20212 min readCurated summary

What’s new in Figma: December 2021 | Figma Blog

Figma’s December 2021 updates focus on making collaboration and creation more seamless across Figma and FigJam. The release adds richer media support, improved drawing tools, and expanded mobile capabilities. Together, these changes help teams share context, refine ideas, and preview designs without interrupting their workflow. ## Enriching FigJam collaboration - Users can paste links into FigJam to watch Vimeo videos, play Spotify music, and share other rich media. - The new Vimeo plugin supports screen and webcam recordings directly within Figma and FigJam. - Recordings can be used for status updates, product demos, tutorials, and asynchronous collaboration. ## Highlighting and refining ideas - The new **Highlighter** tool emphasizes text and other FigJam elements. - Holding **Shift** while highlighting creates perfectly straight lines. - The **Eraser** tool removes individual strokes, making it easier to correct sketches and refine work in progress. ## Expanding mobile design workflows The updated Figma mobile app lets designers preview, review, and manage work more independently from a desktop. - Play prototypes directly on mobile devices. - Toggle hotspot hints during prototype playback. - Mirror selected desktop frames to a mobile device. - Share, browse, and view Figma files and prototypes. - Share, browse, and view FigJam files. - Navigate teams, projects, and workspaces from the app. - Updates are available for iOS and Android phones and tablets. Figma’s December release is primarily about removing friction from collaboration: teams can communicate with richer media, improve FigJam ideation with more precise tools, and validate mobile experiences directly on their devices.

Figma Prototyping Figjam Android+4

figmaDec 13, 20212 min readCurated summary

The Figma prototype challenge: 15 tips in 15 days | Figma Blog

The Figma prototype challenge is a 15-day learning series designed to help designers move from basic prototyping to advanced, high-fidelity interactions. It emphasizes experimentation, user testing, developer handoff, and critique, using Figma’s newer features—especially Smart Animate and interactive components—to create more realistic prototypes with less wiring. ## Building a Foundation with Smart Animate - **Smart Animate** creates animated transitions between screens by matching layers with the same names. - It can be combined with preset transitions such as slide and push. - Matching layers with Smart Animate is useful for interfaces such as tab navigation. - Preserving consistent layer names between screens is essential for the animation to work correctly. ## Creating Reusable Interactive Components - **Interactive components** define interactions and animations between variants within a component set. - Instances become interactive immediately in prototype mode. - Component-level interactions reduce the size and complexity of larger prototypes. - They are particularly useful for demonstrating microinteractions. ## Nesting Components for More Complex Behavior - Interactive components can be nested inside one another. - Nested components allow elements such as list items to contain their own built-in interactions. - This reduces the number of prototype links required between component variants. - The approach makes complex interfaces easier to maintain and reuse. ## Applying the Techniques to a Mobile Prototype - The first week concludes by combining Smart Animate, matching layers, interactive components, and nesting. - These techniques are used to build a mobile prototype with interactive bottom navigation. - The challenge progresses from foundational transitions to increasingly complex, component-based interactions. - Figma Community files accompany the daily challenges so designers can follow along or create their own version. The practical recommendation is to learn prototyping incrementally: start with Smart Animate, preserve layer structure carefully, then introduce interactive and nested components to create sophisticated interfaces with fewer connections and more reusable behavior.

Figma Prototyping User Testing Interactive Components+2

figmaNov 29, 20212 min readCurated summary

What’s new in Figma: November 2021 | Figma Blog

Figma’s November 2021 updates focused on helping distributed teams collaborate more efficiently and inclusively. The main improvements redesigned comments to make feedback easier to notice and manage, while audio captions made real-time discussions more accessible to deaf and hard-of-hearing users. Together, these features reduce friction when teams move from ideas to decisions and deliverables. ## Redesigned Comments for Faster Feedback - Comments in both Figma and FigJam are now more prominent and easier to spot. - Adding and responding to comments has been simplified. - The redesign helps teams: - Share feedback more naturally - Organize and manage discussions - Act on feedback without interrupting their design workflow - The goal is to keep collaboration “in the flow” as teams iterate across functions. ## Audio Captions for More Inclusive Collaboration - Figma had previously introduced audio calls and cursor chat, allowing teammates to communicate without leaving a shared file. - FigJam also supports collaborative interactions such as high-fives during brainstorming sessions. - Closed captioning was added in beta to the Figma desktop app. - During audio discussions, captions make it clearer: - Who is speaking - What each person is saying - This improves participation for deaf and hard-of-hearing users and helps everyone follow important feedback. Figma’s November updates reinforce a practical collaboration principle: feedback should be easy to give, easy to understand, and accessible to every participant. Teams using Figma and FigJam can take advantage of redesigned comments and captions to make shared design work faster and more inclusive.

Figma Figjam Accessibility Collaborative Design+2

figmaNov 15, 20212 min readCurated summary

Stay in the flow with redesigned comments | Figma Blog

Figma redesigned comments in Figma and FigJam to make feedback easier to discover, understand, and act on without interrupting design work. The updates encourage more collaborators to participate, promote shorter and more contextual feedback, and provide better tools for managing large volumes of comments. Overall, the redesign aims to keep teams in the flow while incorporating feedback. ## Inviting More Collaborators - The comment sidebar is now easier to find for viewers opening a file. - Comments are also more visible in prototype presentation mode. - These changes help unfamiliar collaborators discover where to leave and review feedback. - Figma hopes increased visibility will encourage more contextual input instead of feedback through separate tools—or no feedback at all. ## Encouraging Clearer Feedback - The comment composer was made smaller to encourage concise, easier-to-follow responses. - Reactions let users quickly express opinions, keep threads shorter, and lower the barrier to participation. - Collaborators can select an area of the canvas to leave broader feedback about multiple designs, groups of stickies, or a general concept. - Area-based comments preserve the context of feedback, whether it concerns a broad layout or a small design detail. ## Managing Feedback During Design Work - Comment pins are visible by default, making feedback harder to overlook. - Designers can keep comments open while editing the canvas, allowing them to reference feedback without leaving their workflow. - A simplified canvas view makes it easier to see where feedback is concentrated. - Comment pins display avatars and provide previews on hover. - Comments in the same area are grouped into clusters to reduce visual clutter. - Users can search comments by keyword or person and sort them by date. - Comments can be marked as “unread” as a reminder to return to them later. Figma’s redesigned comments make collaboration more accessible and structured, particularly during design critiques, sprints, and iterative review. The practical recommendation is to use concise, contextual comments and the new search, clustering, and unread features to keep feedback manageable.

Figma User Experience Prototyping Figjam+2

figmaNov 10, 20212 min readCurated summary

Behind the build: a Q&A with developer Gavin McFarland | Figma Blog

Gavin McFarland, a freelance design consultant and developer, discusses building a FigJam table widget after first creating a popular Figma table plugin. The widget lets users manage tabular data without leaving FigJam, supporting columns, rows, data import, and sorting. His experimentation with the widget API evolved into broader questions about multiplayer collaboration, performance, and productivity. ## Gavin’s Path to Plugin Development - McFarland began by designing and building websites for friends and family. - As a freelance consultant focused on user-centered digital transformation, he regularly pushes himself to learn new tools. - After seeing someone ask for an easier way to create tables in Figma, he modified the Rectangle Creator example into his first plugin, **Table Creator**. - The plugin eventually gained tens of thousands of users. ## Building a Table Widget for FigJam - McFarland created a FigJam table widget for users who need to display and manage structured data during collaborative work. - The widget supports: - Adding rows and columns - Importing data - Sorting by columns - The goal is to keep users inside FigJam rather than requiring a separate tabular-data application. ## Learning the Widget API - He began with the FigJam notepad example and made incremental modifications to understand the API. - The project required learning JSX, which he had not previously used extensively. - After understanding the basics, he experimented with rendering rows, columns, and different visual designs. ## Collaboration and Multiplayer Challenges - What started as an API exercise became an exploration of how teams could work more effectively together. - McFarland considered: - How simultaneous editing should work when multiple people modify one table - How the interface could show that another collaborator is active - How to keep large datasets responsive during multiplayer interactions - These challenges appealed to him because they combine visual design with technical problem-solving. ## Finding Ideas Through the Community - McFarland looks for problems designers encounter in their everyday workflows. - He draws inspiration from the Friends of Figma Slack community and the broader developer community. - Conversations with other plugin creators help him exchange ideas and improve his own work. ## Focus on Practical Productivity - He hopes the widget helps people work more productively and collaborate more closely. - His broader motivation is creating tools that address real, everyday problems. - The article ends as he begins discussing another plugin, **Node Decoder**, so the remainder of that project description is not included.

Figma Figjam Real Time Collaboration API+3

figmaNov 8, 20212 min readCurated summary

From candidate interviews to developer crits: how Figma engineering uses FigJam to scale | Figma Blog

Figma Engineering uses FigJam as more than a brainstorming tool: it supports team culture, hiring, collaboration, and technical feedback in a rapidly growing, hybrid workplace. By moving activities such as stand-ups and architecture interviews onto a shared digital canvas, the team preserves the spontaneity of in-person collaboration while creating a persistent record of discussions and ideas. ## Supporting Remote Team Culture - Remote stand-ups had become transactional and often ran over time as the team grew. - Engineers now post updates asynchronously in FigJam during a timed, 10-minute session. - Team members can add stickies, photos, reactions, hearts, and comments, making it easier to share personal updates and connect informally. - The shared canvas also encourages playful traditions, such as “20-second animal,” where everyone draws a selected animal at the end of a meeting. ## Scaling Engineering Processes - Figma’s mobile team grew to more than 20 people, creating a need for processes that scale with the organization. - Engineers focus on helping new teammates learn the company’s infrastructure and technology stack. - FigJam provides a shared space for organizing information and maintaining collaboration as teams expand. ## Digital Whiteboarding for Candidate Interviews - Engineering interviews include architecture and system-design exercises designed to reveal how candidates think and collaborate. - When interviews moved online, Figma replaced physical whiteboards with FigJam. - Interviewers share a prompt, observe candidates as they develop a solution, and discuss the design together on the virtual canvas. - Candidates unfamiliar with FigJam receive a brief orientation, and open sessions allow them to participate without creating an account. - The process retains the collaborative nature of in-person whiteboarding while working within Figma’s hybrid model. Figma’s approach demonstrates how a shared, flexible canvas can support both serious technical work and informal team connection. For distributed engineering teams, combining asynchronous updates, collaborative whiteboarding, and lightweight social activities can help preserve culture while processes scale.

Figma Figjam Android Mobile Development+2

figmaNov 3, 20213 min readCurated summary

Behind the build: a Q&A with developer Tekeste Kidanu | Figma Blog

Tekeste Kidanu, known online as tk made it, builds Figma and FigJam plugins that address practical needs from the design community. His best-known project, SPELLL, provides grammar and spell checking inside design files, while his newer FigJam tools support note-taking, color customization, and voting. He credits community feedback, Figma’s approachable plugin API, and his interest in design for shaping his work. ## Background and Motivation - Tekeste is an introverted frontend developer who moved to the U.S. in 2016 to study computer science. - He became interested in improving his design skills, particularly in color theory and typography. - He contributes to the Figma Community by creating tools that help designers work more productively. ## SPELLL: Spell Checking for Figma and FigJam - SPELLL scans Figma and FigJam documents for spelling and grammar errors. - Users can correct mistakes directly, similar to using Grammarly. - The plugin aims to save designers time and prevent embarrassing typos during presentations. - Tekeste developed the idea after seeing requests on the Figma Forum, Designer News, Twitter, and other design communities. ## Learning the Figma Plugin API - Tekeste researched how the plugin should work before beginning development. - He taught himself the Figma plugin API through its documentation and questions in the Figma Plugins Slack workspace. - He was surprised by how easy it was to begin, finding that his existing JavaScript and web-development knowledge provided a strong foundation. ## Building for FigJam - When FigJam introduced plugin support, Tekeste began adapting his existing Figma tools. - The similar APIs and development processes for Figma and FigJam made migration straightforward. - His FigJam projects include: - **Notes**, a widget for storing detailed plain-text or Markdown notes without cluttering a board. - **Color Picker**, which adds custom-colored stickies and shapes. - **Voting**, which supports anonymous and non-anonymous voting sessions. ## Community-Driven Inspiration - Tekeste frequently finds ideas in feature requests and discussions on Twitter, the Figma Forum, and Friends of Figma Slack. - He notes that many requested features can be implemented through the plugin API before Figma adds them natively. - He hopes another developer will build a FigJam widget showing what music participants are listening to. ## Looking Ahead - Tekeste plans to improve his voting widget and make it the best possible tool for FigJam sessions. - He is excited about the public release of FigJam plugins and widgets and the creativity it may encourage. - He is also inspired by the growing popularity of playful, animated, and interactive interfaces, citing Apple Maps and the Honk app as examples. Figma’s open plugin and widget platform gives developers like Tekeste a practical way to turn community requests into useful design tools. His work demonstrates how existing web skills, combined with active listening to users, can produce focused improvements to collaborative workflows.

User Interface JavaScript Web Development Markdown+2