Repeating shapes to unify your design

- [Instructor] Next up is shape. Shape is the fourth of the eight elements of design. Like the other elements, shape is an integral part of any design, and when used effectively, can help you set the tone of your web graphics. What's more, repeating shapes within a design can often help unify all the elements in a single layout. Let's start our discussion about shape by defining exactly what it is. For our purposes, shape is defined as any flat area bound by line or outline, value, or color. In other words, shapes are self-contained, defined areas that fall into two camps, geometric and organic. Geometric shapes are based on their dimensions like circles, stars, squares, rectangles, and polygons. Think shapes formed by math. Organic shapes in contrast often resemble the natural world and so tend to be curvier, irregular, and at times, asymmetrical like blobs and amoebas as well as flowers, leaves, trees, clouds, waves, and people in all shapes and sizes. Shapes can also be positive or negative, playing with our sense of space, like that famous illusion of the two faces forming the vase, like this golden vase here and this orange one next to it. This illusion happens when we shift our focus between the object and the background. Similarly, when we look at these stars, the positive black star on the left occupies the empty white square space, while the black circle on the right becomes the negative space inside which the white positive star shape exists. Your mind can flip between foreground and background based on the aesthetic qualities present in the design. Shape, like color and value, can also convey mood and meaning. For instance, rounder shapes are often perceived as friendlier than sharper-edged shapes. Inversely, sharper-edged shapes might occasionally give the impression of rigidity or formality, or orderliness. And when paired together with intention, contrasting shapes like these straight lines and curves can aid in creating an area of emphasis within the composition that easily guides users towards an intended call to action. Shape is integral to any design. In fact, whether we realize it or not, designers often use an underlying grid shape every day to organize and arrange elements within the design space. As a general rule, when using shape, seek to create harmony at the local and global levels. In terms of designing for web experiences, think of positive shapes as the interface elements like buttons and nav bars, while the negative shapes are the spaces in between any two or more forms. We use space to carve up, to organize, to define areas that aid users with understanding. This includes paying attention to the positive and negative shapes everywhere in our designs, including the backgrounds, the decorative elements, the borders, patterns, gutters, margins, and all the spaces in between. Another great way to use shape in design is repetition. Repeating shapes by their very organization helps to create a sense of harmony or unity in your design. Use repeating shapes logically throughout your designs, including shapes like custom bullets, buttons, thumbnail images, navigation styles, and decorative embellishments. To recap, shapes can be any flat area bound by line, outline, value, and color. Shapes can be positive or negative, and they can be geometric or organic. And in web design, you can use shape effectively in every element of your layout. And repeating shapes can give an added sense of unity and cohesion to your designs.