Introducing Figma 2.0 with New Features with Prototyping and Developer Handoff

Introducing Figma 2.0 with New Features with Prototyping and Developer Handoff

AoiroStudio
Jul 26, 2017

We would like to share exciting news from our friends over Figma where they are introducing their newly 2.0 packed with features including Prototyping and Developer Handoff. This is pretty huge! I can’t wait to give it a try myself and maybe share my thoughts on ABDZ. Meanwhile, let’s take a look at what they offer with real-time collaboration, the end of versioning and more.

In their words

But as we talked to more of our users, we realized we couldn’t ignore prototyping forever. Designers were desperate for a solution that would let them create and present in the same place, with one single source of truth. Since we’re the only interface design tool that runs on the web, we’re uniquely suited to meet that demand.

In Figma, the prototype is a living document rather than a dead artifact.

Prototyping

• You can tweak frames or add screens in real time while others watch. We’re already finding this hugely helpful in design critiques at Figma. 
• No need for endless versioning…or the crazy naming conventions that other tools require to order your artboards (good-bye artboard 1, artboard a1, artboard a1b, artboard a1bcdefgahhhhhfuckthis). 
• My new fav: You can navigate presentations from your phone. Any designers who dream of strolling the conference room like you’re giving a TED talk, this is your moment. 
• You can use components (symbols) with hot spots, so when you set a navigation from a component once, it will populate through all instances, as seen in the gif below (the component is the top left X button)

Prototyping (Video)

Introducing Figma 2.0 with New Features with Prototyping and Developer HandoffIntroducing Figma 2.0 with New Features with Prototyping and Developer HandoffIntroducing Figma 2.0 with New Features with Prototyping and Developer Handoff

 

Developer Handoff

• Developers can select an object and hover over another object to see redlines that measure the spacing between them 
• They can pull CSS, iOS and Android data with view-only access 
• We’ve segmented the data as: 
(1) Table view, which breaks out attributes so they’re easier to skim 
(2) Generated markup/code

Developer Handoff (Video)

We’re excited to offer an all in one tool to help teams work better together. That said, we know that designers and tech companies have a wide variety of workflows and requirements.

Get Started now with Figma.


Source: Abduzeedo