How to improve the quality of their work
Often I have to work with the layouts of different designers and just as often their quality leaves much to be desired.
Although I am a pedantic person, it did not always help me. For example, I could do something neatly, scrupulously, but incorrectly, simply because of a lack of experience. Now I constantly observe the same problems of designers and, to help, gathered a few practical tips. Here are some of them:
')
This greatly facilitates the work, both with small and with large and complex projects. It is no longer necessary to create multiple psd files or use groups inside to show different interface states.
The quality of the screens is growing along with the graphics requirements. Working on a larger scale you will always have a small margin. It is not very convenient to change the outline-icon in the size of 16x16px or to write notes 11-12 with the font and see this dud.
By default, a new layer is created above the rest. Do not be lazy, move them according to where the object is located or start from the end. We read / look from left to right, top to bottom. It’s good when you don’t have to search for the top icon somewhere below or, which is worse, in the middle of the layers.
There are two extremes. Either all groups are decorated or all gray. But, if you use it where appropriate, it can be a handy tool. For example, if you have many similar layers (icon + text) or graphs, charts, tables ...
Usually, the mesh is shaped by guides. In the process of work, they can be lost, added, removed and, never, it is not clear why this or that object is aligned as such or which of the guides is basic and which is not. Bringing the grid to a separate layer will be easier to check.
Often, layouts can contain hundreds of layers and finding the ones you need is not always easy. And even more difficult when the styles of the layers are revealed. Usually they do not carry much information.
This also applies to the last item, but may be aggravated by the fact that you turn them on / off, hoping to see something useful, and not rubbish. Why do these nerves.
Here, of course, everything is individual, but the basic rule is this: sign the layer according to its content. At the same time, train yourself to use English, in case you grow and work with international projects.
Try to use as little as possible raster graphics, icons, and especially icon fonts. For a long time there are no problems with the use of SVG format. It scales easily, has flexible settings and good support.
Whether you insert an icon, a picture or something else, do it through "Put connected." Practice shows that it is more convenient to change one file than to make changes in many places. For example, such parts as a basement or hat are more often static and it is more convenient to put them into separate files and place them through import.
How often I observe pictures in the form of circles, pentagons, stars, which are not made in the most practical way. Most of the images cut out the desired part in the desired form and paste. But when it comes to editing, it becomes sad. For such tasks it is good to use masks. They show the desired part and at the same time the picture remains intact. It can be scaled, cropped or replaced without unnecessary action.
They are like groups, but they can keep styles. For example, if you have several identical buttons on a page, then it is more convenient to use smart objects. Editing one applies to everything in the file limit. It is also convenient to use if you want to reduce the countless number of layers.
It happens that the designers do not understand what size the button provides, if the design does not use backgrounds or edging. Add a security field in the form of an empty block under it or add a prefix to the name.
It is very inconvenient to copy the text from the layout, if it was inserted not as a block and the transfers are put in manual. You have to delete them. In addition, this method helps to see how it will look when the layout of the layout.
Upon completion, do not forget to attach fonts, original images, infographics, descriptions ... Usually, a lot of time is spent on search / query. For example, I often have this structure:
svg - all icons;
materials - pictures, infographics, fonts;
from client - what originally came from the client;
includes - related parts of the template
Each of these techniques is good, but together they help you and others more efficiently work with layouts and save time.
Although I am a pedantic person, it did not always help me. For example, I could do something neatly, scrupulously, but incorrectly, simply because of a lack of experience. Now I constantly observe the same problems of designers and, to help, gathered a few practical tips. Here are some of them:
')
Use mounting areas
This greatly facilitates the work, both with small and with large and complex projects. It is no longer necessary to create multiple psd files or use groups inside to show different interface states.
Work at a scale of 2: 1
The quality of the screens is growing along with the graphics requirements. Working on a larger scale you will always have a small margin. It is not very convenient to change the outline-icon in the size of 16x16px or to write notes 11-12 with the font and see this dud.
Observe the correct order of the layers.
By default, a new layer is created above the rest. Do not be lazy, move them according to where the object is located or start from the end. We read / look from left to right, top to bottom. It’s good when you don’t have to search for the top icon somewhere below or, which is worse, in the middle of the layers.
Use color selection layers
There are two extremes. Either all groups are decorated or all gray. But, if you use it where appropriate, it can be a handy tool. For example, if you have many similar layers (icon + text) or graphs, charts, tables ...
Take out the mesh in a separate layer
Usually, the mesh is shaped by guides. In the process of work, they can be lost, added, removed and, never, it is not clear why this or that object is aligned as such or which of the guides is basic and which is not. Bringing the grid to a separate layer will be easier to check.
Collapse the properties of layers and groups
Often, layouts can contain hundreds of layers and finding the ones you need is not always easy. And even more difficult when the styles of the layers are revealed. Usually they do not carry much information.
Do not leave empty layers or groups.
This also applies to the last item, but may be aggravated by the fact that you turn them on / off, hoping to see something useful, and not rubbish. Why do these nerves.
Let's say the names of the layers
Here, of course, everything is individual, but the basic rule is this: sign the layer according to its content. At the same time, train yourself to use English, in case you grow and work with international projects.
Work with SVG
Try to use as little as possible raster graphics, icons, and especially icon fonts. For a long time there are no problems with the use of SVG format. It scales easily, has flexible settings and good support.
Place related objects
Whether you insert an icon, a picture or something else, do it through "Put connected." Practice shows that it is more convenient to change one file than to make changes in many places. For example, such parts as a basement or hat are more often static and it is more convenient to put them into separate files and place them through import.
Apply clipping masks
How often I observe pictures in the form of circles, pentagons, stars, which are not made in the most practical way. Most of the images cut out the desired part in the desired form and paste. But when it comes to editing, it becomes sad. For such tasks it is good to use masks. They show the desired part and at the same time the picture remains intact. It can be scaled, cropped or replaced without unnecessary action.
Use smart objects
They are like groups, but they can keep styles. For example, if you have several identical buttons on a page, then it is more convenient to use smart objects. Editing one applies to everything in the file limit. It is also convenient to use if you want to reduce the countless number of layers.
Add security fields
It happens that the designers do not understand what size the button provides, if the design does not use backgrounds or edging. Add a security field in the form of an empty block under it or add a prefix to the name.
Use text blocks
It is very inconvenient to copy the text from the layout, if it was inserted not as a block and the transfers are put in manual. You have to delete them. In addition, this method helps to see how it will look when the layout of the layout.
Do not forget about related materials.
Upon completion, do not forget to attach fonts, original images, infographics, descriptions ... Usually, a lot of time is spent on search / query. For example, I often have this structure:
svg - all icons;
materials - pictures, infographics, fonts;
from client - what originally came from the client;
includes - related parts of the template
Each of these techniques is good, but together they help you and others more efficiently work with layouts and save time.
Source: https://habr.com/ru/post/354466/
All Articles