In this article, we share 5 design tips for developers that will be very useful when facing an application design. During my professional experience, I have seen developers explore the highly complex realm of UI/UX design.

The reasons are many and diverse: the client has not wanted to hire a designer, the company has had to cut back on design to be able to sell the project, the number of developers is much higher and there is only one designer available, etc...

Whatever the case may be, many times a group of developers find themselves in the position of having to design the navigation flow and the elements of an application or web themselves, so, if you are a programmer and you are in this situation, we present you five design tips for developers to help you have a good foundation to start from.

Tips for making good use of spacing

There is nothing that makes an application or website more aesthetically pleasing and easier to read than the good use of spacing.

Spacing works by creating free sections of content that the user interacts with in such a way that visual separations are created in their head that we as designers have control over. For example, we can guide the user to be able to differentiate between various sections of the same page or element.

Use spacing wisely. Not only it makes your interface look attractive, but it also offers greater readability, better navigation, more meaningful content ordering, and helps you highlight the most interesting sections. Remember, it is better to have a lot of spacing than to be too short.

Tips for using colors well
Colors are one of the most important resources in a website or application. They transmit emotions, identify a service or company, help us draw the user's attention... Although you also have to be careful, the misuse of colors can lead to confusion.

The choice of colors is almost always linked to the client's company for which a project is being developed. Many times, they are given to us by style guides and there is no room to play with those colors, but there is almost always room to work it in the best possible way.

The best advice I could give here is to learn how to use colors and how they interact with each other. Colors can help us to rank content, to give volume, or to highlight information or sections.

There is a very useful free tool, Adobe Color, that allows us to enter a main color and we can choose different combinations of it, such as different shades, complementary and compound colors. Also, we can save a combination that we like or search for “themes” that other people have created to inspire us.

Tricks to help developers select fonts
Typography is perhaps, along with colors, the element with which the user first comes into contact and, therefore, they must be selected very carefully.

There are two types of fonts, serif (with serif) and sans serif (without serif). The serif are the small serifs and decorations that some typefaces have, such as Times New Roman. It could be said that serif typefaces tend to look more classic, old or formal, while sans serifs are more modern and closer.

Today a large number of applications and websites use sans serif fonts, to give that more modern and closer look to the user, although it may be the case of the intentional use of serif fonts to convey something deeper and more sophisticated.
Normally a pair or "pairing" of fonts is used, one for titles and headings (h1, h2...), and a different one for paragraph texts and other text areas.

Here we can find another free tool that can help us in this task, Google Fonts. Upon entering we find a huge list of font families totally free and ready to use.

We can search and filter by type, we can do tests with the text we want to see how it would be written. It directly gives us the necessary links to use the fonts in html and css, it lets us download them to install them on our computer, and it has an option very interesting in that when we choose one, it offers us popular “pairings” with other fonts.

Tips for using icons well
Icons could practically be considered an extension of fonts. Having a good family of icons in our project helps create visual cohesion and gives us elements to support important information. The important thing here is to understand that, since icons are expected to visually support certain information, they should not become the protagonists. You have to be careful that the size is not too big so that they do not overshadow the information itself.