If you clicked on this article, at first glance you know what is Figma and want to learn how to use it better. For others, Figma is a platform for collaborative design allowing you to give life to your ideas in the form of a design for your website, a model, a wireframe... By using Figma, I assume that you hope for a successful web design! That's the whole point of this article 😃
I invite you to discover together some concrete actions to better use the Figma tool and Succeed in your web design !
Figma is used mainly for user interface design (UI) anduser experiences (UX) for a website or an application. It is an online tool. It offers a variety of features for the designing, the collaboration And the presentation, such as live drawing tools, predefined templates, real-time comments... Everything is available to make creating web design and collaborating with teams easy.
.gif)
You can use Figma to its full potential! A key word: organization 👇
There are a few rules to optimize your work on Figma. In the end, you will save time 😎
.gif)
I recommend organizing your file using Figma's prioritization features. You can structure by changing the names of Layers en bloc or in Renaming individually for better management. This will allow you to easily find your items as your project grows.
For quick integration into your projects, save your images the most frequent ones as styles will save you valuable time 😊 This will make it easier to use images repeatedly in your designs, and if you use them as a fill, they will automatically be scaled in your projects.
You can organize your pages with recognizable names for better navigation and handling of your elements. Promise, it may be a bit tedious at first, but in the long run, it will save you time when looking for key designs or components. By prioritizing and naming your pages correctly, you will improve your speed and productivity.
I invite you to gather the Variants of a component to simplify and standardize your component design system. By using the “combine variants” function, you can group the different variants into a single component, which will allow you to better organize your workspace for the design of your graphical interfaces (organization is the key word remember 😉).
It is well known that in order to learn and use tools more quickly, learn and use shortcuts will be of great help 😁
Here are a few of them:
To copy the link from your Figma: cmd+ L
To copy in PNG: cmd + shift+ c
To switch between Design/Prototype mode: Shift + E
To group styles: cmd + G
To do any search: cmd + P
You may not like this word very much but on Figma, it may be useful to you! Use the stresses on Figma will allow you to maintain the appearance of your design on various screens, computers, tablets, and smartphones. In fact, constraints tell Figma how the elements should fit when you change the dimensions for the desktop or a mobile site. The objective? Offer a pleasant and consistent experience across platforms 🎉
We'll meet up on Figma ? I sincerely hope that these tips will allow you to create a work of art! 👨🎨
I heard somewhere that before any creative work, you should take inspiration from existing resources... So here I am with the top 10 of our favorite web designs in 2023!
.jpeg)