{"id":19492,"date":"2022-10-26T10:27:06","date_gmt":"2022-10-26T08:27:06","guid":{"rendered":"https:\/\/careerfoundry.inbearbeitung.de\/en\/?p=19492"},"modified":"2023-03-02T21:51:55","modified_gmt":"2023-03-02T20:51:55","slug":"what-are-principles-of-design","status":"publish","type":"post","link":"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/what-are-principles-of-design\/","title":{"rendered":"What Are the 7 Principles of Design? A UXer\u2019s Guide"},"content":{"rendered":"

Beautiful, effective design is a key element of UX. Art provides us with something gorgeous to look at\u2014good design does this while serving an additional function.<\/span><\/p>\n

A s<\/span>trong design offers users an attractive and effective proposition. <\/span>And while a great book cover or movie poster may look like a wild piece of art or an untamed splash of creative genius, it will actually be governed by a strict set of rules: <\/span>The principles of design.<\/span><\/p>\n

What are the principles of design?<\/span><\/h2>\n

A principle of design is a rule that governs how design elements should appear on the page or screen. Working together, these principles of design are necessary to create pieces of design that are both functional and aesthetically pleasing. <\/span><\/p>\n

These rules work behind the scenes to make sure a design is stable, balanced, and successfully delivers its message. All while still allowing the visuals to pop.<\/span><\/p>\n

Intrigued? This piece will highlight the seven key principles of design to remember and <\/span>analyze how they apply to us in the world of UX<\/a>.\u00a0\u00a0<\/span><\/p>\n

To jump ahead to a certain section, you can use this clickable menu:<\/span><\/p>\n

    \n
  1. Alignment and balance<\/a><\/li>\n
  2. Contrast<\/a><\/li>\n
  3. Emphasis<\/a><\/li>\n
  4. Movement<\/a><\/li>\n
  5. Proportion<\/a><\/li>\n
  6. Repetition<\/a><\/li>\n
  7. White space<\/a><\/li>\n
  8. Key takeaways<\/a><\/li>\n<\/ol>\n

    1. Alignment and balance<\/span><\/h2>\n

    Alignment and balance refer to the distribution and symmetry of the design elements in your piece. In UX design, alignment and balance are important elements to create structure and improve readability.<\/span><\/p>\n

    All pieces of design carry weight, which can be held in the size, quantity, texture, or color of objects.<\/span><\/p>\n

    It always seems wrong when the distribution of pepperoni is focused entirely on one side of the pizza. Likewise, if all the weighty objects appear in one corner of your work, the piece will appear strange and lop-sided.\u00a0<\/span><\/p>\n

    Symmetrical design offers more balance, distributing elements on either side of an imaginary central line.\u00a0<\/span><\/p>\n

    If this seems a little square or boring, equilibrium in the piece can be achieved by aligning contrasting items in different areas of the page. One large object, counteracted by many smaller ones, for example in this painting by Henri Matisse, Dance:<\/span><\/p>\n

    \"henry<\/p>\n

    Source:<\/em> Wikipedia<\/a><\/p>\n

    This asymmetrical approach can also lend the design movement (more on that later).\u00a0<\/span><\/p>\n

    The London Tube Map is a masterclass in aligning and balancing a notoriously wonky and disproportionate system onto the page.<\/span><\/p>\n

    \"screenshot<\/p>\n

    Source: <\/em>Transport for London<\/a><\/p>\n

    2. Contrast<\/h2>\n

    The principle of design, contrast, is usually associated with stark or complementary pairs of colors. It can also refer to fonts, shapes, and other elements that create space and difference in your design.\u00a0<\/span><\/p>\n

    The consistent effect of contrast is to make your design elements \u201cpop\u201d, or jump out from the page and grab the reader\u2019s attention. This popping effect is key to UX design, as it can be used to draw the user\u2019s attention to desired elements, keeping them on track.\u00a0\u00a0<\/span><\/p>\n

    Contrast can be achieved by picking colorways that work harmoniously together (<\/span>find out more in this article about color theory and color palettes<\/a><\/span>).\u00a0<\/span><\/p>\n

    A well-chosen typeface can also contrast engagingly with the subject matter.\u00a0<\/span><\/p>\n

    This modern rebranding of Washington\u2019s award-winning Shakespeare Theater Company utilizes contrast in fluorescent colors and clashing fonts, to great effect:<\/span><\/p>\n

    \"posters<\/p>\n

    Source: <\/em>Shakespeare Theatre Company<\/a><\/p>\n

    3. Emphasis<\/span><\/h2>\n

    Emphasis is a vital part of design, as it communicates to the reader which elements of the piece are most important. In UX design, this is absolutely critical; important elements must be emphasized accordingly, or you risk baffling and losing your users.\u00a0\u00a0\u00a0<\/span><\/p>\n

    Emphasizing a slogan or image in your piece will create a focal point that draws the viewer in. This (often brief) moment of attention is your chance to tell the story of your product.<\/span><\/p>\n

    Emphasize a meaningless or inconsequential piece of the design, and you may well lose this fleeting chance to tell your product\u2019s story.<\/span><\/p>\n

    Emphasis can be achieved in a variety of ways, including:<\/span><\/p>\n