Loading

Alison's New App is now available on iOS and Android! Download Now

Study Reminders
Support
Text Version

Set your study reminders

We will email you at these times to remind you to study.
  • Monday

    -

    7am

    +

    Tuesday

    -

    7am

    +

    Wednesday

    -

    7am

    +

    Thursday

    -

    7am

    +

    Friday

    -

    7am

    +

    Saturday

    -

    7am

    +

    Sunday

    -

    7am

    +

Typography is a complicated medium to work with, as it contains two levels of information (display and content) and requires its components to be read in proper sequence, with proper emphasis, good legibility and strong contrast to the substrate. Many elements need to be organized, to allow the reader a seamless experience when reading the content. Designing with type, requires adepthandling of the hierarchy, refining and designing the display elements for focal emphasis. It also involves refining the quiet details of the text block, so it sits perfectly and quietly in its space. Designers make myriad decisions about concept, style, visuals, form, font, size, spacing, colour, placement, proportion, relationships and materials. When some factors are determined in advance, the designer is able to spend time with the other parts of the project. A well-defined constraint can free up the thought process, by taking some decisions off the table. The following organizational systems cover composition for type, but can also be applied to general composition, including the traditional ordering system of the grid. A grid is a network of lines that structure the placement of elements and create relationships between them. A grid divides a design space into vertical and horizontal divisions. It is an exceptional tool for composing, arranging and organizing every kind of visual element. Grids are often used in publication and web design, because they introduce consistency and guide hierarchy. Consistent margins and columns create an underlying structure, that unifies the multiple pages of a document or website and makes the layout process more efficient. If your publication is a book of poetry, the grid must have generous amounts of negative space and generous leading (space between columns). If, on the other hand, your publication is a daily newspaper, the spacing relationships cannot be so generous and have to clearly show which article relates to which image. Hierarchy of information must be very clear as well and should reveal which news item is most important and which is least important. A grid helps create both stable symmetrical and dynamic asymmetrical compositions. By breaking down space into smaller units, grids encourage designers to leave some areas open, rather than fill up the whole page. The following organizational systems cover composition for type, but can also be applied to general page layout. The golden section is also known as the golden ratio, golden mean, or divine proportion. It is found in mathematics, geometry, life and the universe — its applications are limitless. The golden section is a ratio — a relationship between two numbers — that has been applied as an organizational system in art, design and architecture for centuries. Expressed numerically, the ratio for the golden section is 1 : 1.618. The formula for the golden section is a : b = b : (a+b). In other words, side a is to side b as side b is to the sum of both sides. Graphic designers use the golden section to create grids and layouts for websites and books. Photographers use it to compose the focal point of an image and also to compose the elements found in an image. Content that is appropriate for a single-column grid, consists of main text for the text block, a few levels of display type, possibly some images and finally page numbers. The main column of this style of grid must sit properly on the page, held in place by the negative space that surrounds it. To determine the right amount of negative space on the top, bottom and sides of the page, a designer usually considers facing-pages as a spread. In books and magazines, the two-page spread, not the individual page, is the main unit of design. When a designer creates a grid for a document that is complicated, he or she may use multi-column grids, because they allow for a complex hierarchy and provide more options for integrating text and visuals. You can use the grid to articulate the hierarchy of the publication, by creating zones for different kinds of content. The columns act as visual units that can be combined or kept separate. A photo can span several columns or be reduced to the width of only one. A text can also occupy a single column, or span several.In addition to creating vertical columns in a grid, you can also divide the page horizontally. Often, a designer determines the placement of hang lines by applying the rule of thirds (breaking up the horizontal plane into three equal parts). This compartmentalization, allows the designer to reserve certain sections for images and others for the text block. In modular grids, the modules are always identical and are created by applying consistent horizontal and vertical divisions to the design space. Like the written notes in a musical score, the modules allow you to anchor your layout elements and typography to a specific "rhythm". With a modular grid, the horizontal guidelines are tied to the baseline grid that governs the whole document. Baseline grids serve to anchor most of the elements to a common leading (typographic line spacing). A baseline grid is the horizontal grid that determines where all of the type will sit. You can also use it to determine the placement and edges of your visual and graphic elements. To create a baseline grid, determine the right font, size and leading for your text block, then go to your baseline grid settings (found with the other grid preferences) and change the baseline grid default (usually 12 pt), to the leading you will be using in your text block. Once the systems outlined in this topic are innately understood by a designer, they can begin to play with layering more than one system in a design project. Combining contrasting systems often works well. In the final section of this course, a number of grid types are summarised. Axial: All elements are arranged on either side of an axis or line. You can centre the axis or, for a more energetic asymmetrical composition, place the axis off centre to either the right or left. This strategy creates a dynamic negative space on the opposite side. There are many instances of the axial system in nature — tree trunks, roots and vines are good examples. Like these organic examples, an axis does not need to be a straight line — it can be curved, zigzag, or circular. Modular: Modular organization, is a compositional method that utilizes shapes contained within a larger structure (grid). Modules can be any size and placed anywhere in the space. Bilateral: The bilateral system is based on mirrored symmetry. Nature exhibits many examples of bilateral composition - the bodies of mammals (pairs of eyes, ears, arms, hands, legs and feet), the points of a snowflake and the fractal symmetry of plants. Radial: The radial system takes its name from the sun — all elements are arranged like rays coming from a central focal point. This is a dynamic compositional strategy, as it references dynamic action. Examples of the radial form from the natural world include: explosions, flowers, spiders and stars. There can be problems with legibility, unless type is very carefully placed and scaled. Every line of type starts and ends in a different place, so continuity can be hard to control. For example, a designer may take a traditional approach, so the text reads from top to bottom, or an inverse approach, so the text reads from bottom to top. Arranging the text on either side of the centre, may also be effective. Try placing the type in different positions and in different relationships, until it works with the composition and is easy to read. Designers can combine a radial system with a grid, axial, or modular system, for a more complex composition. Dilatational: Dilatational systems mimic the look of still water when a pebble is dropped into it, creating rings of greater and greater size, as they move away from the centre. Like the radial system, this composition has a strong focal point, but unlike the radial system, the composition creates rings, not rays, that expand from the centre. Other examples of this system are the iris of the eye or representations of sound waves. Random/Spontaneous: Creating a composition that does not follow any compositional principle is not as easy as it sounds. Finding examples of randomness is also one of the most difficult exercises for design students. Random design does not follow any rule, method, direction, or pattern. If a project calls for randomness, it is best to start with materials that are conducive to spontaneity, like Jackson Pollock’s paint throws. Allow the elements that fall, to organize themselves naturally — eventually, a dynamic and fresh composition should emerge. Random compositions exhibit visual qualities that are not patterned, aligned, or horizontal. Instead, they tend toward compositions that exhibit overlapping, cropping, angling and textures. QUESTION THREE: Complete the sentence by choosing the correct option: _____ are often used in publication and web design, because they introduce consistency and guide hierarchy. Grids Rules Guides