Idea is all

𝗕𝗼𝗻𝘂𝘀 𝗧𝗶𝗽: 𝗙𝗶𝗴𝗺𝗮 𝗣𝗹𝘂𝗴𝗶𝗻𝘀⁣
⁣
Figma introduced its new plugins feature which will allow people to build custom plugins tailored for their own workflows.⁣
⁣
I think plugins will add a lot of value to the entire Figma ecosystem and will enhance our design workflows.⁣
⁣
Have a try yourself and maybe you could even build your own plugin to suit your needs! ⁣Some of the best plugins I have tried so far. See on the next screen!⁣ 𝗜 𝗹𝗼𝘃𝗲 𝘁𝗼 𝘂𝘀𝗲 𝗿𝗲𝗴𝘂𝗹𝗮𝗿𝗹𝘆:
- Unsplash - Flow kit - Vectary 3D - Content Real - Chart

Whats your favourite plugin/s?. Please write in the comments below or just share a plugin that you think is worth trying. ⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣

𝗩𝗶𝗲𝘄 𝗦𝗲𝘁𝘁𝗶𝗻𝗴𝘀⁣
⁣
It took me a bit of time to find those settings but they are quite handy when you know where they are located.⁣
⁣
You can configure how you see your workplace in the “Settings” dropdown menu in the top right corner of the window. ⁣
⁣
Allowing you to show Rulers, the Grid, enable/disable “Snap to Pixel Grid” (which sometimes is a bit annoying), but also hide the other players’ (designers) cursors when you want a bit of focus and don’t want to be distracted by others.⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣

𝗙𝗶𝗴𝗺𝗮, 𝗧𝗶𝗱𝘆 𝗨𝗽!⁣⁣
⁣⁣
Figma’s Tidy Up feature is really when you want to quickly rearrange elements in a grid or just to make everything aligned. ⁣⁣
⁣⁣
Together with the features which I mentioned in Tip 4 and Tip 14 — it’s super powerful! ⁣⁣
⁣⁣
Also, another way to tidy up is by hovering over the bottom-right corner of a selection and clicking the blue icon.⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣
⁣⁣⁣⁣

𝗨𝘀𝗲 𝗚𝗜𝗙𝘀 𝗜𝗻 𝗣𝗿𝗼𝘁𝗼𝘁𝘆𝗽𝗲𝘀⁣
⁣
Figma just added the ability to add GIF files to your prototypes, thus adding the possibility to add user interaction animations within your prototypes.⁣
⁣
Whether you’re prototyping a mobile app, designing a product user flow, or putting together a presentation, GIFs are a simple way to make your designs more dynamic—and perhaps bring smiles to a few faces. ⁣
⁣
GIFs can stand in for motion designs, video elements, and subtle animations that can otherwise be hard to represent faithfully in prototypes.⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣

𝗨𝗜 𝗞𝗶𝘁 𝗟𝗶𝗯𝗿𝗮𝗿𝗶𝗲𝘀 𝗧𝗼 𝗞𝗶𝗰𝗸-𝗦𝘁𝗮𝗿𝘁 𝗬𝗼𝘂𝗿 𝗣𝗿𝗼𝗷𝗲𝗰𝘁𝘀⁣⁣
⁣⁣
I often use the UI kit libraries to kick-start my projects.⁣⁣
⁣⁣
For example, I use the Brainstorming UI Kit Style whenever I need to design some apps. If you want to give it a try, please see the link in the 𝗽𝗿𝗼𝗳𝗶𝗹𝗲. ⁣
⁣
I just need to activate the library, and I’m ready to go! I also often use Figma iOS Ui kit 2.0 or iOS/iPad OS 13 Design UI Kit. (There’s a ton of free assets available — check them out and pick the ones you need.)⁣⁣
⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣
⁣

𝗥𝗲𝘀𝘁𝗼𝗿𝗲 𝗔𝗻 𝗘𝗮𝗿𝗹𝗶𝗲𝗿 𝗩𝗲𝗿𝘀𝗶𝗼𝗻 𝗢𝗳 𝗔 𝗗𝗲𝘀𝗶𝗴𝗻 𝗙𝗶𝗹𝗲 𝗢𝗿 𝗦𝗵𝗮𝗿𝗲 𝗧𝗵𝗲 𝗟𝗶𝗻𝗸 𝗧𝗼 𝗔𝗻 𝗘𝗮𝗿𝗹𝗶𝗲𝗿 𝗩𝗲𝗿𝘀𝗶𝗼𝗻⁣⁣⁣
⁣⁣⁣
I love the feature to be able to go back to a previous version of the file I am currently working on.⁣⁣⁣
⁣⁣⁣
No matter the reason (you made a mistake, or a client asks you to switch to an earlier version, etc.), it is really handy to be able to go back in time to a previous version. And not only that but Figma also lets you copy the link to the previous version so you don’t have to delete the most recent version of the file. Smart!⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣
⁣⁣⁣

𝗖𝗼𝗺𝗽𝗼𝗻𝗲𝗻𝘁 𝗞𝗲𝘆𝘄𝗼𝗿𝗱𝘀 𝗙𝗼𝗿 𝗘𝗮𝘀𝘆 𝗦𝗲𝗮𝗿𝗰𝗵⁣⁣
⁣⁣
When you’re starting to have lots of components, it becomes difficult sometimes to find a specific component in your library. That’s when the component keywords come in handy. ⁣⁣
⁣⁣
You can add keywords to any component so even though the component’s name is different, you’ll have the keywords which will allow you to find it more easily. You’ll find an example on the next screen!⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗡𝗼𝘁𝗲: If you’re relatively new to , the following Figma help page (help.figma.com) will shed some light on layers, frames, objects, groups of objects, and more.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝘄𝗲 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗜𝘁'𝘀 𝗳𝗿𝗲𝗲 𝗳𝗼𝗿 𝗱𝗼𝘄𝗻𝗹𝗼𝗮𝗱 - https://bit.ly/2QaSPoY⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
More details about the project on:⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
https://www.instagram.com/p/B7vQb-yqImM/
⁣
⁣
⁣

𝐂𝐡𝐚𝐧𝐠𝐞 𝐒𝐩𝐚𝐜𝐢𝐧𝐠 𝐎𝐧 𝐓𝐡𝐞 𝐆𝐨⁣⁣
⁣⁣
A Figma’s feature that allows you to change the spacing for a group of elements. It makes it super easy to layout a group of elements around your screen. ⁣⁣
⁣⁣
I use this feature for multiple elements but also for single elements as well.⁣⁣
⁣⁣

𝗖𝗿𝗲𝗮𝘁𝗲 𝗚𝗿𝗮𝗽𝗵𝘀/𝗔𝗿𝗰 𝗜𝗻 𝗦𝗲𝗰𝗼𝗻𝗱𝘀⁣
⁣
With Figma, you can create graphs/arc in literally seconds! No more cutting paths on a circle to create a custom graph. ⁣
⁣
Here’s how you create a loading arc — and all those values can be precisely controlled from the Properties panel on the right.⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
Go and download the app on figma.com⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗡𝗼𝘁𝗲: If you’re relatively new to , the following Figma help page (help.figma.com) will shed some light on layers, frames, objects, groups of objects, and more.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝘄𝗲 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗜𝘁'𝘀 𝗳𝗿𝗲𝗲 𝗳𝗼𝗿 𝗱𝗼𝘄𝗻𝗹𝗼𝗮𝗱 - https://bit.ly/2QaSPoY⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
More details about the project on:⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
https://www.instagram.com/p/B7lEkVhqn3K/
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣

𝗥𝗲𝘀𝗶𝘇𝗲 𝗔 𝗙𝗿𝗮𝗺𝗲 𝗪𝗶𝘁𝗵𝗼𝘂𝘁 𝗥𝗲𝘀𝗶𝘇𝗶𝗻𝗴 𝗧𝗵𝗲 𝗟𝗮𝘆𝗲𝗿𝘀 𝗜𝗻𝘀𝗶𝗱𝗲 𝗜𝘁⁣
⁣
When designing for different screen resolutions, you want to be able to resize the screen frame without having to resize all the elements inside the frame. ⁣
⁣
In order to do that, hold 𝗖𝘁𝗿𝗹/𝗖𝗺𝗱 while you perform the resize operation. Magic!⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
Go and download the app on figma.com⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗡𝗼𝘁𝗲: If you’re relatively new to , the following Figma help page (help.figma.com) will shed some light on layers, frames, objects, groups of objects, and more.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝘄𝗲 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗜𝘁'𝘀 𝗳𝗿𝗲𝗲 𝗳𝗼𝗿 𝗱𝗼𝘄𝗻𝗹𝗼𝗮𝗱 - https://bit.ly/2QaSPoY⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
More details about the project on:⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣https://www.instagram.com/p/B7iLKbaKOHV/
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣

𝗨𝘀𝗲 𝗧𝗵𝗲 𝗦𝗰𝗮𝗹𝗲 𝗧𝗼𝗼𝗹 𝗧𝗼 𝗥𝗲𝘀𝗶𝘇𝗲 𝗢𝗯𝗷𝗲𝗰𝘁𝘀 𝗔𝗻𝗱 𝗧𝗵𝗲𝗶𝗿 𝗣𝗿𝗼𝗽𝗲𝗿𝘁𝗶𝗲𝘀⁣
⁣
I found it useful to be able to scale an element and its properties (stroke, effects applied to the object, etc.) all at the same time with the Scale tool (𝗞). ⁣
⁣
I found Figma a bit easier than Sketch in this regard, as you don’t have to select the size of the object. When you scale the object, both the object’s dimensions and its properties will resize proportionally. And by holding 𝗦𝗵𝗶𝗳𝘁, you’ll also keep the ratio while expanding or downsizing the object.⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝘄𝗲 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣ 𝗜𝘁'𝘀 𝗳𝗿𝗲𝗲 𝗳𝗼𝗿 𝗱𝗼𝘄𝗻𝗹𝗼𝗮𝗱 - https://lnkd.in/gXnRUNV
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
More details about the project on:⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
https://lnkd.in/gq4hsmg

𝗦𝗲𝗮𝗿𝗰𝗵 𝗙𝗼𝗿 𝗘𝗹𝗲𝗺𝗲𝗻𝘁𝘀 𝗪𝗶𝘁𝗵 𝗧𝗵𝗲 𝗦𝗮𝗺𝗲 𝗣𝗿𝗼𝗽𝗲𝗿𝘁𝗶𝗲𝘀, 𝗜𝗻𝘀𝘁𝗮𝗻𝗰𝗲, 𝗦𝘁𝘆𝗹𝗲, 𝗔𝗻𝗱 𝗦𝗼 𝗢𝗻⁣
⁣
Menu > Edit > ...⁣
⁣
When you have a complex design file, or you just want to tidy up your design system, it’s quite handy to be able to search for elements with the same property (a specific color, for example), and then change the color to a Color Style. ⁣
⁣
Super-useful after you’re settled with the design system and need to better organize all the components!⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
Go and download the app on figma.com⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗡𝗼𝘁𝗲: If you’re relatively new to , the following Figma help page (help.figma.com) will shed some light on layers, frames, objects, groups of objects, and more.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗧𝗼 𝗺𝗮𝗸𝗲 𝘁𝗵𝗶𝘀 𝘀𝗲𝗿𝗶𝗲𝘀 𝗼𝗳 𝘁𝘂𝘁𝗼𝗿𝗶𝗮𝗹𝘀 𝘄𝗲 𝗵𝗮𝘃𝗲 𝘂𝘀𝗲𝗱 𝗕𝗿𝗮𝗶𝗻𝘀𝘁𝗼𝗿𝗺𝗶𝗻𝗴 𝗨𝗜 𝗦𝘁𝘆𝗹𝗲 𝗞𝗶𝘁.⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
𝗜𝘁'𝘀 𝗳𝗿𝗲𝗲 𝗳𝗼𝗿 𝗱𝗼𝘄𝗻𝗹𝗼𝗮𝗱 - https://lnkd.in/geV_t9Z
⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
More details about the project on:⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣
https://lnkd.in/g3Tstm6