13 design skills that programmers should know

I am a PHP programmer, not a designer. I have not been trained by a designer. I have not read any design books. Even so, during years of development, I learned how to make my website and applications look very professional.

Below is what I think people with a technical background need to pay attention to when they want to be good at design:

 

Develop your aesthetic

View the website on a daily basis and on a monthly basis

 

Spend more time

I spent the same design time as coding when developing apps and websites. Good design takes time to complete.

When I started the project, I generally had a basic idea about the overall layout. When I have an idea, I design and program at the same time. I will design those details in the browser while developing detailed functions. This may not be the most efficient, but it allows me to perform thousands of small iterations on the project at work.

 

Steal

The secret is to know how to hide information sources.-Einstein

Good artist copy, great artist steal.-Pablo Picasso

 

This is not a new suggestion, but it may be the most important of these skills. At the beginning, you didn't have the skills to create attractive designs. This means that you need to imitate well-known designers or make them deeply influenced by their works.

Below are my steps: I will search for those similar to my basic ideas, but well-designed web applications. I will find the elements that I think will be useful in my app and recreate it in my app. Do not copy HTML or CSS directly, so you cannot learn anything. Only learning about vision and implementing it with your own code. When you have experience, you can start to create your own things.

 

ForgotPhotoshop

If you don't know how to use PS like me, use your code to design it directly in the browser. I only use the PS adjustment icon and send it to the app.

 

ProficientCSS

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M02/4C/51/wKioL1Q7SQfiPGWZAAEslGcZjJo802.jpg "Title =" Excellent css.jpg "alt =" wkiol1q7sqfipgwzaaeslgczjjo802.jpg "/>

CSS proficiency is required for direct design in browsers ....

 

Front-end framework is your good friend

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M02/4C/50/wKiom1Q7SN3ipFYWAACNh-GYN7I406.jpg "Title =" Front Frame .jpg "alt =" wKiom1Q7SN3ipFYWAACNh-GYN7I406.jpg "/>

It is difficult to create a website or app from scratch, especially for new users. So now I use the front-end framework.

 

Icon unexpected importance

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M00/4C/50/wKiom1Q7SOnSyyAZAABKR8BcDs8000.jpg "Title =" icon important .jpg "alt =" wkiom1q7sonsyyazaabkr8bcds8000.jpg "/>

It took me a long time to realize how important icons are for a good design, which is not that obvious. The icon improves navigation, adds colors, and delivers emotion. Icons may not be able to design Nb, but a bunch of bad icons will definitely make your design sb.

I use icon fonts or SVG icons based on different projects. Icon fonts is very useful, especially when you design it in a browser. Icon fonts makes it easy to add an icon to an element. You only need to add a class.

Another reason why the icon fonts algorithm works well is that you can change the size of these icons just like changing the font size. The same is true for color.

 

Iteration, very important

Attempts and failures are very valuable tools. A lot of attempts seem uncomfortable. They don't work with your design. But it does not matter. When each failure occurs, roll back to the previous step and continue. I have iterated thousands of times before I confirmed duet's design.

 

Focus on availability and ease of use

A good design is not just what the app looks like. It also involves the functionality of the app, which is easy to use. Even if you don't need professional training, a little bit of common sense will benefit you from building available apps.

You only need one thing to ensure the availability of the app-to ensure that you are actually using the app you developed. It is often used. If something makes you feel uncomfortable, fix it. Believe in your self-consciousness. If a process is unclear or complex, you can intuitively feel it. Are there too many steps? Is a function hard to find? Is it because common functions are used too many times? Or do you sometimes forget where some features are? No matter where the availability problem is, as long as you keep using your app, I believe you can find it and then you will fix it.

Obviously, this process is imperfect. You cannot represent the way every other user uses it, but my experience is that most problems can be found through this method ....

 

Typographical layout is more important than you think

650) This. width = 650; "src =" http://s3.51cto.com/wyfs02/M01/4C/51/wKioL1Q7SS7icTWXAACz72y3lm8774.jpg "Title =" better than what you want. jpg "alt =" wkiol1q7ss7ictwxaacz72y3lm8774.jpg "/>

Select the correct image and Image Library

Find some high-quality free libraries online

 

Important feedback

I can't deny that I did very poorly in this regard, but I realized the importance of feedback. Most of what I did was not provided feedback before the release.

 

Last move

If you don't know how to do it-it's always good to be simple. A large amount of white space, slightly shadow, and so on. Being good at design is a long process that will take you a lot of time. It may not be the method you like, but once you master it, you will obviously improve.

 

Refuse to be a waste of firewood. I want to be a schoolmaster!CollectPHPMaterials

13 design skills that programmers should know