1. Typography
Graphics design fundamentals
Subject Code: GDF 111
Week : 4 Date : 6th
June 2013 session: AN
Midhunchakkaravarthy
Lecturer- Lincoln University College

2. Typography
 Typeface- design of the letters
 Font- complete set of characters (software
typeface)
 Above all else, the audience must be able
to read it!
Typography

3. Typeface Categories
 Serif- conservative and highly legible
 San-Serif- casual and legible
 Scripts- hand written
 Novelty-immediate tone setting and hard
to read
Typography

4. Type Characteristics
 Size
Measured in pica or points- 72 points in an
inch… 12 points in a pica… 6 picas per inch
Computer screen can be deceptive
Printed proof to see actual size
Web design should be judged on a screen
Typography

5. Type Characteristics cont.
 Line Length
Measured in pica
Flow to fill predetermined column
 Style
Legibility prime concern
Either stick to one type family or they need to
be very different
Typography

6. Type Characteristics cont.
 Leading
Vertical Space between lines
Readability concerns
 Spacing
Kerning- space between letters
Word Spacing
Typography

7. Type Characteristics cont.
 Format
Justified-all lines same length
Unjustified- flush left or right, center and
asymmetrical
 Style and Content
Visual tone
Affects image of client
Typography

8. Type Characteristics Examined
 Type
 Type
 Type
 Type
 Type
 Type
 Type
 Type
 Type
 Type
 Type
 Type
Typography

9. Typeface Layout Tips
 Serif body/San Title or vice verca
 No novelty in body
 Italics for emphasis
 Never all caps
 Limit 2 fonts per page
 Limit 3 font sizes per page
 Simplify
Typography

10. Text Contrast Layout Tips
 Contract title and body text for interest
 Vary size, weight, style, separation, color
differences
 Best legibility (black text/white paper)
 Reduce legibility (black text/dark paper)
 Simplify
Typography

11. Text Format Tips
 Consistent space
 Separate paragraphs with either line space or
indent, not both.
 50-70 words per line
 Leave plenty of white space
 Balance
 Look at the whole
 Simplify
Typography

12. Type Design
Typography

13. Type Design
Typography

14. Images
 Creating Graphics
 Illustration- using images that represent or
express to make a visual statement
 Can show something that cannot be
photographed
 Purpose- present product, tell story, clarify
concept, or demonstrate a service.
Typography

15. What is a Pixel?
 Building Blocks
 # of pixels and color determine image
quality, size and the look of the image
 Cannot delete a pixel, just change its color
 More pixels, larger file size… so eliminate
unnecessary pixels
 # of pixels per inch determine resolution,
the key to image quality
Typography

16. File Formats
 High Quality for printing
TIFF- high image quality
EPS- less common
 Compression Formats for Screen
JPEG- photos and illustration
GIF- text, logos and charts
PNG- need transparency around the graphic
PDF- design intact- paper files
Typography

17. Website Requirements Gathering
 Site Owner’s goals
What do you want? A job
 Site User’s goals
What matters to that specific employer
 Human and Technical Resources
What can you do?
What can the host server do?
 Content Needed
Typography

18. What is the goal(s)?
 Owner’s Goals
 Business aspect =
Making money
 Measure the audience
 Brand Positioning =
Personality
 User’s Goals
 Information
 Commerce
 Easy
 Useable
 Identifiable
Typography

19. Defining Owner’s Goals
 How do you make money? How are they
successful?
 What are the goals for the site?
 Research size of market opportunity
 What are the competitors doing?
 Identify the user’s behaviors that will best
support the site?
 Decide on Brand Personality or Positioning
(3 key adjectives)
Typography

20. Identifying Business Goals
 Let’s use the website your group is working on.
 What would be some goals for a site?
 What is their market?
 What are the potential user behaviors?
 What are the 3 key adjectives for brand
positioning?
Typography

21. Defining User’s Goals
 Analyze the users habits and environment
 What characteristics would affect the
user’s interaction with the site?
 What is the user looking for?
 What steps are involved for the user to
perform tasks ?
Typography

22. Identifying User Goals
 Again, let’s use the website your group is
working on.
 What would be some user goals for a site?
 How would they use the site?
 What do they want from this site?
 How many steps would be acceptable to perform
a task?
Typography

23. Technical Considerations
 What tech resources do you have?
 Any technical restraints? (security,
bandwidth, etc.)
 Who will host the site?
 Is there people to maintain the site?
Typography

24. Determine cost, timeline, and tasks
 As a general rule, three variable are time,
money, and people.
 Budget is total of estimated hours for each
task at hourly rate
 Have contractors and consultant work off-
site and with own equipment, so they are
not employees
Typography

25. Project Bid
 The cover and package
 Table of contents
 Needs analysis and description
 Target audience
 Creative strategy
 Project implementation
 Budget
Typography