Figma Design Tool – Create, Test, and Ship Better Designs

By | December 3, 2020
Sponsored Links

Figma Design Tool is a vector graphics editor and prototyping tool which is primarily web-based, with additional offline features enabled by desktop applications for macOS and Windows. The Figma Mirror companion apps for Android and iOS allow viewing Figma prototypes on mobile devices.

Figma Design Tool

Figma was founded in 2012 by Dylan Field and Evan Wallace. The idea for a web-based design tool was one of many ideas Field and Wallace brainstormed in 2011 while they were students at Brown University.

The Features of Figma Design Tool

Design Features

Design for the web made easy – Figma was built for the future of web. That’s why you’ll see features you won’t find elsewhere.

Design responsively with Auto Layout – Spend more time iterating and less time moving things around.

Automate and augment your work with Plugins – Remove repetitive tasks, bring in data, and power custom workflows.

Be efficiently consistent and consistently efficient – With your design system in the cloud, all the goodies in your libraries are always one click away.

Turn developer handoff into a handshake – Bring developers into your process early and often. Let them get the specs and assets they need.

Prototyping Features

Create prototypes that feel like the real experience – Turn your static design files into an interactive experience—no coding required.

Show, don’t tell your interaction vision – Take the guesswork out of development by spelling out the interaction details you envision.

Do it all in one single tool – No more jumping between tools. Design, prototype, share, and collect feedback all in Figma.

Design Systems Features

Where all your design assets call home – Increase design consistency with a powerful design system that’s accessible to your entire company.

Where your teams share the same language – Focus creation in the right areas when your team has a shared and always-up-to-date design system.

Where design system folks find peace of mind – Figma scales with your ever-evolving design system and growing team.

Where design systems meet data – Take the guesswork out of building and maintaining your design systems with built-in analytics.

Collaboration Features

Discover the most important design work – Figma is where design work gets the visibility it needs across teams.

Jump into a file as a team. Bring people on your journey – Figma makes the design process transparent, which means everyone gets aligned fast—and stays aligned.

Invite folks into your design process – Enable others to add copy, grab specs, and give you feedback, so you ship better work.

Design better products with better feedback – Figma helps you get the right feedback, so you can make decisions and move forward, faster.

What’s new in Figma?

Keep on Flexin

Auto Layout is getting more flexible and has a fresh new look. Stretch in any direction, control padding independently, and distribute objects evenly—all in an easier to use interface.

Bridge design and code with Variants

Organize your design system with Variants so even the most complex components are structured intuitively. Combine variations of the same component and simplify your asset library.

Get the specs you need to code with the new Inspect Tab

Meet the redesigned Inspect Tab (previously called the Code panel). With new sections for Typography, Color, Borders, and more, simply click to copy the specs you need for code.

Sponsored Links

Breeze through components with the Instance Swap Menu

Fly through the new UI with keyboard shortcuts, easily spot the right instance with thumbnails, or quickly search for something specific.

Explore thousands of design systems, wireframes, illustrations, and more

The Figma Community is rolling out to all users over the next two weeks, giving you access to a world of templates, example work, reusable assets, and even board games.

Show multiple ways to interact with objects

Let users experience your designs by linking multiple interactions to a single object.

Make your transitions pop

Add dynamic animation to your prototypes with customized easing curves.

Spread your shadows

Adjust the positive or negative spread of your shadows to create depth, glows, and borders. All seamlessly output to code.

Embed any Figma file in your team’s favorite tools

Embedded design files streamline project communication, simplify handoff, and eliminate the overhead that comes with finding and maintaining the latest designs.

Seamlessly test websites and web apps

To avoid user confusion when testing websites and web apps, you can now turn off the Figma toolbar and footer in Presentation View without going full screen.

Bridge design and development with the new Zeplin integration

With the new Zeplin plugin, you can now export Figma frames, components, and styles to Zeplin for a more seamless developer hand-off.

Less time searching, more time making

Universal Search makes it easier for designers and their collaborators to find what they’re looking for in Figma.

Better navigation and added context with Links

Link to external product docs to provide your teammates with additional context.

Design and prototype seamlessly with Figma and Framer

If you love both Figma and Framer, your workflow just got more seamless.

New tricks for Selection Colors

Use the target icon to select a color’s objects and make adjustments to just those objects. Hit the Styles icon to create a new Style with a selected color, or apply an existing Style.