Hey there, Dmitriy is here,

I'm starting a new series of posts with advanced Figma tips to help you improve your day-to-day workflow and ultimately get better at designing with Figma.

So let's get started, here are 5 Tips to implement into your design toolkit! ⚡

1. Plan your style names strategically.

Make your file more accessible for yourself with sensibly named layer names. Avoid unitary capitalization and use understandable abbreviations for lengthy style tags (e.g., 'BG' instead of background and 'CTA' iso primary).

2. Use outline mode to check components' structure.

Check the structure of your components with a quick shortcut ⌘+Y on Mac and Control+Y on Windows.

3. Export compressed WebP images right from Figma.

Use the Olive Press plugin to export assets in WebP or SVG format for better site ranking and performance.

4. Use components description to make your library more useful.

Add text tags explaining how components work. This information will be indexed, helping users find them through your library. You can also add a link to external documentation via the link here.

5. Stay organized with in-file To-Do widgets.

My theory is that dopamine pumps when checking items off from a list.

And dopamine naturally strives to boost my productivity during a work session, allowing me to design more engaged and, as a result, faster.

The best designers know it's never too late to learn something new. ✨

If you're wondering where to start or how to improve your workflow, check out our 2022 Handbook and UI kit for Figma — Frames X. With over 5K UI elements to build your project smarter and faster.

Learn More

1 comment

✶ Framer UI Kit Update ✶ New Blog Template and Components

Frames X v3.0: React Components and Design Tokens 🚀

Frames X v2.9: Leveling-up Figma UI Kit ⇪

Frames X v2.9: Leveling-up Figma UI Kit ⇪

Make stunning designs with our new Figma UI kit 🔥

See all posts from Dmitriy Bunin