Monday, February 25, 2013

Newspaper Front Page Design (Tutorial Four)


Images sources:-
http://samuraikarate.net/wp-content/uploads/2013/01/Arrow-Icon.jpg
http://cdn.asiancorrespondent.com/wp-content/uploads/2013/02/AngLeeOscar-621x324.jpg
http://static5.businessinsider.com/image/512b025feab8ea5b2900000f-2604-1953-400-/jennifer-lawrence-daniel-day-lewis-oscars-2013.jpg
http://specials-images.forbes.com/imageserve/06SK3XafFO1KE/0x600.jpg?fit=scale&background=000000

Monday, February 18, 2013

Fonts (Tutorial Three)

Fonts used:
(1) Arial Black
(2) Blackoak Std


Fonts used:
(1) Nanum Pen Script
(2) Letter Gothic Std




Fonts used:
(1) Party Let
(2) Jazz Let


Fonts used:
(1) Nueva Std
(2) Brush Script M7



Fonts used:
(1) Zapfino
(2) Apple Chancery



P.s All the fonts were obtained from Macbook Pro Pages :)


Tuesday, February 5, 2013

Page Layout Design (Tutorial One)


MCH 307: The Six Design Principles (Tutorial Two)


1. Emphasis

The key of design principles is Emphasis. Designers apply emphasis as a focal point to convey a particular message and it becomes the centre of attraction. Emphasis is applied in most of the design works, especially magazine covers and movie posters. Emphasis can be created by contrast, isolation and placement.

Let's take a look at an example:






Source: http://issuu.com/merdunord/docs/mdn_ss13__v_final_issuu

The designer of this catalogue cover has emphasized on the model's face, up to neck level. It would be the first thing which catches the reader's eyes. Her detailed feature would be the attention grabber. Readers' would concentrate on those details.The catalogue's name is kept in smaller font and mild color (mild gold). Therefore, looking at the catalogue's name would be the last option. 


2. Contrast

Contrast is another important design principle. Size, tonal value, typeface, shape, and color are the elements of contrast. Contrast is used to create more impact and it makes a particular object or product to stand out. 

Example of contrast:







Source: http://issuu.com/shopruche/docs/weddingbliss

Obviously, the emphasis of this wedding magazine cover is the the magazine's title, RUCHE. However, the contrast would be the small flower pot, with bright pink flowers in it. The background of the magazine cover is light beige and the title is white. Thus, the bright pink flowers tend to stand out compared to the other details. Color is one of the elements of it. The flower pot's shape (round) is also a contrast as the word 'RUCHE' is aligned in a rectangle box. So, shape is another element of contrast applied in the magazine cover. 


3. Balance

Balance is an important factor to be considered when designing and arranging the layout of a magazine or a book. It usually follows the 'eye-flow'. There are two types of balance, symmetrical and asymmetrical balance. 

Symmetrical Balance
Symmetrical balance is also known as formal balance.

An example of symmetrical balance: 










Source: http://issuu.com/auscakedecoratingnetwork/docs/cake_issue1_acdn2013a

This page layout is symmetrically balanced. There are eight images, same size, rectangle-shaped and well-balanced on both pages (four images on each page). The text is also balanced. I have placed a line in the center of the page, you can see that the image and text are mirrored on the next page. But, the contents would be not be similar. It is hard to find any imbalance in this image.

Asymmetrical Balance
Asymmetrical balance is known as informal balance.

An example of asymmetrical balance:


Source: http://issuu.com/auscakedecoratingnetwork/docs/cake_issue1_acdn2013a

As you can see in that image above, the asymmetrical balance happens as one page has smaller image and more text and it is balanced by the placement of the image of a guitar, which covers the whole page. It is hard to apply asymmetrical balance as it may cause imbalance. 

4. Alignment

Alignment helps designers when it comes to image and text placement. Alignment will make the page look more organized and readers could understand the contains easily. Factors such as grids, information architecture, and user interaction influences the alignment of a page.

Let's have a look at an example for alignment: 


Source: http://issuu.com/joycemeyerministries/docs/feb2013

As you can see, the page is well-aligned. The designer has placed columns to make the text align well and look neat. The image is placed accordingly and it aligns with the headline and the text. At the bottom of the pages, the page number, month of the issue and the details of the issue is aligned according to its grid. Because the pages are aligned, it looks organized and neat.

5. Repetition

Repetition of any visual elements tend to create a pattern. It can be a repetition of lines, objects, colors, shapes or images. Repetition can be regular or irregular and even or uneven. 

An example of repetition:



Source: http://issuu.com/ljiljanavidovic/docs/portfolio_updated

In this image, the designer has chose an object as the repetition. The umbrella is a form of uneven repetition, as it is scattered all over the cover. Even though, the color of the umbrellas may differ, it is still a form of repetition as the object is repeated. That repetition has created a pattern and the cover looks more creative.

6. Flow

Flow enables the readers' to go through the important elements first and then to the least important ones. A good flow will give prominence to the most important elements or details. Flow also creates a path for the readers to follow when reading something.

Let's look an example of flow:


Source: http://issuu.com/integrativenutrition/docs/ready_for_love_guide_single

This page has a good flow. The readers' can read from top to bottom. The headline, 'Grow' is given the importance and placed at the top of the page. Readers will know that the topic is about grow and they would continue reading the other details. The explanation is after the headline, which is also important. The image is placed at the bottom as it is least important. Thus, this page has a good flow for the readers. 

As a conclusion, I would say that all these SIX DESIGN PRINCIPLES are important to create a creative and good magazine layout. These design principles work hand-in-hand.


REFERENCE(S)


About.com Web Design/HTML. (2013). Flow in Design- Layout and Artwork that Conveys Motions. 
                 Retrieved February 5, 2013, from http://webdesign.about.com/od/webdesignbasics/ss/flow-       
                 in-design.htm


Researching Art. (2013). Principles of Design. Retrieved February 5, 2013, from
                 http://www.canleyvale.hs.education.nsw.gov.au/Winning%20websites/art/pod.htm


Sitepoint. (2009). Principles of Design: Contrast. Retrieved February 4, 2013, from

                 http://www.sitepoint.com/principles-of-design-contrast/



TechRepublic. (2012). Effective design principles for web designers: Alignment. Retrieved February 5,   
                 2013, from http://www.techrepublic.com/blog/webmaster/effective-design-principles-for-     
                 web-designers-alignment/1856



Web Design for Instruction. (1999). Classic Graphic Design Theory Principles of Design: Emphasis.
                 Retrieved February 4, 2013, from         
                 http://www.usask.ca/education/coursework/skaalid/theory/cgdt/emphasis.htm
   
               

Web Design for Instruction. (1999). Classic Graphic Design Theory Principles of Design: Balance.
                 Retrieved February 4, 2013, from     
                 http://www.usask.ca/education/coursework/skaalid/theory/cgdt/balance.htm