GMU:Wild Type/Part1

From Medien Wiki
< GMU:Wild Type
Revision as of 14:48, 27 October 2015 by Ms (talk | contribs) (embed image)

From Point to Line to Letter

Font Representation

Fonts can be represented as

  • Raster Graphics or Pixel Graphics
  • Vector-Graphics
    • Outlines or Midlines
    • Curves or Line Segments
    • Circular Arcs or Bezier-Curves

What are the pros and cons of the various representations?

Parametric Letters

Letter J example

  • This is an example of a parametric `J` for Processing 3.0.
  • It uses midlines rather than the outlines to represent the letter
  • `tweak` the sketch to play with the parameters.

Screenshot

Wild-type-screenshot-1.png

Source Code

Here is the source for our little "J" example.

You can also find it here and in the Wild Type Class Room OpenProcessing.


////////////////////////////////////////////////////////
//                                                    //
//          P A R A M E T R I C   >> J <<             //
//                                                    //
////////////////////////////////////////////////////////
 
// This is a really simple example of parametric type design.
 
// HOMEWORK:
// Create your own parametric letter
 
void setup() {
  size(400, 400);
  noFill();
}
  
void draw() {
  
  int gap = 60;
  int pos = 250;
  int maxheight = 320;
  int thickness = 20;
  int dx = 120;
  int dy = 120;
  
  background(0);
  stroke(255);
  strokeWeight(thickness);
  line(pos, gap, pos, maxheight - gap);
  arc(pos - dx/2, maxheight - gap, dx, dy, 0, PI);
  
}

Examples

Homework

  1. Pick a letter from the alphabet and create your own parametric letter
  2. Upload the sketch to OpenProcessing and add it to our class room
  3. Add a screen shot to your wild-type wiki user page for this course

Links