본문 바로가기

webdesign/design

hand off design files / Figma file

Handing off designs to software engineers (using flows and annotations)

 

 handoff tools - Figma > Zeplin > Invision > Adobe XD (2021)

 

A Comprehensive Guide to Executing The Perfect Design-to-Development Handoff 

Top 10 Design Handoff Tools for Designers and Developers 

 

 


Limitation of Figma

A problem with Figma is that you can't own your own content made with Figma unless you have an organization account (45 usd/month per editor) Adobe XD vs Figma The Ultimate Battle!

offline limitation 

Figma is cloud-based, so you'll need to be connected to the internet to access the full functionality of Figma.

Not available offline : 

  • Access or browse the Figma file browser.
  • Create new files, or open files that you don't already have open.
  • Receive updates from other collaborators on files you have open.
  • Search for components from libraries or insert instances from a library.
  • Install new plugins, or run plugins that require external browser APIs.
  • View a file's version history, or create new versions to save your changes to Figma.
  • Use any multiplayer features, like seeing who is active in the file, observation mode, and multiplayer cursors.

Disadvantages of Figma Offline:

  • While working offline in Figma, you cannot access the Figma file browser
  • You won't be able to get notifications that other collaborators have sent you
  • The offline version doesn't let you make new files and even open existing ones
  • You could not use new plugins and it's also not possible to utilize resources from libraries
  • It limits you from using multiplayer features. For example- you cannot identify if the other person is active or not. It lacks multiplayer cursors and observation modes

the outputs : .fig

This file format is specific to Figma and cannot be opened by any other tool.

You can save files in .fig format when you want to export, back up or move your Files between Figma accounts.

------------------

Files in Figma link  

Copy assets between design tools link

Move files between projects, teams and accounts link

 

a high-fidelity PDF - Our path to creating a precise PDF Exporter link

--------------------

engageinteractive.co.uk/blog/6-reasons-why-we-switched-to-figma

www.bmc.com/blogs/outcomes-vs-outputs/#:~:text=The%20outcomes%20are%20what%20the,contribute%20to%20achieving%20an%20outcome.

-------------

Assets management for Figma lovers link

A properly DAM(Digital Asset Management) system allows to save time, increase productivity and streamlines delivery.  Dematerialize its structure (that was based on Agile method, sprints and Sketch files) and adapt it to the cloud nature of Figma, keeping sort rules and nomenclature.

Naming conventions:

1. Never use empty spaces.

2. Use only lowercase text

3. Use prefix numbers only to order temporally

4. Use suffix numbers only for major versioning and declare events

5. Use letters for variation of a test or experiment

6. Never use abbreviations or acronyms

7. Do not use dates, in any format

8. Stick to a limited charset that includes: () / -. a-z 1234567890

9. Always rename incorrect files or assets

10. Catalog artboard and frames with single letters

developer handoff : 

An overview of Figma for developers  link

handoff your designs to developers and engineers

Microsoft + Figma's API Testimonial  link

designcode.io/ui-design-handbook-developer-handoff

 

Optimize design files for developer handoff - Figma