MSPTC_Logo_large.jpg

By: Amanda Redden


external image elementofdesign-size1.jpg


Size: [sahyz] ; noun. - how small or large something is.Physical dimensions should serve scale and proportion – but size is also contextual and relative in designs.

Size and scale are similar and sometimes confused with each other. "The size refers to the actual dimensions whereas the scale refers to the size in relation to everything else, such as people or the size of a room." (2).


fish.jpg


In design, there are three factors of size:

  1. function

  2. attract

  3. organize


Function
The function of size is to determine what the printed size of the piece will be. For example, if you are making a flyer, you need to consider the size in case it has to fit in a standard manila envelope or be made smaller or larger.

Attract
To attract the audience,small and large elements can be used or an image can be re-sized as well as cropped or edited to make it more appealing.

Organize
There are a few ways to organize your piece. The most important element should be the largest and the least important element should be the smallest. This will allow the viewer's attention to instantly be focused on the main topic. Headlines are usually the largest type element while the sub-headlines are slightly smaller and the body text is even smaller. To show importance, images can be made larger so they appear closer and create spacial balance.


Here are several ways design elements can be enhanced by using size:

  • Make the most important element the largest
  • Make elements more noticeable by changing the size of text or pictures
  • Decide when to bring forward elements or make them recede
  • Contrast two elements with each other, add small text to a large picture
  • Use repeating elements to make elements fit together

Example of large image size with smaller text.
Example of large image size with smaller text.


Size in regards to web design:


The designer determines the size of the page as well as the size of the sidebar, header and footer and the main content area. Other aspects that the designer is responsible for is setting the size of the images within the page and the size of the displayed text used throughout."Every element of your page will display at some size." (3).

Another aspect of size in the design process is the size of the files being used. As a designer, you need to consider the size of your creation for users to download the final piece. Each viewer may have different browsers in which the webpage is opened. With that being said, each viewer sees the web design in absolute measurements regarding fixed dimensions and size.

Size is shown through images and text. The title is in a large type followed by sub-headlines in a slightly smaller size then main content in even smaller type. The images are sized depending on the amount of space left with the information being provided.
Size is shown through images and text. The title is in a large type followed by sub-headlines in a slightly smaller size then main content in even smaller type. The images are sized depending on the amount of space left with the information being provided.


The most important element is in large type while the picture is sized to make the page more attractive to the viewer. The size of the remaining elements vary based on the size of the webpage. The designer centered the information and sized the green circles based off the size of the bottle he used.
The most important element is in large type while the picture is sized to make the page more attractive to the viewer. The size of the remaining elements vary based on the size of the webpage. The designer centered the information and sized the green circles based off the size of the bottle he used.


Sources:
1. Image 1: http://www.designofthepicturebook.com/2012/01/
2. http://www.prettyunexpected.com/basic-elements-of-design-size-scale/
3. http://www.vanseodesign.com/web-design/size-scale-proportion/
4. Image 4: http://urlnextdoor.com/ai/design-layout/week04.php
5. http://www.webdesignerdepot.com/2013/02/20-typographic-websites/