And remove settings from the designs that your collaborators don’t need. Doing this saves them time and helps you make sure your partners get the right files in the right format and at the right scale.įirst, set the export settings for the individual designs you want to share. To share Figma images with partners who need to use them for development or marketing, define your export settings before handoff. Prepare exports in advance to avoid confusion Here again, clear, descriptive names will help them know which styles to use where. They can use these to set overall design variables for colors, grids, effects, and so on. You can make their work even easier by setting up shared styles for your project.
Figma code#
By clicking on a layer, they’ll be able to see its data in easy-to-copy code and table formats. When you hand off your Figma files to developers, they’ll go right to the code panel to pull your design’s visual specifications so they can begin building it.
![figma figma](https://static1.makeuseofimages.com/wordpress/wp-content/uploads/2021/04/Figma-top-ten-features-feature-image-self-created-1.jpeg)
Make work easier for developers with the code panel and shared styles The best way to make sure your partners get to the right place is to send them a link to the specific frame you want them to see. Use links to frames to send collaborators right where they need to go Better yet, make them a copy of the design you want them to work on, label it, and link them right to it.Ĥ. If you do, be clear what you’d like them to work on, and where.
Figma how to#
It’ll tell them how to attach each comment to a specific object and how to tag you or other teammates for notification.įor more in-depth co-creation, you may want to give your collaborators “can edit” access to your file. If they’re true first-timers, send them the link to the Figma help page on comments. This makes it clear what interaction you expect from them, and it saves them from making accidental changes to your work. If they only need to respond to the design, choose “can view” access. To prepare collaborators to give feedback, first set the right level of permissions. Use a large type size - people will likely be zooming out to try to get a sense of what’s where on the page when they first arrive.Īs designers, we want the whole team involved early in the process so that we can get the most out of the designs and have them ready faster. Give each collection a clear, consistent label that’s easy to spot. You can help collaborators find their way to the right place by collecting them in groups. Frames have a way of multiplying and it can be hard for a newcomer to know which ones to focus on. On your pages you’ve got all the frames that make up the parts of your design. When you invite someone to Figma for the first time, let them know that they can use the page list on the left to move around. If you use several emojis with different meanings, like a pencil for explorations, or a filing cabinet for archives, use them consistently. It’s helpful to add named dividers between groups.Īn emoji like a green checkbox can show partners at a glance what’s ready for attention or implementation. In the screenshot above, the pages are grouped into sets.
![figma figma](https://lokalise.com/blog/wp-content/uploads/2020/06/Webinar_illustration_designers4.png)
If your project has pages from multiple design stages, add dividers to split up files. If you’re not sure your collaborators will recognize that number, it’s a good idea to add a short description of the project as well. Try using the same naming convention across Figma and Jira, Trello, or whatever products you use to organize your tasks.įor example, if you’re all working off of the same ticket in Jira, then you could use the ticket’s tracking number, like JIRA-123. A lot of teams use tools like Jira and Trello to organize tasks and stay connected. Think about your partners and what will make sense to them. It helps to use a consistent style for your page names in Figma. Use names that make it clear which design is current, which ones were explorations, and such. To make it easier for someone new to get oriented, start by cleaning up your file name and page list. On top of that, different designers use different methods to say which parts of the files are ready for implementation and which are still in progress.
![figma figma](https://1.bp.blogspot.com/-Og9ckMqlH8g/XpwBTclSMUI/AAAAAAAAA-w/VC3IHKImKncOiLM3SHcaziD3RiyAkL10gCLcBGAsYHQ/s1600/How%2Bto%2BGet%2BFigma%2BProfessional%2BPlans%2Bfor%2BFree%2B-%2BFigma%2BEducation%2Bonly%2Bfor%2BStudents%2B%26%2BEducators.png)
Finding your way around them can be overwhelming. Most design files hold dozens of frames, iterations, and notes. Here are five ways to welcome other functions into your Figma designs and make collaboration easier and better for everyone. That can make working together more complicated than it needs to be. They can easily get lost in a maze of files and frames, with no sense of how or where to comment or extract code. While Figma has become a natural habitat for our UX team, it’s still unfamiliar territory to many nondesigners. But when we’re not all using the same tools, that collaboration can get a little rocky. Their feedback on our designs is essential to making products that work for everyone.
Figma software#
UX designers know that we’d be lost without the help of product managers, software engineers, and other partners.