Have you ever though about what are the main elements or building blocks of the design? There is a specific number, seven to be exact, of elements every design works with or is composed of. These elements are the basics upon which your foundation of design will be built upon. Since the best way to learn and master new skill is to deconstruct it to the smallest steps possible, in this post, we are going to this with these elements of design too.
The first of the elements you will learn about is color. I don’t want to go too deep into the color theory because you can read about this subject in posts like Psychology of color for designers or a bit older The Color Theory Crash Course Pt.1. Here, I will summarize the theory into smaller and more dense chunk. Basically, color is used by designers to generate emotions. It can also help you define importance of elements and create a visual interest and hierarchy. Color can help you guide the eye of reader.
We have two color models. First is called CMYK, and the second is RGB. CMYK abbreviation stands for four inks – cyan, magenta, yellow and key (black). This model reduces – subtract – the light that would otherwise be reflected, so it is called subtractive model (subtract brightness from white). CMYK color model is mostly used in print and you can get in touch with it when creating design for covers, posters, business cards and anything print-ready.
Quick note: The “K” in CMYK stands for key. In four-color printing, cyan, magenta, and yellow printing plates are carefully keyed (aligned) with the key of the black key plate.
The second model is RGB. This abbreviation stands for red, green and blue which are three primary colors. RGB is an additive model which means you are mixing (adding) together colors in order to create new one. For example, by mixing additive primary colors (red, green, blue) you can get cyan, magenta and yellow. You can continue by mixing the additive primary colors with additive secondary colors and create tertiary colors. The main use of RGB is in displays and other electronic devices used for presentation.
The last thing to mention about colors is that we can divide them into two sub-groups. First are warm (active) colors, and second are cool (passive) colors. Warm colors are red, oranges and yellow and their combinations. These colors look as though they come closer, or advance. Cool colors are blue, green and light purple. These colors, on the other hand, make things as though they recede. So, warm colors will evoke enlarging and closeness while cool colors shrinking or distance.
The second of design elements is line. This is, in simplest terms, a mark between two points. You can create different types of lines. For example, they can be straight, twisted or curved. Lines, as a design elements, can be used in typography to stress specific words or phrases. In layout, they can be used to connect content, create patterns, grid systems, group various layout elements together or evoke a distance. Lines can serve many functions depending on what you are working with and what do you want to achieve.
Third of the design elements is shape. All shapes are created from width and height. The basic shapes you learned in elementary school were circle, square, rectangle and triangle. However, we can go farther and specify three types of shapes. First are geometric. These are the mentioned above – square, rectangle, etc. They tend to be symmetrical. Second are natural. These shapes are made by natural forces and can be found in nature. Some examples can be animals, plants, people, etc.
Third and last type are abstracted shapes. Abstract shapes have are recognizable, but they are not real like the natural shapes. Often, they are simplified versions of organic shapes. For example, icons, graphic representations and alphabet glyphs. They sometimes have a universal meaning and recognition, like icons and symbols.
Size is, simply, how small or large something is or appear to be (remember the colors?). Size also helps us divide objects intro groups and create visual hierarchy and dominance in layout. By choosing proper size for your typography elements such as various headings and paragraphs, you can create visual hierarchy. Dominance means making specific elements bigger to draw attention to them or smaller. It can also create similarity in composition and establish flow and direction in the layout.
One of the most difficult design elements to master is space. When designers talk about space in layout or composition, they are often mentioning the white space or a negative space. In short, it is the area around or between elements in composition. Even though it can seem as an inferior element, space is one of the key aesthetic factors you have to learn well if you want to be a successful designer. When done well, space can help you remove the clutter while keeping only the most important and vital information.
On the other hand, space can also easily break your design. Too much of the space will cause the layout to disintegrate, while too little will create tense and density between elements and can make the content cluttered. Space can help you separate or group information as well as define importance and lead the eye. So, forget stacking tons of information to take advantage of all of the space you have available. Focus on what is truly important instead, and use space to emphasize it.
Another design element is a texture. Texture relates to the surface of an object, how it looks and how it feels. Texture can be that of sandstone, polished granite, rough concrete, smooth wood or anything that has a look of a tactile feel. Even blocks of type give a sense of texture, and vary from typeface to typeface. By using texture you can add a depth and visual interest to your designs.
The last of the seven design elements is value. Value is how light or dark a specific area looks like. Value can be also known as lightness or tone. In design, you can use gradients to visualize the value and its transition from white to pure black across the shades between them. As other elements, value too will help you create depth, emphasis, pattern or lead eye in specific direction. Value can also evoke feelings and moods.
Low value will create a subtle effect that feels calm and quiet while high value will evoke drama and conflict. From the psychology point of view, light values create sense of happiness and lightness, mid-range values sadness and depression and the dark values evoke feelings of fear and mystery. Additionally, darker values have more visual weight than lighter values.
As you can see, design compose of many layers. These seven elements you have learned about today are just one of them. However, you don’t have to feel bad. Just understanding these seven elements will help you build a solid design knowledge necessary for you to become a better and more successful designer. What are your thoughts on these seven elements of design? What other elements should be on the list?
If you liked this article, please subscribe so you don't miss any future post.
If you'd like to support me and this blog, you can become a patron, or you can buy me a coffee 🙂