Proportion is the relationship in size between various parts and the whole. Fashion designing is a creative expression. Exact mathematical proportions are not required as long as what you design is visually pleasing and in accordance with the size, shape and height of the bearer. 2. Balance Balance is the arrangement of a design on a space resulting to sense of equilibrium. It is the equal distribution of weight from a central point or area. There are three kinds of visual balance. They are the formal or symmetrical balance, informal or asymmetrical balance and radial balance.
3. EmphasisEmphasis is achieved by the designer’s ability to create a center of interest by which the viewer’s eyes are directed to a specific area of a garment or body part. 4. RhythmRhythm is the repetition of an accent to create an interesting design. Repeating an accent on different parts of the dress or one part of the dress will achieve a design that is harmonious and visually united. 5. HarmonyHarmony is the pleasing and congruent arrangement of parts. It is the blending of all components of design. When the structural lines, decorative lines, colors and accessories all relate to each other comfortably, harmony results. ← Back Next →
Design is an arrangement of both shapes and space. To work more effectively with space, you must first become aware of it and learn to see it — learn to see the shapes that space forms and how space communicates. This is second part of a series on design principles for beginners. The first part covered an introduction to gestalt; the rest of the series (including this post) will build on those gestalt principles and show how many of the fundamental principles we work with as designers have their origin there. The gestalt principle that applies most to space is that of figure-ground. Everything in a design of yours will be seen as one or the other, and the relationship between them is mutually exclusive. Neither can be perceived except in relation to the other, and changing one is impossible without changing the other as well. The figure-ground relationship is also complementary. Figure and ground can enhance or detract from each other, and organizing the two in relation to each other is one of the more important aspects of design. It sets a context for how your design communicates and how it will be interpreted. “White space is to be regarded as an active element, not a passive background.” In the third panel, two of the black lines have been removed. This activates the space, making it appear to be sitting on top of the gray field. The ground has become the figure and adds more depth to the design. There are three types of figure-ground relationships:
Depending on which relationship you set up and how you balance both figure and ground, you direct the audience to look at different parts of the design and interpret what they see in different contexts. Figure-ground is not the only gestalt principle in which space plays a prominent role. Two others are these:
Space As A Design ElementThink about music for a moment. If every note or chord were played at the same time, you wouldn’t have music. You’d have noise. Music occurs when sounds are contrasted against silence. Varying the pattern of sound and silence creates rhythm and melody. Without the silence, there is no music. Space performs the same function visually. It gives positive elements room to breathe. It gives the eye freedom to move through a design and to discover the elements it’s looking for. The positive is seen only in contrast with the negative. Without space, you don’t have design. You have visual noise. Unless noise is what you’re trying to communicate, lean toward space. People are less likely to complain about too much space than about too little. Space can do the following:
As the figure-ground relationship implies, you have space only when something is present inside it. Prior to the addition of positive elements, space is undefined. The figure-ground relationship has to be established before space can exist and its communication begins. One of the more important functions of space is to improve readability and legibility. Macro-space makes text more inviting. Micro-space makes it more legible.
Space correlates to quality. More space entails fewer elements or a rarity of elements. Compare high-end and discount retail stores. Which one typically has more space inside, and which one packs products into every bit of available space? What does the space communicate to you? Space can also convey attributes other than quality, such as:
You waste space when you fail to consider it. You can waste space by overfilling it. You can waste space by trapping it inside elements of a design and not allowing it to connect to other space in the design. Design is ultimately an arrangement of shapes, and that includes the shapes formed by space. Don’t be afraid to use space. View it as an important design element under your control. A Few Examples Of Space In WebsitesTo better use space, you first need to become consciously aware of it. Learn to recognize space in different designs. Notice the shape it forms, and think about what the space is communicating. To that end, let’s look at the design of some websites, taking notice of how space is used. Old GuardThe design of Tom Johnson’s Old Guard uses plenty of white space, giving text and other elements room to breathe. There’s no mistaking what’s figure and what’s ground. Information is contained and separated by space (recall the principle of proximity), distinguishing groups of elements. You can easily tell where one post ends and the next begins, solely by the space between them. The main content is slightly off center on the page, with generous space on either side. This space is occasionally interrupted by elements, activating both the space and the interrupting elements. This helps to draw attention to the area and especially the elements within. Heroku’s Staus PageThe image below shows part of the status page for Heroku as being mostly space. I happened to catch the website on a particularly good day, because additional positive elements would mean more reported incidents on the platform. Here, more white space signifies better service. Notice how the white space doesn’t need to be white. While the page is overly generous with space, you’re unlikely to complain that there’s too much of it. Only important information — in this case, status updates and reports of incidents — interrupt the space. Introducing the NovelThe space at the top of Introducing the Novel is asymmetric and active. Notice how the large block of space on the left leads your eye directly to the content. If you click through to the website and scroll down from the top, you’ll see that space is also used to separate and group blocks of information. Thin light lines are also used to group and separate these blocks. When viewing the website, notice how the lines don’t always touch, allowing the space to flow around them and connect to other space. This prevents the space from being trapped. Elliot Jay StocksThe website of Elliot Jay Stocks should be familiar to all of you, since he’s behind the design of this one. Asymmetrical space on Elliot’s website again leads to active space. The large image at the top of this page could potentially stand as a temporary block to accessing the content below; however, a generous amount of space next to the image provides ample and inviting room for the eye to move around it. If the sidebar on the left had the same background color as the main content, then it would probably be easier for the eye to move around the image, but the change in color hardly makes it difficult. As with the websites above, space is used to both enclose and separate groups of distinct information, allowing each group to stand out and allowing the eye to find what it wants and to rest in between. Phil CoffmanThe content on Phil Coffman’s website forms a single shape that sits in mostly empty space. The absence of many positive elements increases the importance of those that are present. Even within the colored rectangular backgrounds, the text has enough space around it to be easily read and not to be mistaken for another category of text on the page. The positive shape (and the shape of the space) adjusts responsively to different browser widths, but the pattern of a single large shape surrounded by space remains. New Adventures in Web DesignLike many of the websites here, The 2013 website for the New Adventures in Web Design conference leaves generous room around elements. Distinct groups of information are contained by space, and the space is active throughout the design. Something interesting to note is the gray circular arrows between the image in the upper-left and the main content to the right. Do these arrows block the flow of space? Because they don’t touch and because each is dashed where it interrupts the space, the space can flow through, although it’s clearly more restricted in that flow. The lighter-gray color helps. It prevents the arrows from dominating, and it’s not hard to imagine the space flowing over the lines. In fairness, if my browser was wider when I grabbed the screenshot, the arrows wouldn’t overlap with the main content. However, around 1280 pixels down to where the design becomes a single column, they do. Overall, it works, although I wonder whether the space would flow better without the arrows present. A Few Examples Of LogosI’ll leave you with some logos in which space is incorporated as an integral part of the design. Instead of pointing out the use of space in each, I’ll make a few general comments and then let you explore the spaces for yourself. Notice how the logos below make use of the figure-ground relationship. With some, until you see both figure and ground, you don’t see the full logo. Both are necessary contributors to what is being communicated. Several of these logos rely on the principle of closure. What you’re meant to see isn’t really there, but you see it nonetheless. A few of these logos also play around with figure and ground. What’s figure when you take in the whole logo against its background becomes ground for a smaller figure within. This reversible figure-ground relationship is central to what’s being communicated.
SummaryI hope you take away two main things from this post. First is the connection between the use of space in design and the gestalt principle of figure-ground. Gestalt principles underly much of what we do as designers. Secondly, and perhaps more importantly, make an effort to spend time observing how space is used in design. Don’t let space be a byproduct of your positive elements. Learn to design space as much as, if not more than, positive elements. The layout of any page is ultimately an organization of space. Consciously analyze that space, and deliberately use it to create a better design. Don’t allow it to be what’s left over. View it as an essential design element, and then view the relationship between space and positive elements as a design element that you shape. Next time, we’ll add more gestalt principles to the mix and explore how focal points, continuation and common fate lead us into ideas such as visual weight and compositional balance.
What principle of design that has relationship in size between a part and a whole?Proportion. Proportion refers to the relative size and scale of the various elements in a design. The issue is the relationship between objects, or parts, of a whole.
What is the type of principle of design that refers to the relationship between one part of the design to another part or to the whole design?Proportion refers to the relationship between one part of a design and another part or to the whole design.
What is size in principles of design?Size is simply how small or big an element is in relation to other objects within a design. Generally, we use size to make a particular element stand out or to give it importance. However, size becomes a much more powerful design tool when it is considered alongside scale.
|
