Transcript for:
Key Design Principles

Lines, shapes, form, text, and  color are basic design elements,  but how do we bring them together? In this lesson, we introduce key design  principles so you can create with confidence. What's the first thing you see in any design? We'll give you a hint. It's the element that's emphasized. Emphasis is when one element stands out. It may be bigger, bolder, or  brighter than anything around it. We add emphasis to the parts of our  design we'd like people to notice first. Contrast, movement and white space are  some techniques that create emphasis. Let's run through these one by one. At its most basic level, contrast is difference. It's the difference between red and  blue, patterned and plain, big and small. Contrasting elements are opposite elements. They make designs interesting  and is used to add emphasis. Color, texture, and lines are a few  elements that help us to build contrast. We contrast dark with light  colors or thick with thin lines. Here we can see many examples  of contrast in a single image. The text 'Mingbau Restaurant' is the  most important piece of information.   That's why it pops with bold and bright type.  This contrasts with the black  background to emphasize the text. Where else do you see contrast? How about the white ring  surrounding the black circle  or the white lines framing the dark pictures? The photographs provide further  contrast through texture.  The tactile 3D detail of seeds on a burger bun  or steam rising from a hot dish also contrasts with the plain, black circle. White space applies to any area of  design not taken up by other elements such as text, photos, or illustrations. Designers love it because it can help create  grouping, add emphasis, and improve legibility. Contrary to the name, white space  doesn't just apply to the color white. Even if our design is blue or yellow,  we can still have white space.  It often refers to the background of the design. Even with a picture in the background, you  could still have the benefits of white space. What we're looking for is an empty patch  that gives our design breathing space. We use white space to prevent our page  becoming overcrowded with elements. It makes our design easier to look at. White space also helps with emphasis. In this picture, there's so much white space we're instantly drawn towards the words.  The information is delivered  quickly, thanks to white space. There's plenty of movement in a still image. Movement is the way our eyes scan the page. It's how we follow one element to the next. Line and color direct us towards certain  parts of the design in a certain order. In this book cover, simple shapes and  contrasting colors direct our eyes to the center.  Then we notice a semi-circle in the  corner which represents the sun.  Doesn't it look like the sun is poised to move  across the square or maybe out of it altogether? There are many ways to achieve movement. Through contrasting white on black, our eyes are  first drawn to the title of the classic book cover  then we make our way down the page to spot the shark lurking beneath. The empty space prompts our eyes  to move between these bold elements  only later do we drift back up to take  a closer look at the little object.  Will the swimmer make her escape  before the shark moves into her space? Repetition can bring artistry to our design.  It can make our design look consistent,  build a pattern, or emphasize our message. Let's start with patterns. If we take a watermelon and repeat this object  until it covers the page, we've made a pattern.  This pattern can add texture  or provide a background.  Repeating text will keep our design minimal. This means we can focus on the message using   subtler elements such as color and  space to give the words their meaning. Repetition also gives our  design a sense of rhythm.  In the same way music gives us a predictable  beat, repetition gives us a visual beat.  Using elements in a repeated order gives  our design a clean and well-structured look. If something is out of  proportion, it might fall over.  That's how we think about the  size and quantity of our elements  and how they relate to each other. This stops our design feeling  heavy, lopsided, or generally off. When creating a design that features a cup of tea,  a spoon, and a book, we need to make sure the cup   is bigger than the spoon and the book  should be the biggest object of all. No matter how many objects or elements we  use, they should always be proportionate. Once we have our objects  or elements in proportion,   it's time to look at how they're balanced. Balance is how we position  objects inside our design.  It can also include the amount of white  space compared to other design elements. One way to master balance is to think  of each element as having a weight. From text boxes to images to blocks of color, consider each of their sizes, shapes,  and what weight they have in relation  to other elements on the page. We can also balance our elements  symmetrically or asymmetrically. Symmetrical balance gives our  design a sense of security. Our viewer feels safe knowing our  design has been well-structured   and everything looks like it's in the right place. It's safe, but can also be a bit boring. Asymmetrical balance is where elements  are not balanced in exactly the same way. For instance, one side of  the composition might have   a large emphasized element that is balanced by  a couple of lesser elements on the other side. It's still balanced, but it's not  mirrored like in the symmetrical example. This makes it a little more  dynamic and interesting. Unbalanced design can be its  own design technique too. For example, when we want to make our viewer   feel like something isn't quite right, we  make our design look unsteady on purpose. This is great for unnerving the  viewer like on a horror movie poster. Balance is one of the most important principles. The final principle to discuss is alignment. Some people suggest alignment pairs with balance.  As by aligning elements, it can  help designs feel more balanced. Alignment focuses on the relationships between  elements, giving structure and order to designs.  You can have edge or center alignment.  Edge alignment can see objects relating to  the left, right, top, or bottom of the page.  Center alignment sees objects sticking to  the middle either horizontally or vertically   or both if you want it right in  the middle of both X and Y axes. Objects can also be aligned to each other  where they both sit on the same X or Y axis.  This implies these objects have  a relationship to each other   and therefore should be understood together. Alignment is incredibly important if you want your  design work to feel professional and finished.  Having objects that are not aligned to each other  makes your design look random and unplanned. We've learned a number of design  principles in this lesson.  Soon it will become second nature as  you work them into your own designs.  But until then, we'll give you a reminder  of the theory you've learned today. Emphasis is the way one  element stands out on the page. Contrast is the difference  between two or more elements   such as bright and dark colors  or big and small objects. White space prevents our page  becoming overcrowded with elements.   It's the breathing space on the  page and it can be any color.  Movement is the way our eyes are directed  to scan from one element to the next. Repetition can bring patterns  or rhythms into our designs. Proportion is the size or quantity of our  design elements in relation to each other. Balance is how we position those multiple objects   and how we can make the overall  design symmetrical or asymmetrical. Alignment is building relationships  between objects and the X and Y axis.  Test out each principle in your next design even  if you're only using one word on a background.