Texture and typography
Upcoming SlideShare
Loading in...5
×
 

Texture and typography

on

  • 185 views

Texture and typography in web design

Texture and typography in web design

Statistics

Views

Total Views
185
Views on SlideShare
156
Embed Views
29

Actions

Likes
0
Downloads
0
Comments
0

2 Embeds 29

http://steventking.com 15
http://www.slideee.com 14

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Texture and typography Texture and typography Presentation Transcript

  • Texture Gives a distinctive appearance or feel to the surface of a design I I M M J187 Introduction to Interactive Multimedia
  • Lines provide movement …
  • and meaning
  • Literal line
  • Implied line Imaginary line you create by connecting the dots or elements together
  • Psychic line Imaginary line used to for direction from one element to another
  • Contour line Defines edges and creates boundaries
  • Dividing line Divides content
  • Decorative line Adds texture, depth, shading, or function to an element This is a link!
  • Examples of texture in web design
  • Examples of texture in web design
  • Examples of texture in web design
  • Examples of texture in web design We make the web a better place, executing dashing design and gallant technology.
  • Typography It’s not just the font style! I I M M J187 Introduction to Interactive Multimedia
  • The goal: Readability Type has multiple purposes but the most important is readability: The ability for a reader to easily read and understand the text. Contributors/Distractors Size, color, texture, light, font, weight, relationship etc.
  • Form Kerning Leading
  • Type relationships
  • Concordant Uses one type family with little change in style, size or weight. Communicates a formal situation but can be dull.
  • Conflicting  Combining type faces that are similar but not the same  Makes the page less interesting because it is not concordant Times New Roman Palatino &
  • Contrasting Combining separate typefaces that are distinct and different from each other. The best designs have contrast and this includes font.
  • Type Categories Remember them in groups of two: Old/Modern, Serif/Sans, Script/Decorative
  • Oldstyle Based on hard lettering
  • Modern Often thin
  • Slab Serif Great readability
  • Sans Serif No thick-to-thin transitions
  • Script Like calligraphy or brush strokes
  • Decorative Use sparingly!
  • My Rules Always be intentional about choosing fonts Don’t use more than three fonts; two is probably enough Never use more than one decorative font and only in limited doses Typically, I choose one serif, one sans serif and call it a style
  • Fun  Papyruswatch.com  Dafont.com  What the Font  Adobe’s font style chart
  • Project 1 Wireframes and color comprehensive layouts Assignment: Website redesign
  • Type exercise  Download type.ai assignment from class website
  • For tomorrow  Choose font styles you are considering for project 1  Consider headlines, body copy, and logo  Read Beautiful Web Design Ch. 1 (layout)  Finish type assignment