May 25, 2022

10 principles of visual designs

10 principles of visual designs

10 principles of visual designs

Visual design principles
contain many elements in one image. The combination of colors, typography, or movement plays a significant role in communicating with the audience. A good visual design must translate a universal understanding when scanning through the image or watching a video advertisement. The first few seconds must captivate the audience’s attention and trigger their interest to know more about the product. 

If you just start working in the visual design industry, these principles could come in handy when you want to create your first few designs as a visual designer. Paste this on the wall if you want to 💡. If you have a few years of experience in the industry, this blog could be a good reminder during your designer’s block moments.

The 10 principles of visual designs


Colors create an impact on each individual, and most colors we see in video advertisements or product images share the same universal meaning. This is important so that people in different countries could achieve a similar understanding of the design. Blue reflects a sense of calmness, red portrays boldness, yellow stir cheerful emotion, and so on. Designers must be aware that there are colors that are interpreted differently by a certain segment of the audience. Do some research before planning on the colors to apply to your design.

Photo by Sharon McCutcheon from Pexels


Contrast helps to differentiate the elements in your design. The different sizes, colors, or line weights make the elements stand out to catch the audience's attention and understand the underlying message of the design. Contrast highlights and guides the viewers’ eyes to view the elements of your design effortlessly.  It is the principle that makes your design ‘Pop’ 💥. Insufficient contrast may lead to difficulty in reading the text or understanding the pattern of the design, as well as affecting the audience's effort to understand the artwork.

Our mentor, Emmanuel Olotu explains that it is important for the colors and shades to be contrasted properly to enhance visibility and legibility. You could use a contrast checker online or plug-ins to check on your contrast level.

Photo by Алексей Васильев from Pexels



The order of the messages in your design is determined through your hierarchy. Hierarchy helps and guides the audience to read through the flow of information. This hierarchy can be created by playing with the font size, shapes, patterns, repetition, or the alignment of your design. It directs your audience to view the most important of your design first before moving on to the less important information. This is great as it will prevent the audience from having ‘Which elements should I view first?’ symptoms and allow them to process the information in your design.

"You can see it as the correct ranking of information in a design. This can also be achieved in a number of ways, but we will consider how to achieve it with the size and the weight of the elements." - Emmanuel.

Photo by Anete Lusina from Pexels


Humans tend to remember when things are in repetition. This can be observed by the awful songs that stuck in your head from the repetition playlist by the DJ, the awkward-looking fashion that you chose to wear because the design is on the billboards everywhere, and the newsletter shopping reminders 💸. Repetition triggers actions. It reminds people of your design, makes people recognize your design, and gives a sense of identity to your design. Repetition can be created using words, colors, shapes, and other elements of design.

Emmanuel added this might be the placement of:

  • your brand icon.
  • the usage of fonts, or
  • the overall design tone.
Photo by Aleksandar Pasaric from Pexels


You know the time where the typo error on our text messages creates awkward, funny, and sometimes anger to the receiver and sender 😆 ? That’s how powerful typography is, it creates emotions and brings impact to the audience. In the visual design field, typography is the looks of the wording. Typography sets the tone of your design and the product you are representing. Did you notice the eerie typography on a horror movie poster and the ‘bubbly looking’ typography on a comedy movie poster? It’s amazing how the shapes and colors of the alphabet could produce such an impact.

Photo by Polina Kovaleva from Pexels


As much as we need some space in our life, so do our designs. There must be sufficient space for the design to tell its story. Would you understand a speech without full stops? And even if you try to enforce as much attention to the speech, chances are you will be frustrated and leave the hall. The same goes with the spaces in the design, it allows us to take some time to understand the design, and digest the information. Negative spaces are the ‘breathing spaces’ between each word or pattern, and positive spaces are the actual letters or patterns. Getting the right ratio between negative and positive space allows you to achieve balance in your artwork.

Photo by Ann H from Pexels

White Space

White space (also belongs to the negative space category) has its function in visual design. It makes the organization and the hierarchy of your design more visible. The empty space helps to simplify your design by clearly separating the different elements in your design and make it easier for the audience to distinguish the elements, which allows quick interpretation based on the connection between the elements.

"This is useful in helping your design breathe–appear non congested. It can also prove to be very useful when developing brand identities as it help you carve out special meanings to your identity icon." - Emmanuel.

Photo by Vlada Karpovich from Pexels


A balanced visual does not mean that all your elements have to be the same size. That will be a bit odd, isn’t it? Balance your design through the colors, size, and patterns of the elements. It is meant to guide the audience’s eyes while looking through your design and at the same time, assist the audience to understand the design better. A poor balance design will mislead the viewer from focusing on the main element in the design.

Emmanuel explains that the balance can be symmetrical (same weight on both sides) or assymetrical (one weight with several uneven weights balancing the other side).

Photo by cottonbro from Pexels


Emphasis the most important element in your design. According to Emmanuel,  emphasis helps the audience know what your main point is.Before you start to design, brainstorm on ways to emphasize the main element of your design. What is the best way to portray the element? What is the best way to convey the message through the element? How to position the element? Perhaps you can use a striking color, maximize the bold size, or position the element right in the center of your design. Emphasizing the first element will influence the main message of the art.

Photo by Burst from Pexels


"Movement  must be done in a subtle way, it is just a way of making the audience accept the design as a single piece of information, instead of considering the many elements as scattered pieces of a puzzle."- Emmanuel.

The audience’s eyes movement to be exact. How to make the rest of the elements exist and could be understood by the audience? The movement from one element to another supports the story of your design. Keep adjusting the elements until you are satisfied with the results and feeling that you have achieved a well-balanced and accessible design. Share your design with a few people before finalizing the design. Different sets of eyes 👀👀👀 could point out the elements that are interfering with the movement and suggest some ideas on how to make the movement even smoother.

Photo by Bich Tran from Pexels

Learn How to make a Great Shadow in UI design.

Be part of the ADPList’s community to get more insightful contents on design: 

Emmanuel Olotu ADPList Mentor)
Co-Founder at Watermacks
ADPList Profile:
LinkedIn account:

Editor and Writer:
Farah Radzi
Content Marketer and Writer at ADPList
LinkedIn account: