Design Tools

26 posts

figma2 min readCurated summary

Reflections on Config, our first user conference | Figma Blog

Config, Figma’s first user conference, brought more than 1,000 participants together to learn, collaborate, and strengthen the design community. Rather than imposing a rigid agenda, Figma invited users to shape the event through workshops, talks, and roundtables. The conference highlighted open design, deeper community connection, and the importance of using technology to support—not replace—human relationships. ## A Conference Built by the Community - Figma created Config as a physical gathering where users and employees could exchange ideas directly. - Attendees discussed team culture, mentorship, design ethics, and other issues affecting the design industry. - Many sessions came from community submissions, encouraging participants to contribute rather than simply listen. - Sessions were also recorded for people who could not attend in person. ## Open Design and Shared Creativity - A central theme was “open design”: sharing, remixing, and building on one another’s work. - Devon Zuegel explored how open-source principles apply to urban planning and physical infrastructure. - Jason Kunesh described how Chicago students helped create a design system when the city’s design team lacked resources. - Miguel Solorio explained how Microsoft incorporated the broader community into its design process. ## Technology as a Tool for Connection - Craig Mod warned that technology can encourage isolation, even as it makes communication easier. - He argued that digital tools should help people connect more deeply with their surroundings rather than escape them. - May-Li Khoe discussed challenging established norms while supporting the communities she cares about. - Both talks encouraged attendees to consider their responsibility to build stronger, more inclusive communities. ## Continuing the Conversation - Figma presented Config as an ongoing community dialogue rather than a one-time event. - The company thanked attendees, speakers, and employees for making the conference possible. - Figma encouraged everyone to watch the recorded sessions and stay engaged with future discussions. Config’s main lesson was that design becomes more powerful when it is shared openly and grounded in community. Future conferences and design initiatives should prioritize participation, collaboration, and meaningful human connection.

Read original(opens in new tab)
figma1 min readCurated summary

Figma Time Travel | Figma Blog

Figma Time Travel is a playful April 2019 feature that lets users revisit historical design styles through version history. With one click, users can choose from four themed “palette years,” transforming their designs into retro-inspired visual eras. The feature is presented as an Easter egg rather than a major productivity tool, giving designers a lighthearted way to explore Figma’s capabilities. ## Accessing Historical Design Styles - Time Travel is available through Figma’s version history. - Users can select from four new options representing distinct historical palette years. - Each option applies a different retro visual treatment to the design. - The feature is designed for one-click experimentation. ## A Playful Easter Egg - Figma describes the feature through humorous references to older workplace environments and technology. - The “1973 vintage” option evokes grey cubicles and mechanical keyboards. - The launch was intended to celebrate April with fun rather than an April Fool’s prank. - It reflects Figma’s interest in incorporating unexpected, entertaining details into its design tools. Designers can find Time Travel in version history and use it as a creative experiment or nostalgic Easter egg rather than as a serious archival workflow.

Read original(opens in new tab)
figma2 min readCurated summary

Figma Raises $40MM Series C Round led by Sequoia | Figma Blog

Figma announced a $40 million Series C funding round led by Sequoia Capital, with participation from new and existing investors. The funding supports Figma’s mission to make visual design accessible, collaborative, and web-based. The company plans to expand its enterprise offering, improve performance and design-system tools, develop extensibility, and strengthen its global community. ## Funding and Strategic Investors - Sequoia Capital led the round, joined by Coatue, Founders Fund, Jeff Weiner, Mike Krieger, Andrew Wilson, Dan Rose, and existing investors Index, Greylock, and KPCB. - Figma selected investors with experience building enduring companies and communities. - The company highlighted Sequoia’s investments in GitHub and PlanGrid as evidence of relevant expertise. ## Expanding Collaborative Design - Figma argues that productivity software is increasingly becoming collaborative and shared. - Major design teams at Square, Uber, Twitter, and GitHub had adopted Figma. - The new funding will support: - Expansion of Figma Organization, its enterprise offering - Improvements for individual designers and small teams - Continued development of collaborative workflows ## Performance and Design Systems - Despite being viewed as faster than native competitors, Figma sees significant opportunities to improve loading and rendering performance. - With more than one million signups, the company emphasizes delivering a high-quality experience at scale. - A major focus is making Figma the best platform for building and managing design systems. ## Platform Extensibility - Figma is developing platform and extension capabilities to support varied design workflows. - The company is deliberately avoiding a fixed release timeline because extensions must be stable and secure. - Extensibility is presented as essential to making the design process genuinely open. ## Building a Global Community - Around 80% of Figma’s weekly active users were located outside the United States. - The company had 26 user groups in cities ranging from Lagos to Toronto. - Figma planned to improve connections among users worldwide through meetups, local groups, and other community initiatives. - Community is described as a foundation for Figma’s future and a key reason Sequoia was an appealing partner. Figma intended to use the Series C investment not simply to grow the business, but to deepen its collaborative product, improve its technical foundations, and build a global community around accessible design.

Read original(opens in new tab)
figma2 min readCurated summary

Figma year in review: 2018 | Figma Blog

Figma’s 2018 review describes a shift from building a collaborative design tool to building an open platform and global community around it. After launching publicly in 2016 and raising $25 million in Series B funding, Figma expanded its API, attracted businesses and developers, and grew adoption among large organizations. The company concludes that partnerships, integrations, and community initiatives will remain central to its growth. ## From Product to Community - Figma marked roughly two years since its public launch in September 2016. - In 2018, its focus expanded beyond the core product to include: - The Figma Platform - API-powered integrations - Community events and resources - Adoption across departments in major organizations - Microsoft used Figma’s API to automate parts of its developer handoff process. ## The Figma Platform - Figma launched what it called the first web API for a design tool. - Its web-based architecture enabled integrations that would have been difficult with isolated desktop software. - Companies such as Uber and GitHub used the API to customize their design workflows even before the public launch. - Seven months later, businesses were being built on the platform, including paid services. ### Community-built tools - PDF exporting - Style-guide generation - Find-and-replace tools for text and layer names - JavaScript libraries for working with the Figma API ### Commercial integrations - Avocode and Zeplin connected Figma designs to developer handoff workflows. - Principle added advanced animation capabilities. - Relay for Figma pushed designs directly into codebases. - Pagedraw converted Figma designs into React. - Overflow synchronized designs for user-flow diagrams. - Haiku converted designs into production-ready components. Figma expected partnerships and additional integrations to become an even larger focus in 2019. ## Building a Global Community - Figma hosted design-system meetups in cities around the world, initially covering eight cities and later reaching 17 countries. - Events connected designers and encouraged detailed discussions about systematic design. - Figma launched DesignSystems.com to share practices and stories from teams at companies including Airbnb, GitHub, Braintree, and Segment. - The company viewed community connections and shared knowledge as an extension of its open-platform strategy. Figma’s 2018 direction was clear: continue investing in an accessible web-based tool while enabling an ecosystem of integrations, businesses, and designers around it.

Read original(opens in new tab)
figma2 min readCurated summary

Introducing Smart Selection - speed up your design explorations | Figma Blog

Smart Selection is designed to reduce the repetitive work involved in arranging and refining multiple objects in Figma. It lets designers adjust spacing, position, and size directly on the canvas, helping them explore ideas faster while preserving familiar design workflows. The accompanying Tidy Up feature automatically organizes uneven selections into consistently spaced layouts. ## Smart Selection - Works automatically on selections or groups of three or more objects with uniform spacing. - Pink handles between objects let users adjust the spacing of all items at once. - A ring control allows objects to be rearranged quickly. - Selecting an item’s pink ring enables resizing by dragging its edges. - The feature is implemented as a direct canvas interaction rather than a separate tool or object type. ## Tidy Up - Tidy Up converts messy arrangements into evenly spaced groups suitable for Smart Selection. - It shifts selected items closer together while maintaining consistent spacing. - Unlike a traditional distribute command, it ensures spacing is even and compact. - It is useful for organizing tables, toolbars, and large sets of screens. - A layout containing 20 screens, for example, can be aligned in one action instead of manually correcting 19 separate gaps. - The command is available through the right sidebar, with shortcuts: - macOS: `⌥⌘T` - Other platforms: `Ctrl-Alt-T` ## Future Development - Figma planned to add support for two-dimensional grids. - The team invited users to provide feedback through the in-app help button or Spectrum. Smart Selection and Tidy Up are intended to replace tedious manual resizing, moving, and spacing adjustments with fast, intuitive canvas interactions, allowing designers to spend more time exploring creative possibilities.

Read original(opens in new tab)
figma2 min readCurated summary

We made a mistake with our API Challenge, and we’re sorry | Figma Blog

Figma apologized for launching an API challenge that the design community viewed as unpaid “spec work.” The challenge aimed to encourage a Figma-to-Sketch export and support a more open design ecosystem, but Figma acknowledged that its enthusiasm overshadowed the risk of exploiting creative labor. The company paused the challenge and later decided not to pursue any version of it. ## The API Challenge and Its Goal - Figma launched a challenge focused on building a Figma-to-Sketch export. - Its stated purpose was to promote an open ecosystem and help fund tools for exporting data from Figma. - The initiative was intended to expand interoperability within the design toolchain. ## Community Criticism - Designers quickly criticized the challenge as “spec work”—unpaid creative work submitted with no guaranteed compensation. - The backlash reflected broader concerns about skilled workers being asked to produce valuable work without fair payment. - Figma recognized that the challenge conflicted with its stated belief that creatives should be paid. ## Figma’s Response - CEO Dylan Field acknowledged that the company had made a mistake. - Figma said it had been “swept away” by its enthusiasm for making the platform more open. - The company paused the challenge and considered alternative structures that would not require participants to work without guaranteed compensation. - In a later update dated November 19, 2018, Figma said it would not move forward with any version of the challenge at that time. Figma’s experience illustrates the importance of designing developer and creative programs around clear compensation and consent, especially when participants’ work could directly benefit a commercial product.

Read original(opens in new tab)
figma3 min readCurated summary

How one Figma engineer plays to her strengths | Figma Blog

Kathryn Salant’s interests in music, programming, and cycling all reflect her belief in experimentation, iteration, and measurable progress. Her career shows how creative disciplines can reinforce one another, leading her from trumpet performance and interactive media to software engineering at Figma. Across each field, she values collaboration, meaningful expression, and the process more than perfection. ## Figma’s “3 Things” Tradition - New employees present three experiences or interests that shaped them. - Kathryn’s three things—music, programming, and cycling—illustrate the connections between her creative and technical life. - Figma presents these stories to highlight the diverse backgrounds of its employees. ## Music and Creative Expression - Kathryn began playing trumpet in fifth grade and studied at the University of Wisconsin-Madison and the London College of Music. - She became dissatisfied with classical music’s emphasis on technical precision over inspiration and meaning. - In San Francisco, she joined the avant-garde Extra Action Marching Band in 2003. - The band performed with David Byrne and experimented with unconventional material, including Beyoncé and Black Sabbath covers. - These experiences deepened her interest in creativity beyond strict tradition. ## Programming as a Creative Tool - Kathryn first encountered programming in sixth grade on Apple IIe computers, learning Logo and creating a convincing Super Mario demo. - She continued experimenting by taking apart and sometimes breaking her mother’s work computer. - While studying music, she discovered Flash 4 and became fascinated by its combination of motion graphics, interactivity, and web technology. - Flash showed her that programming could enable artists, musicians, and designers to express ideas. - She pursued software engineering so she could help other people bring creative visions to life. - Her respect for design and emphasis on communication between engineers and designers align closely with Figma’s collaborative mission. ## Cycling and Community - Kathryn became an avid cyclist after completing the seven-day AIDS/LifeCycle ride from San Francisco to Los Angeles. - In 2006, she founded Butterlap, a weekly San Francisco bike ride centered on community and inclusiveness. - She later took part in CycloCross, a muddy, social form of bicycle racing. - Her participation in the 2008 Single Speed CycloCross World Championships was as much about encouraging others as competing. - Cycling reinforced her preference for shared experiences, perseverance, and not taking competition too seriously. Together, these three interests show Kathryn’s consistent approach: improve through iteration, stay open to unconventional ideas, and create alongside other people. Her story suggests that technical work can be strongest when it preserves the curiosity, collaboration, and expressive freedom found in the arts.

Read original(opens in new tab)
figma2 min readCurated summary

Bug Bashing Party at Figma During Quality Week | Figma Blog

Figma’s Quality Week is a company-wide pause from new feature development to focus on fixing accumulated bugs and polishing existing functionality. The initiative reflects Figma’s belief that small usability problems compound for designers who spend hours in the product. By making quality work a recurring tradition, Figma aims to deliver a smoother, more reliable professional tool while also giving employees opportunities to explore unfamiliar parts of the codebase. ## A Company-Wide Focus on Quality - Figma launched its first official Quality Week in early 2017. - Engineers and designers temporarily paused their regular projects to address: - Annoying but non-critical bugs - Broken or incomplete features - Improvements to existing workflows - The company found that focused maintenance work could be as valuable as continuously shipping new features. - Quality improvements are especially important because users spend long periods working in Figma, making small imperfections increasingly disruptive. ## Quality Week 2018 Improvements - Two engineering teams collaborated on a broad set of bugs and prioritized issues that affected Figma’s professional quality. - Notable fixes included: - **Figma Mirror:** Improved stability and reduced crashes in the mobile mirroring app. - **Sketch import:** Added drag-and-drop importing into the editor and improved text-import accuracy. - **Chromebook support:** Enabled users to hold the search key and drag to duplicate objects. - **Layer panel behavior:** Made it easier and more intuitive to nest layers into groups and frames. - Figma acknowledged that the product was not bug-free, but planned to continue focused quality efforts throughout the year. ## Benefits for the Team - Quality Week helped developers and designers work in parts of the codebase outside their usual areas. - The event encouraged collaboration across teams and made otherwise routine maintenance work enjoyable. - Figma celebrated achievements with awards, including recognition for fixing the company’s oldest known bug—an issue affecting Windows users since 2015. ## Feedback and Ongoing Support - Many bugs addressed during Quality Week were reported by Figma’s user community. - Figma encouraged users to submit feedback through: - The in-product Help menu - Twitter - The community forum - Email support - The company emphasized an all-hands support model, where users might interact with engineers or even the CEO. Figma’s approach shows that dedicated time for bug fixing and product cleanup can complement innovation rather than compete with it. Regular quality-focused periods, combined with continuous user feedback, help maintain a reliable and polished product as it evolves.

Read original(opens in new tab)
figma1 min readCurated summary

#FigmaTip Roundup 4.0 | Figma Blog

The post is a roundup of community-submitted Figma tips designed to help users work more creatively and efficiently. It highlights practical techniques for cropping, creating patterns, resizing layouts, and inspecting designs, showing how small features and shortcuts can improve everyday workflows. ## Cropping Images with Masks - Use masks to crop images into custom shapes rather than relying only on rectangular frames. - Masks provide a flexible way to control which parts of an image remain visible. ## Creating Patterns with Symbols - Reuse symbols to build repeating visual patterns. - Duplicating and arranging symbols can quickly produce decorative or structured compositions. ## Resizing Frames with Constraints - Set constraints on frame elements to control how they behave when the frame is resized. - Constraints help preserve relationships between elements across different dimensions. ## Inspecting Designs with Outline Mode - Press **Command + Y** to switch to Outline Mode. - This view makes it easier to inspect vector paths, layers, and the underlying structure of a design. The roundup encourages designers to experiment with Figma’s masks, symbols, constraints, and keyboard shortcuts to make common design tasks faster and more adaptable.

Read original(opens in new tab)
figma2 min readCurated summary

ICYMI: An Overview of Figma’s Feature Release Week | Figma Blog

Figma celebrated its first anniversary with “#6DaysofShipping,” releasing a new feature or improvement each day from Monday through Saturday. The initiative aimed to serve both advanced users and beginners, combining powerful workflow enhancements with accessible tips. The post recaps the week’s releases and highlights Figma’s fast, community-driven product development. ## A Week of Daily Releases - Figma created the release week after users praised the company’s rapid shipping pace. - The team decided to launch one feature per day for six consecutive days. - Releases ranged from advanced functionality, such as nested instance swapping, to beginner-friendly resources like a complete keyboard shortcut list. - The campaign was intended as a fun, unexpected celebration for Figma’s community and first anniversary. ## Scrubbable Inputs - Users can change property values more quickly by holding **Option**, clicking, and dragging. - Moving the cursor upward allows values to be “scrubbed” even faster. - The interaction is designed to speed up design exploration and iterative adjustments. ## Shortcuts for Rounding Corners - Rectangle corner radii can be adjusted directly by hovering, clicking, and dragging. - Users can round individual corners by holding **Alt** while clicking and dragging. - This provides more precise control over shapes without relying solely on numeric inputs. Figma’s release week demonstrated how small interaction improvements and advanced capabilities can make design work faster and more flexible. The practical recommendation is to explore both the new gestures and the broader shortcut reference to get more out of Figma’s editing workflow.

Read original(opens in new tab)
figma1 min readCurated summary

FigmaTip Roundup 2.0 | Figma Blog

FigmaTip Roundup 2.0 collects quick workflow lessons shared by Figma users and the Figma team. The tips focus on importing several images efficiently and navigating the canvas faster. Together, they show how simple keyboard shortcuts and layer-panel actions can speed up everyday design work. ## Importing and Placing Multiple Images - Press **Cmd+Shift+K** to open the image import workflow. - Select multiple image files at once. - Click on the canvas to place the images, avoiding the need to import them individually. ## Zooming Directly to an Object - Double-click the **layer icon** for an object in the Layers panel. - Figma zooms the canvas to show that object at its full dimensions. - This provides a quick way to locate and inspect objects without manually navigating or changing zoom levels. The roundup encourages designers to adopt these small shortcuts and share their own tips with the Figma community.

Read original(opens in new tab)