Figma

What is Figma?• In comparison it‘s like Sketch on a browser

So what‘s so special about it?

MultiDesign• Creating Live• Comments• All in one place• Simple to share

• Collaboration level: MAX

DEMO

My recommendations• Don‘t design in the same file• Figure out and agree about

the icons / fonts / color palletes

• Agree on your base resolution

• Share your work!

Vectors

• Figma is vector• But it has a pixel

preview• Vector networks• Easy and seamless

working with icons

DEMO

Constrains / Grid

DEMO

Components

DEMO

Other

Import Sketch files Figma App iOS

Component libraries:• Material• iOS (thanks Facebook)

* SF font hack - Helvetica Neue with 5% letter spacing

Workflow

Workflow

Bugs?Yes.

Problem?No. Figma saves every secondof your work

In my practice, I didn’t encounter a bug that would not let me continue my work

Hand-off• Integrated Copy element CSS for developers• Measurents like in Adobe

Price• ???• Still free• Still beta, page states that prices will be announced early 2017

*Free forever for students! (yay)

In the end…PRO‘S• Very fast• Never lose anything!• Cross platform capabilities• Collaborate like no other• Intuitive vector networks• Best thing you can have on

windows• Easy to use

CON‘S• Works only online (you

have to have internet connection)• Only an iOS app• Has bugs (like WebGL crashes and you

have to wait a few seconds until the page reloads)• Overly targeting mac users

(docs are mostly mac commands, more shortcuts for macs, no PS import)