You might say good design is subtle and different for everybody. While it is true that people have different preferences regarding favourite colours, pictures and fonts, it is also true that general human perception works similarly for most people.
After all, there is a reason why many people like the design of big brands like Apple and Google. Those companies have a lot of staff which is solely working for the purpose to make products look good so that the customer likes working with them. Of course, not every company has the money to hire a usability expert whose only job is to give customers a good feeling about the products. Luckily, lots of research has already been put in this field and most of the results can be found online for free. Something you will most likely encounter when looking for good design on the internet is the five laws of good design. Sometimes there might be seven, but those five here are the most important for web design:
Law of Conciseness
If there are many objects, we will always notice the one that differs the most from the others. For example, in a group of squares of different sizes and colours, a triangle will always stand out.
You can use this law to draw attention to the main Call to Action button on your website. This can be achieved by giving it a different colour or a different shape. But only make one element stand out, otherwise you risk confusing the visitors. Because then they might not know what you want them to do or what your main selling point is.
Law of Similarity
The human brain will always try to sort a large amount of elements into specific sets by their general appearance. Similar objects appear as a group. In this example, we see five columns and not four rows. This is due to the fact that for our brain one column is one group because the shape is the same.
This can be effectively used for grouping elements on a website. Give similar elements the same outline, background or font and the visitors immediately recognize that they belong together.
Law of Proximity
The outcome of this law is the same, but the reasoning behind it is different. Once again, we see columns instead of rows. But this time because the circles are closer together vertically than horizontally. This might seem obvious to you and this is true, but it is actually one of the most important design laws. It also tells you a fact about those laws. Designers who haven’t heard of those laws yet, might instinctively do the right things because it looks good. But it is important to understand that there is actually science and research behind it. And that should only encourage you more to fulfil these laws because they apply to pretty much everybody.
But the law of proximity also has another meaning that is less obvious and I have seen it violated lots of times: Elements that belong to the same issue should be placed closely together on the screen. This applies to contact forms for example. If there is a validation problem, the warning that tells the user to revise a certain field should be placed close to the submit button or the field where the error occurred. But never on top of the contact form. The user’s eyes rest on the submit button when he clicks it, so a change in that area will be immediately noticed. But it might take the user a while figure out what’s wrong when he has to look for the error message first.
Law of closed Shapes
Outlining elements that belong together or giving it a different background colour will help the user to identify what belongs together. Once again this is often done right intuitively. Google is using this principle in their Android Style Guide. A lot of apps that come in the material design (which is the latest guideline for Android apps) feature cards. Those are meant to resemble small sheets of paper with information on it. Every card has one topic. This helps structuring the information and makes it easier to read.
Law of Experience
While experience isn’t something you would associate with design in the first place, it is so important that we would struggle using websites and apps without it. The so called hamburger menu (three horizontal bars) indicates the main navigation menu and is used overwhelmingly often now. This only works because we have learned that it resembles a menu. Icons work in the same way. We know that a bin resembles delete. Therefore, it is important to keep to standards and not go too crazy when designing custom icons. The general form should always be similar to the well-known icons, otherwise they won’t work for you.
Always keep in mind that computers are something abstract that work differently from how we would handle tasks. It is important that we bring in elements of human life to give people a better understanding of what the computer is doing. In the end, that’s why Word displays text on sheets of paper and not just letters somewhere on the screen. Because we are used to it.
