What are the design principles?

You most likely acquired design ideas in art class in elementary school.

When you look at a painting, sculpture, leaflet, or email, you are likely to have an emotional reaction. You can tell whether you like it or not just by looking at it. Those who aren't trained in design, on the other hand, may not be able to explain why. We can make sense of visual compositions using visual design concepts. The following are some design fundamentals:

Space: or the area between items, is commonly referred to as "space" in web design.
Hierachy: The prominence of some aspects in relation to others is referred to as hierarchy.
Contrast: How many parts might work together to make a more coherent composition.
Scale/Proportion: The size of elements in respect to one another.
‍

Web designers use design concepts that are based on these key ideas, which were developed alongside visual art.

Reification principle

The reification principle claims that your brain identifies objects by filling in gaps in visual information. You don't have to see the whole object to figure out what it is — if a design only has a nose, one eye, and the shape of a jaw, you can figure out that it's a face.

You can recognize a stop sign even when it's chopped in half because of the idea of reification and how it plays out in your head.

‍

What does the term "reification" signify in terms of design?

The term "reification" refers to the fact that viewers do not need to see the entire thing in order to recognize it. This technique can be used to reduce space in a layout, to suggest the content of the following slide in a carousel, or to make your "coming soon" page more obvious and appealing.

The aesthetic appeal of basic logo designs is due to reification. Humans are constantly striving to bring order and meaning to meaningless chaos, and our eyes do it through reification, which is the process of filling in missing data to make sense of what we see.

Let's have a look at an example of reification in action on a website. The “before” image is on the left; look to the right to see changes that take advantage of the reification principle to create a more memorable (and less cluttered) layout.

‍

Multistability principle

We'll keep this brief because reading about the idea of multistability may make you feel like you're stuck in a dorm room with a freshman philosophy major. Multistability explains why, in that famous optical illusion, you can see just the faces or just the vases, but never both at the same time.

‍

What does the term "multiistability" mean in terms of design?

If your Spider-Senses are tingling, that's a good thing, because multistability inevitably leads to confusion, making it difficult to execute properly in web design. Not anarchy, but harmony and harmony!

However, as dozens of notable logos have demonstrated through time, multistability may be used to create distinctive and pleasantly surprising designs, such as the FedEx logo. It's difficult to unsee that arrow (between the E and the X), as well as the additional arrows that reification offers.

‍

The principle of invariance

According to the concept of invariance, your brain is adept at identifying similarities and differences. That's why it's so simple to make something stand out among a sea of similar items.

Remember the red-dressed lady from The Matrix? What about Schindler's List's little child in the red jacket? Because their brilliant color virtually shouts out of the homogeneous black-and-white backdrop we see them moving against, those two stand out so much – and remain so memorable. It establishes them as important and deserving of your attention.

‍

What does design invariance imply?

The invariance concept is a useful tool in the field of design. To grab the eye and encourage clicks, add a unique element to an otherwise homogeneous group of elements.

The pricing pages of products are ideal for reification. By changing the color or size of one column, web designers can make it stand out from the rest of the pricing table. The "cancel" button on a "cancel subscription" page may be small and grey to blend in with the background, while the "keep subscription" button is vibrant and vivid.

‍

Author: Jared Flenter, Writer

axamo.co

‍

‍