AESTHETICALLY
fly DIGITAL TYPEFACE DESIGN
Alexa Wellock Leah VanWettering Sean Rueter Jay Miles Katherine Forslund Katy Verbrugge Samantha Abramczyk Allison Crosbie Shanna Knueppel Sara Koller Nate Mallow Daniel Thiede Mitchell Pantzke Melissa Pfingsten Mikala Dale
University of Wisconsin-Stout Menomonie,WI
Aesthetically Fly; Digital Typeface Design
Published by School of Art and Design | Department of Design 324 Applied Arts Building University of Wisconsin-Stout Menomonie, WI 54751-0790 Visit our website at www.uwstout.edu © 2012 University of Wisconsin–Stout All rights reserved Printed, bound in U.S.A. 14 13 12 11 4 3 2 1 No part of this book may be used or reproduced in any manner without written permission from the publisher or its authors, except in the context of reviews. Every reasonable attempt has been made to identify owners of copyright. Errors or omissions will be corrected in subsequent editions. 20120120
Typography and Design
Alexa Wellock Leah VanWettering Sean Rueter Jay Miles Katherine Forslund Katy Verbrugge Samantha Abramczyk Allison Crosbie Shanna Knueppel Sara Koller Nate Mallow Daniel Thiede Mitchell Pantzke Melissa Pfingsten Mikala Dale
ART_256–001 #1182 WINTERM 2012 01.03.2012 – 01.20.2012 AESTHETICALLY FLY February 10—16, 2012 Applied Arts 209 Student Gallery Facilitated By John P. Corrigan
Student Typefaces
Print Specs
2x40, Award Cirque, Bean Pole, Black Rage, Bloated, Bright Lights, Calvin, Chad Clean, Chad Field, Chad Square Clean, Chad Square, Chad Square Stencil, Chad Stencil, Chain Link Default, Chain Link, Chroma, Cirque Characters, Cirque!, Cloud, CNCD, Divide, Graffiti, Fiddle Stix, Fine Line, George, Holey Moly, Igantor, INDI 5, InterNate Alt., InterNate Regular, InterNate Upper & Lower Set, Isolate Psyche, Jail Bird, King, Light Plaid, Linked 2, Nomadic Rambler, Plaid, Pixilated, Quartz, Quick Response, Rachella, Rage, rose, Rush, Seahorse, Shitty Nineties, Slabotuer, Slenderley Blocked, Smudged, Solid Plaid, Stair Stepper, Stinger, Tight Squeeze, Treads 3, TRON, Tron, Tumbleweeds, Virgo
Printer: Blurb.com Paper: Premium Binding: Perfect Cover: Soft Cover Size: 8.5” x 11” Standard Portrait
PAGE Introduction
7
Samantha Abramczyk
8
Allison Crosbie
18
Mikala Dale
28
Katherine Forslund
38
Shanna Knueppel
48
Sara Koller
58
Nate Mallow
68
Jay Miles
78
Mitchell Pantzke
88
Melissa Pfingsten
98
Sean Rueter
108
Daniel Thiede
118
Leah VanWettering
128
Katy Verbrugge
138
Alexa Wellock
148
Syllabi and Course Materials
158
DIGIT AL T YPEFA CE DESI G N
6
INTRO exhibition dates FEBRUARY 10 - 16 2012 APPLIED ARTS
209 STUDENT GALLERY UNIVERSITY OFWISCONSIN STOUT MENOMONIEI WI
this studio workshop explores various aspects of font design and development for creative and expressive ends. STUDIO WILL EMPHASIZE A CONCEPTUAL APPROACH TO THE DESIGN OF MODULAR TYPEFACES, FROM AN IDEATION PROCESS ROOTED IN HAND-LETTERING TO DIGITAL DEVELOPMENT USING FONTSTRUCT, A WEB-BASED FONT CREATION APPLICATION.
AESTHETICALLY FLY
Both the typographic systems and experimental typefaces presented in this publication are the direct results produced from a dedicated group of student designers from the University of Wisconsin – Stout. The work was conducted during a three week special topics studio class in January 2012. Students responded to three projects; examining the creative expression of type design. The Digital Type Design Studio was created to study the systematic methodology of typeface design. The collection of artists and designers looked at the unique history of expressive, experimental and modular typefaces in efforts to inform the design process. Students were taxed with a series of projects designed to push each of them as designers and form makers. Each project built upon one another, with each new request, the bit-depth increased allowing for more intricate design possibilities and uniquely personal design solutions. Customized letterforms are a frequently used tool which many contemporary designers use as a dynamic form of expression. Restricted systems and predefined forms are an appropriate and approachable method for building letters. Type designs began with conceptual drawings examining the experimental creation of modular letterforms. The entire type lab will be creating a digital typeface through the unique web based font creation software FontStruct. The FonStruct palette uses a dynamic library of geometric modules to build letterforms. The program provides an alphabetic matrix that produces downloadable TrueType font suitcases used in Mac or Windows applications. Creating display typefaces and using display typefaces [which you have created] are two very distinct skill sets. Over the past twenty years graphic designers have had the ability to create digital typefaces. The uniqueness of display type both requires and necessitates the ability to be used. Designers are often able to wield their own creations, but too often designs are not created for their expanded usage. Conceptually based typefaces and lettering projects are specific to their intended purpose. They exude the design principles shared by the overall project objective. For this studio, type concepts were required to be used in context. A typeface that falls in the woods, and no one is there to implement it, remains a set of unused letterforms. Each typeface created by students was required to be implemented. Students were strongly encouraged to formulate typographic concepts prior to their design
7
process and digital construction. Typefaces that were created in a specific string, or letter by letter often lacked continuity and did not function as a working typeface. On occasion, well conceived and conceptually dynamic type designs did not function or hold together as letterforms. Several highly conceptual typographic systems were explored. Often recognizable letterforms were abandoned for illustrative glyphs, dingbats, word sets or typographic flourishes. The strengths of creating illustrative forms in a typographic program is their key-stroke availability and the ability to make adjustments in line. Simple alterations such as scale, color, and repetition reveal their inherent flexibility. At the potential expense of legibility and practicality, students were encouraged to investigate conceptual form and alternate character sets. Overwhelmingly students embraced the strong geometric building blocks unique to the FonStruct tool set, resulting in the direct inspiration for geometric patterning. Students explored both the novelty and flexibility with the geometric “blocks.” The more unique concepts abandoned conventional letterforms creating alternate character sets and flexible systematic elements of design. Inherent to each design was the expression of a highly articulated visual aesthetic. Students were encouraged to use the three week studio for exploration; expanding the limits and restrictions of FontStruct, and expanding the designers perception of what letterforms, typography, and type design could represent.
DIGIT AL T YPEFA CE DESI G N
8
AESTHETICALLY FLY
Samantha Abramczyk
C LOUD
DUCK
STENCILED CURLED
9
S I AY D TO Y A D R U to O Y
spread wings
and
SO A R DIGIT AL T YPEFA CE DESI G N
10
T H R O U G H
S D U O L C
AESTHETICALLY FLY
11
NEVER
LET THE FEAR OF STRIKING OUT
KEEPYOU
FROM PLAYING
THE GAME
A U G 4TH
& 5TH
BASE BALL
TRYOUTS
DUCK K
K C
C U D
K C
DU
U D
K C
U D
DUCK DUCK K C DUCK U
K C
D
U D DIGIT AL T YPEFA CE DESI G N
12
GOOSE
DUCK
DUCK DUCK
DUCK
DUCK
AESTHETICALLY FLY
13
DUCK
S.C. STENCILED CURLED
DIGIT AL T YPEFA CE DESI G N
14
ABCDEFGHI JKLMNOPQR STUVWXYZ abcdefghi jklmnopqr stuvwxyz .,;:”!?[]()~@` #$%^&*-+=
AESTHETICALLY FLY
15
WORLD’S LARGEST CRISTIANI BROS.
CIRCUS CINCINNATI NORWOOD WATER WARKS PARK
20 JUNE 21 SAT&SUN
.
Z f 3 9 “,* e ‘ ?7
y / & 1
BN
(
V # LJ ^
_
4$
M
0
8 Ad
< < G
X 5W
U
H D
6
I
K P
S Q % `
DIGIT AL T YPEFA CE DESI G N
T
{ @ RC 16
! _ 2 = O +
AESTHETICALLY FLY
17
DIGIT AL T YPEFA CE DESI G N
18
TRON
GOOGLE IMAGES
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 1234567890 .,_?!
ABCDEF GHIJKL MNOPQRS TUVWXYZ
LE I
Q GOO
MAG
ES
GLE
IMAG
ES
BLOAT BLOATED BLOATED
Q
AESTHETICALLY FLY
21
ABCDE FGHIJ KLMNO PQRST UVWX YZ
C IR
DIGIT AL T YPEFA CE DESI G N
22
q
j
j
2
1
JOHN CORRIGAN
0
E U
j
j
j
j
j
j
j
j
j
j
“Cirque du Fleakshow”
j
23
j
j
j
AESTHETICALLY FLY
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz q 1234567890 .,”’?!@_*#$&() +-/:;<=>{\}^{|}~
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
j
edcba
j
GETTY IMAGES
DIGIT AL T YPEFA CE DESI G N
AWARD CIRQUE
24
ABCDEF GHIJKL MNOPQ RST z d 3 UV k w WX v YZ
f
a ab abc abcd abcde abcde abcde
3 w v
f
AESTHETICALLY FLY
25
Flea Key
Lowercase “Award Circus”
abcde fgh i klmn j op q rs tuvwxyz
A Pattern, Brainiac, Chick, Dwarf, Elephant, Facial Hair Frenchman, Grandpa, Hedgehog, Invisible Ice-Cream Man, Juggler, Koala, Lion, Monkey, Ninja, Octo-arms, Porcupine, Quadruple size “Q”, Ringleader, Seal, Tall Man, Unicycle, Misfit #1, Walrus, Misfit #2, RX conjoined twins, Misfit #3, Misfit #4
abcde “Cirque Characters” “a”-”o”
JOHN CORRIGAN
DIGIT AL T YPEFA CE DESI G N
26
gh ij f klmno
AESTHETICALLY FLY
27
DIGIT AL T YPEFA CE DESI G N
28
AESTHETICALLY FLY
29
VIRGO GEORGE SHITTY NINETIES FINE LINE
]]]]] [[[[[
virgo VIRGO DIGIT AL T YPEFA CE DESI G N
30
??????? !!!!!!!
AESTHETICALLY FLY
31
K k
DIGIT AL T YPEFA CE DESI G N
32
ABCDEF GHIJKL MNOPQ RSTUV WXYZ
abcdef ghijkl mnopq rstuv wxyz
GIVE ME A COLD BEER -GEORGE ABCDEFGHIJKLMNOPQRSTUVWXYZ
AESTHETICALLY FLY
35
ABCDE FGHIJK LMNOP QRSTU VWYZ
DIGIT AL T YPEFA CE DESI G N
36
NINETEEN NINETY ONE
AESTHETICALLY FLY
37
DIGIT AL T YPEFA CE DESI G N
38
AESTHETICALLY FLY
39
(BRICK IMAGE: www.humboldtrelief.com) www.psdgraphics.com
AESTHETICALLY FLY
41
DIGIT AL T YPEFA CE DESI G N
42
AESTHETICALLY FLY
43
DIGIT AL T YPEFA CE DESI G N
46
Possible Use on a Poster
AESTHETICALLY FLY
47
DIGIT AL T YPEFA CE DESI G N
48
AESTHETICALLY FLY
49
Shanna Knueppel Brick By Brick
~ Rush ~ Tight Squeeze
BRICK BY BRICK
DIGIT AL T YPEFA CE DESI G N
50
ABCDEFGHI JKLMNOPQ RSTUVWXYZ .,‘“?!:; http://perfecthue.com/project/snow_falling_2
AESTHETICALLY FLY
51
MISSING SOMEONE ISN’T ABOUT HOW LONG ITS BEEN SINCE YOU’VE SEEN THEM LAST OR THE AMOUNT OF TIME SINCE YOU’VE TALKED, IT’S ABOUT THE VERY MOMENT WHEN YOU’RE DOING SOMETHING AND YOU WISH THEY WERE RIGHT THERE WITH YOU.
RuSh
DIGIT AL T YPEFA CE DESI G N
52
ABCDEFG HIJKLMNO PQRSTUV WXYZ aHiMNOQTUvWy http://www.betterphoto.com/gallery/dynoGallDetailasp?photoID=6536723&catID=28270
AESTHETICALLY FLY
53
HALF OUR LIFE IS SPENT TRYING TO FIND SOMETHING TO DO WITH THE TIME WE HAVE RUSHED THROUGH LIFE TRYING TO SAVE WiLL ROGERS
Tight Squeeze ABCDEFGHI JKLMNOPQR STUVWXYZ DIGIT AL T YPEFA CE DESI G N
54
abcdefghijklm nopqrstuvwxyz 0123456789
. , “ ” ‘ ’ ” ’ ? ! @ _*#$ % & ( ) +-/:;<=>[]\^`{|} http://gawker.com/5658407/this-tunnel-goes-down-down-to-the-devil
AESTHETICALLY FLY
55
Tight Squeeze 12 pt
Tight Squeeze 14 pt
Tight Squeeze 18 pt
Tight Squeeze 24 pt
Tight Squeeze 30 pt
Tight Squeeze 36 pt
Tight Squeeze 48 pt
Tight Squeeze 60pt
Tight Squeeze 72 pt
DIGIT AL T YPEFA CE DESI G N
56
never never never give up
AESTHETICALLY FLY
57
DIGIT AL T YPEFA CE DESI G N
58
AESTHETICALLY FLY
59
/LINKED\ /treads\ /LINKED\ /treads\ /LINKED\ /treads\ /LINKED\ /treads\ /treads\ /LINKED\ /treads\ /LINKED\ /treads\ /LINKED\ /treads\ /LINKED\ SARA KOLLER
/LINKED\ /ABCDE FGHIJK LMNOPQ RSTUVW XYZ\ /12345 67890\
/\.^, *!|? ~"'“ ”‘’( ){}[ ]+-: ;=`_%
AESTHETICALLY FLY
61
/**WE ARE **\ /**ETERNALLY \ /*LINKED NOT \ /JUST TO EACH \ /**OTHER BUT*\ /***OUR ***\ /*ENVIRONMENT^\ /HERBIE HANCOCK\
/LINKED\
DIGIT AL T YPEFA CE DESI G N
62
HOW TO MAKE LETTER COMBINATIONS
WANT
PRESS
WANT
PRESS
LINK /LINK LINK\ LINK. LINK^ LINK, LINK LINK* LINK! LINK| LINK? LINK~ LINK" LINK' LINK“ LINK”
LETTERS WITH NO ATTACHMENTS
LINK‘ LINK’ LINK( LINK) LINK{ LINK} LINK[ LINK] LINK+ LINKLINK: LINK; LINK= LINK` LINK_ LINK%
LEFT SINGLE QUOTATION MARK
SOLIDUS REVERSE SOLIDUS FULL STOP CIRCUMFLEX ACCENT COMMA SPACE ASTERISK EXCLAMATION MARK VERTICAL LINE QUESTION MARK TILDE QUOTATION MARK LEFT DOUBLE APOSTROPHE QUOTATION MARK RIGHT DOUBLE
QUOTATION MARK
RIGHT SINGLE QUOTATION MARK LEFT PARENTHESIS RIGHT PARENTHESIS LEFT CURLY BRACKET RIGHT CURLY BRACKET LEFT SQUARE BRACKET RIGHT SQUARE BRACKET PLUS SIGN MINUS SIGN COLON SEMICOLON EQUALS SIGN GRAVE ACCENT LOW LINE PERCENT SIGN
/treads\ /abcde fghijk lmnopq rstuvw xyz\ /12345 67890\
/\.&> <#!|? ~"'“ ”‘’( ){}[ ]+-: ;=`%
DIGIT AL T YPEFA CE DESI G N
64
/beauty><like<ice><\ /#our footing does \ /#betray; who can \ /tread sure on the \ /#smooth> slippery \ /way: pleased with \ /#the surface> we \ /glide swiftly on> \ /and see the dangers\ /that we cannot shun. /john<dryden\
AESTHETICALLY FLY
/treads\
65
HOW TO MAKE LETTER COMBINATIONS
WANT
PRESS
WANT
PRESS
tread /tread tread\ tread. tread$ tread% tread< tread# tread! tread| tread? tread~ tread" tread' tread“ tread”
LETTERS WITH NO ATTACHMENTS
tread‘ tread’ tread( tread) tread{ tread} tread[ tread] tread+ treadtread: tread; tread= tread` tread%
LEFT SINGLE QUOTATION MARK
SOLIDUS REVERSE SOLIDUS FULL STOP DOLLAR SIGN PERCENT SIGN SPACE NUMBER SIGN EXCLAMATION MARK VERTICAL LINE QUESTION MARK TILDE QUOTATION MARK APOSTROPHE QUOTATION MARK LEFT DOUBLE QUOTATION MARK RIGHT DOUBLE
RIGHT SINGLE QUOTATION MARK LEFT PARENTHESIS RIGHT PARENTHESIS LEFT CURLY BRACKET RIGHT CURLY BRACKET LEFT SQUARE BRACKET RIGHT SQUARE BRACKET PLUS SIGN MINUS SIGN COLON SEMICOLON EQUALS SIGN GRAVE ACCENT PERCENT SIGN
/LINKED 12 PTS. /treads 12 pts.
/LINKED 14 PTS. /treads 14 pts.
/LINKED 18 PTS. /treads 18 pts.
/LINKED 24 PTS. /treads 24 pts.
/LINKED 30 PTS. /treads 30 pts.
/LINKED 36 PTS. /treads 36 pts.
DIGIT AL T YPEFA CE DESI G N
66
/LINKED 48 PTS. /treads 48 pts.
/LINKED 60 PTS. /treads 60 pts.
AESTHETICALLY FLY
67
DIGIT AL T YPEFA CE DESI G N
68
AESTHETICALLY FLY
69
STINGER DIGIT AL T YPEFA CE DESI G N
70
ABCDEF GHIJKLM NOPQRS TUVWXYZ
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.
abcdef ghijklm nopqrstu vwxyz
the quick brown fox jumps over the lazy dog.
STINGER
AESTHETICALLY FLY
71
Stinger is a typeface with a character set of upper and lower case. Using rounded shapes with varying thickness Stingerâ&#x20AC;&#x2122;s serifs are ended quickly to create that sharp end. Much to parallel sharp ends found on wild animals giving Stinger its namesake. These points are further extrapolated in the use of the void within each letter.
ChAINlinK
DIGIT AL T YPEFA CE DESI G N
72
ABCDE FGHIJ KLMNOP QRSTU WXYZ abcde fGhij klmnop qrstu vwxyz
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG the quick brown fox jumps over the lazy dog
AESTHETICALLY FLY
73
Chainlink is a paired set of capitals that furthers the concept of modular design and patterning by being a typset composed of only one shape. Beyond that each letter overlaps with eachother in sequential order. however with the preset patterning of every other letter would not Overlap . this was resolved by creating a secondary set within the lowercase with a modified pattern. thus allowing OVErLap in any situation .
INTERNATE
DIGIT AL T YPEFA CE DESI G N
74
ABCDEF GHIJKL MNOPQR STUVW XYZ abcdef ghijkl m nopq Rstuv wxyz
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG. the quick brown fox jum ps over the lazy dog.
12334
!@#$%^&*() _+-={}[]| \:;”’<>,. ?/
56890
INTERNATE REGULAR
AESTHETICALLY FLY
75
ABCDE FGHIJKLM NOPQRST UVWXYZ abcdefghij klmnopqrst uvwxyz
THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG.
12334 56890
!@#$%^&*()_+-={}[]| \:;”’<>,.?/
the quick brown fox jumps over the lazy dog.
Internate is a typeface family based upon an existing project. Pushing the concepts of legibility and the letterform itself by establishing a set of criteria to follow. The most notable being that the entire typeface family utilizes the same set of premade forms. As part of the rules for INTERNATE, each letterform MUST use each piece ATLEAST once. Capitals being able to use one of the pieces an unlimited amount of times in addition to using all of the parts. Lower case may use a part only one additional time. Further more, the only shape that may be manipulated is the vertical rectangle. DIGIT AL T YPEFA CE DESI G N
76
INTERNATE REGULAR, however, is a typeface made purely to examine how the letterform would interact with itself with no restrictions on the usage of the parts and pieces.
AESTHETICALLY FLY
77
DIGIT AL T YPEFA CE DESI G N
78
AESTHETICALLY FLY
CHAD type
79
//////////////////////////////////// ////////////////////////////////////
the 600(six-hundred) rulebetween refers to the inverse relationship the focal length of the lens and the duration of the exposure. the shorter the focal length of the lens, the longer the exposure can be without producing trails. //////////////////////////////////// / / x=FOCAL / LENGTH / / y=EXPOSURE / TIME / / / ////////////////////////////////////
xXy=600
depending onexposure availible equipment, the highest time youâ&#x20AC;&#x2122;ll be able to achieve without a cable release will be 30(thiry) seconds.
//////////////////////////////////// / / x=FOCAL / LENGTH / / y=EXPOSURE / TIME / / / ////////////////////////////////////
xXy=600
DIGIT AL T YPEFA CE DESI G N
80
with an exposure duration of 30 seconds, the optimal focal length will be 20MM.
//////////////////////////////////// ////////////////////////////////////
WEEK
!
JAY_MILES
AESTHETICALLY FLY
TWO BY FORTY
81
’ ’ ’ ’ ’ ’ ’ ’ ’ ’ ’ ’ ’ The human ey se s with the same A wide angle lens, which wil DIGIT AL T YPEFA CE DESI G N
82
angle of view as a 50m lens on us al y have a focal ength les 35m film. The area of an image than 24m , wil distort an image. that a lens can capture dep nds on the focal ength of the lens.
WEEK
@
A N G L E O F V I E W ’’’’’’’’’’’’’ JAY_MILES
AESTHETICALLY FLY
83
cncd
PHOTO_BY_NOELLE_HEINRICY
pix C c ELS UPPERCASE
lowercase
picture elements
======================================================================================= ======================================================================================= Pixels make up the area of a digital display, as well as image sensors. A megapixel, which can be abbreviated as (MP) , consists of 1 MILLION pixels. In digital photography, a megapixel refers to the number of elements that a sensor contains rather than its display or the resolution of the images it produces. ====================================================================================== Pixels are not the smallest component of a digital image. In displays, a pixel can be broken down into subpixels, which can be manipulated to produce more accurate images. Not only can pixels be broken down into subpixels, pixels aren’t always square. They can also be circles or lines. ======================================================================================= ======================================================================================= DIGIT AL T YPEFA CE DESI G N
84
ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789,./;’[]\-=!@#$%^&*()_+<>?:”{}| abcdefghijklmnopqrstuvwxyz
WEEK
#
JAY_MILES
AESTHETICALLY FLY
QUICK RESPONSE
85
abcdefghijklm nopqrstuvwxyz nopqrstuvwxy wxy 0 0123456789~ 9~ ,./; []\-=
abcdefghijklm nopqrstuvwxyz nopqrstuvwxy wxy 0 0123456789~ 9~ ,./; []\-=
DIGIT AL T YPEFA CE DESI G N
86
WEEK
#
JAY_MILES
AESTHETICALLY FLY
87
DIGIT AL T YPEFA CE DESI G N
88
SLEND SLEND
GG
AESTHETICALLY FLY
89
Student Typefaces
AESTHETICALLY FLY
91
The
second type face I created shared re-
ally NO similarities to the first font, and that was the goal. I wanted to create a real bold structured font with some valuable detail. Tho font I created resembled pop culture graffiti so that is why I named it
GRAFFITI.
Plus it carried a
real 80â&#x20AC;&#x2122;s like vibe so it only made sense to re-create a mock 80â&#x20AC;&#x2122;s vinyl cover.
Throughout
my design career I have been real inspired with companies like Volcom, Bur-
ton, and Billabong. Something all three of these companies share is a real creative way of advertising their merchandise. Whether it be clothing, extreme sport items, or magazine ads. No matter what circumstance they always seem to catch any viewers eye due to the color selection and overall layout. The ad below is for a made up ski company I created. The name of the company is
JING,
and I went with a real winter vibe approach.
Another
font design I came up with revolved around power. I wanted to create a font that sug-
gested a bold, structured, and geometric interface. considering its called
KING within
When
KING.
the sports world.
designing a type face,
I feel like one of the hardest concepts is deciding whther you want to design a play font for self grattitude, or a font to play off an image, or be used with an image. The first font I designed was strictly for its font like structure and intended to have no images implied with it. However, due to its bubbly like features, and rounded serifs I felt like the aqua man had some relation. Therefore I used him as a poster boy to portray my
SLENDERLY BLOCKED
font.
The font name suggests the almighty as well
For the ad, I wanted to use a very stereotypical media portrayed
AESTHETICALLY FLY
93
AESTHETICALLY FLY
95
DIGIT AL T YPEFA CE DESI G N
96
AESTHETICALLY FLY
97
DIGIT AL T YPEFA CE DESI G N
98
AESTHETICALLY FLY
99
THREE WEEKS IN PARADISE A collection of the works created in Digital Typeface Design
Winterm 2012
Developed by:
MELISSA PFINGSTEN Graphic Design
DAY ONE
Get acquainted with this new fangled type design program and make something cool. Grid size 10 x 10. By the end of the week create a set of characters. Dubbed “Sheet Metal”
A ABCDEFGHJKLM NOPQRSTVWXYZ
DIGIT AL T YPEFA CE DESI G N
100
AESTHETICALLY FLY
101
FRACTICAL
Name given to font number two. Challenge: To make a font using a bigger bit-depth. Fractical is taller and narrower than the first typeface created. It explored the combination of a bold display face with fading halftones along the serifs. Total time - FIVE DAYS
A A IS
ABCDEFGHIJLM NOPQRSTVWXY
FOR ABDUCTION
The final font designed with this program is not really a font at all, but rather a set of 26 words exemplifying the possibilities of halftones within Fontstruct. Each word begins with the corresponding letter of the alphabet; A-Z in all itâ&#x20AC;&#x2122;s glory. Total time - TEN DAYS
DIGIT AL T YPEFA CE DESI G N
BGE
HOQ
102
I P
N Q X T V C J
I P
AESTHETICALLY FLY
103
DIGIT AL T YPEFA CE DESI G N
D K
104
R U L
DY MZ AESTHETICALLY FLY
105
W S
I THINK IT’S RATHER DIFFICuLT TO CREATE A NEW TYPEFACE DESIGN, OR FOR THAT MATTER, TO CREATE A NEW ANYTHING THAT’S IN EVERYDAY uSE. A NEW PIECE OF MUSIC WOULD PARALLEL THE CREATION OF A NEW TYPEFACE FOR EXAMPLE, THE NOTES OF MuSIC DON’T CHANGE, AND THE LETTERS OF THE ALPHABET DON’T CHANGE, EITHER. IT’S A MATTER OF HOW THEY’ ARE PuT TOGETHER. THE MOST IMPORTANT FEATuRE MuST BE THAT ITS NEWNESS HAS A REFLECTION ALL ITS OWN AND FITS INTO THE PATTERN OF TODAY’S GENERATION OF GRAPHIC DESIGNERS. THE NEW CREATION MuST HAVE SOMETHING IN ITS CHARACTER THAT MAKES THE POTENTIAL uSER SIT uP AND TAKE NOTICE. THESE TYPOGRAPHIC TRAITS COuLD CREATE A POPuLAR DEMAND
BuT WE MuST ALSO CONSIDER THAT THIS POPuLARITY MAY ONLY BE TEMPORARY.
DIGIT AL T YPEFA CE DESI G N
106
PERSONALLY I DON’T THINK THERE’S ANYTHING WRONG WITH THAT.
I KNOW WE ALL FEEL OuR DESIGNS WILL LAST FOREVER, BuT SOME THINGS LIKE MuSIC DON’T LAST EITHER. IT’S LIKE “HERE TODAY AND FORGOTTEN TOMORROW.”
ANYWAY, YOu AND I CAN BE SuRE OF ONE THING
THE NUMBER OF TYPEFACES WILL SURELY INCREASE -ED BENGUIAT, AS qUoTED IN U&LC
AESTHETICALLY FLY
107
DIGIT AL T YPEFA CE DESI G N
108
AESTHETICALLY FLY
109
DIGITAL TYPEFACE DESIGN FONTSTRUCTED IN
fontstruct
SLABO TUER
AESTHETICALLY FLY
!@#$%^&()_ -+=[]:;"',.?
111
DIGIT AL T YPEFA CE DESI G N
112
AESTHETICALLY FLY
THIS EXPERIMENTAL TYPEFACE IS NOT AVAILABLE FOR DOWNLOAD. THIS EXPERIMENTAL TYPEFACE IS NOT AVAILABLE FOR DOWNLOAD.
113
DIGIT AL T YPEFA CE DESI G N
114
AESTHETICALLY FLY
115
DIGIT AL T YPEFA CE DESI G N
116
AESTHETICALLY FLY
117
DIGIT AL T YPEFA CE DESI G N
118
AESTHETICALLY FLY
119
DIGIT AL T YPEFA CE DESI G N
120
AESTHETICALLY FLY
NOMADIC RAMBLER
121
ABCDE FGHIJ KLMNO PQRST UVWXYZ NOMADIC RAMBLER - 112 pt
A C A C A C A C A C A C A C A
ABABABABABAB E E E CDCDCDCDCDCD ABABABABABAB G CDCDCDCDCDCD ABABABABABAB E E CDCDCDCDCDCD E E E G ABABABABABAB CDCDCDCDCDCD G E E ABABABABABAB E CDCDCDCDCDCD E E E ABABABABABAB G CDCDCDCDCDCD ABABABABABAB G CDCDCDCDCDCD E F E ABABABABABAB AESTHETICALLY FLY
Tumbleweeds - 72pt
123
DIGIT AL T YPEFA CE DESI G N
124
ABCDE ISOLATE PSYCHE 62 pt
AESTHETICALLY FLY
FGHIJ ISOLATE PSYCHE 62 pt
125
DIGIT AL T YPEFA CE DESI G N
126
KLMNO ISOLATE PSYCHE 62 pt
AESTHETICALLY FLY
127
DIGIT AL T YPEFA CE DESI G N
128
O
o
O
o
O
AESTHETICALLY FLY
m r
129
B bright lights
HOLEYMOLY
smudged a collection of typefaces by Leah VanWettering
xA s
H
O O O O O
HOLEYMOLY ABCDEFGHIJKLM NOPQRSTUVWXYZ
0123456789 .,'?!
DIGIT AL T YPEFA CE DESI G N
S 130
D
M Y
L
I
V
B
Q
AESTHETICALLY FLY
O
131
R
E
P MESSAGE C
H
A
P
T
E
R
PILE DRILL ED
E L E P H A N T SMASHING UNREAD SYMBOL
O O O O O
ooooo
bright lights abcdefghijklm nopqrstuvwxyz
q r
DIGIT AL T YPEFA CE DESI G N
132
a
e
b
t
a
f w p d u k AESTHETICALLY FLY
133
building chapter seventeen
once upon a time in a faraway land
connections iwasaheavyhearttocarry o ooooo
b
u q
smudged j f
r
ABCDEFGHIJKLMNOPQRSTUVWXYZ a b c def ghijkl m nopqrst uvwxyz
0123456789 .,““‘‘““?!@_*#$%&() +=-/:;<=>[\]^`{|}~
DIGIT AL T YPEFA CE DESI G N
134
o o ooo
ooooo
AESTHETICALLY FLY
135
ridiculous
exact d y
w mysterye c o m m u n i c a t i o n
m i s t a k e i think we’ve got it.
g
DIGIT AL T YPEFA CE DESI G N
t
136
Q
s
A
l
O
D
N
f
O
o
O
O
AESTHETICALLY FLY
137
DIGIT AL T YPEFA CE DESI G N
138
DIGIT AL T YPEFA CE DESI G N
140
DIGIT AL T YPEFA CE DESI G N
142
AESTHETICALLY FLY
143
DIGIT AL T YPEFA CE DESI G N
144
DIGIT AL T YPEFA CE DESI G N
146
AESTHETICALLY FLY
147
DIGIT AL T YPEFA CE DESI G N
148
AESTHETICALLY FLY
149
}
FIDDLESTIX
BEAN POLE
PIPE CLEAERS
J DIGIT AL T YPEFA CE DESI G N
150
0721
. . . . . . . . . . . . . .
0721
. . . . . . .
0721
1211
0625
1018
0721
1211
0625
1018
1211
0625
1018
0721
1211
0625
1018
1211
0625
1018
0721
1211
0625
1018
F FI FID FIDD FIDDLE FIDDLES FIDDLEST FIDDLESTI FIDDLESTIX
ABCDEFGHIJKLM NOPQRSTUVWXYZ
AESTHETICALLY FLY
151
SHITAKI MUSHROOMS DAGNABBIT
YOU LINT LICKER I AM GONNA KICK YOUR ASTRONAUT
0 1 2 3 4 5 6 7 8 9
WHAT THE FRENCH TOAST
#
DIGIT AL T YPEFA CE DESI G N
A A A A
152
F EL
PR A N G
I
O
B
BEAN BEAN POLE POLE
MY CAPS LOCK BUTTON IS STUCK.
DIGIT AL T YPEFA CE DESI G N
154
my caps lock button won’t work.
HETAIJQ LADGMN ALSDKF IGALMSD KGLHIQR LAKDAPI JWLPZE WOPRZX AJWDWA NADAXJ HWOLRC GPWMZT EJSQAZ
jokelakd pqimbrac hgnbceq diglzkqw kaielnst socxzw bdithslk dptmvzn huiqajcf onmeidw sqiabzod expociea pqgjhtr
AESTHETICALLY FLY
155
ONOMATOPOEIA
ZipYowzaBoomSlashPowYea SlurpWeeBuzzSplatThwack PowBamFlipWhamChompGag
ONOMATOPOEIA
KerplunkFwizzSwooshPlop GloopBoingYankGulpWhisk UghClangBAZINGABlamThud
!
ONOMATOPOEIA
ABCD EFGH IJKL MNOP QRST UVWX YZ 1234567890 _)(*&^%$#@!~-= +`:;”’.,[]{}|?></\
DIGIT AL T YPEFA CE DESI G N
abcd 156 efgh ijkl mnop qrst uvwx yz
AESTHETICALLY FLY
157
DIGIT AL T YPEFA CE DESI G N
158
AESTHETICALLY FLY
159
question: how can you push the medium of fontstruct? what creates a unique “letterform”? how much does an “a” have to resemble a letter ‘a’? what is unexpected, contemporary or ‘new fangled’? can you develop a new media, process, technique, or unique approach to fontstruct? Studio objectives • Apply type and lettering principles to the creation of typographic letterforms. • Develop critical thinking skills related to contemporary uses of digital font creation. • Understanding conventional structures within traditional letterforms • Encourage typographers to create strong design concepts off-line, and confidently transfer their ideas into digital solutions • Develop concepts for using the “kit of parts” or designated modules to create innovative letterforms • Understand FontStruct toolsets [blocks] to actualize their type designs • Apply intermediate digital techniques developing letterforms within the restrictions offered by FontStruct • Develop concepts to promote and use their type creations in an innovative way
Typeface Design FontStruct and other applications allow designers to create functional fonts that work seemlessly with standard software programs such as InDesign, Illustrator, and Photoshop. The first step in designing a typeface is to define a basic concept. Will the letters be serif or sans serif? Will they be modular or organic? Will you construct them geometrically or base them on handwriting? Will you use them for display or for text? Will you work with historic source material or invent the characters more or less from scratch? The next step is to create drawings. Some designers start with pencil before working digitally, while others build their letterforms directly with font development software. Producing a complete typeface is an enormous task. However, for people with a knack for drawing letterforms, the process is hugely rewarding.
5
6
12
12
5:6
7
SQUARE: 10-x-10 12:12 9
5
12
12
7:9
CIRCLE: 9-x-9
6
GRID: 1.0” UNITS: 6
7
12:12
PROJECT: 1 LETTERFORM: Type prototype
9
160
DIGIT AL T YPEFA CE DESI G N
RID: 1.0” NITS: 6
Develop two concepts for fonts whose forms relate to both a 10-x-10 grid of squares and a 9-x-9 grid of circles (template sheet provided.) Each unit in the grid must be either “on” or “off.” You have no curves or true diagonals. Start by tracing or pencilling on the dot sheets provided or graph paper before starting work on the computer. Represent the letters A, B, C, P, Q, R, H, and M in capitals only. Consider proportion, weight, and structural features such as height of cross bars, how elements end, how to accommodate curves and diagonals within the grid of squares, etc. You may need to create several variations to each of the letterforms to get a well defined series of shapes. Give each your typefaces a name. Export all Illustrator files as a PDF.
AESTHETICALLY FLY
161
PROJECT: 2 INCREASED BIT DEPTH Develop a concept which examines an increased bit depth to create and develop your letterforms. A larger bit depth allows the possibility for greater detail. The increased detail allows the possibility for illustrative line work, the creation of a half tone, or complex patterning. Process: 1. Begin your concepts on grid paper; use a larger drawing tool if necessary. 2. Draw a large stroke that cover multiple units. Refine each letterform as needed. 3. Translate your refined sketch to FontStruct. Refine, embellish and alter letterforms strokes, blocks/units. Refine each letterform as needed. 4. Use the extra bit depth to create minute details that may be unseen at low resolutions, or may present themselves with larger applications 5. Examine the potential of: a) b) c) d) e) f)
Large brush strokes Half-tones or bit map photography Textures Images Illustrations Patterns
Methodology • Letterforms must contain a minimum of 30 — 50 units (either width or height) (for example: a bit ratio of 30:50, 25:50, 50:50) • You must create a minimum of 26 characters/letterforms (you may create more if you wish) You do not need to create a full alphabet or series of letterforms.
Project Two Amendments The current project brief is being altered to accommodate many of our needs and requests. Plan on presenting a 4—6 letter (in length) word with the larger bit depth letterform concepts. Your word MAY NOT use repeating letterforms. NO: toto, tutu, onto, or BOGO If your concept allows more letterforms; by all means continue. I suggest you examine a concept or method that allows you to create more diverse letterforms more quickly. Look at broader concepts such as half-tone or patterning.
KLAVIKA (Process Type Foundry) BASIC ALPHABET (FontStruct Character Set) ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 .,""''""?!@_*#$%&()+=-/:;<=>[\]^`{|}~ HHDHOHODOO Control String
12/14
I think it’s rather difficult to create a new typeface design, or for that matter, to create a new anything that’s in everyday use. A new piece of music would parallel the creation of a new typeface. 18/24
I think it’s rather difficult to create a new typeface design, or for that matter, to create a new anything that’s in everyday use. A new piece of music would parallel the creation of a new typeface. For example, the notes of music don’t change, and the letters of the alpha-bet don’t change, either. It’s a matter of how they’re put together. The most important feature must be that its newness has a reflection all its own and fits into the pattern of today’s generation of graphic designers. The new creation must have something in its character that makes the potential user sit up and take notice. These typographic traits
I think it’s rather difficult to create a new typeface design, or for that matter, to create a new anything that’s in everyday use. A new piece of music would parallel the creation of a new typeface. For example, the notes of music don’t change, and the
I think it’s rather difficult to create a new typeface design, or for that matter, to create a new anything that’s in everyday use. A new piece of music would parallel the creation of a new typeface. For example, the notes of music don’t change, and the letters of
6/9
10/12
12/14
PROJECT: 3 TYPEFACE CONCEPT & DESIGN
DIGIT AL T YPEFA CE DESI G N
162
Develop a concept for a typeface or type family of your creation. The single restriction is that it must be a full typeface using every character that FontStruct offers. (See above character set) Process: 1. Begin your concepts on grid paper; use a larger drawing tool if necessary. 2. Translate your refined sketches to FontStruct.
Methodology • Create a typeface and/or type family • Examine both UPPER and lowercase character sets • Consider how you may use the typeface in the future • Examine the potential audience and how they may use, or abuse it. • Make your typeface an expression of you and your personal design sensibilities Artifact 1. Digital Typeface/Family
3. Refine, embellish and alter letterforms strokes, blocks/units.
2. JPEG file used as example file FontStruct.
4. Create a full character set; A–Z, a–z, 1–0, and a full punctuation set
3. Expansive and inclusive typeface promotional piece; utilizing the full demo text sampling provided. (PDF Files) File: 12_UWS_DTD_FULL_demo_text.rtf (on R2•D2)
5. Examine the potential of: a) Brush strokes b) Half-tones or bit-maps c) Modular Letterform using a limited set of repeated design elements d) Dingbats e) Icons f) Kit-of-Parts g) Patterning
4. Exhibition Materials (Date TBD) • Exhibition Poster • Postcard • Exhibition Graphics • Window Display • Exhibition Catalog (specifics TBD) • DTD Type Foundry Bog (?) Digital samples, downloads, link to FontStruct, designer bios.
AESTHETICALLY FLY
163
Bibliography Lupton, Ellen. Thinking With Type, Second Edition. New York, Princeton Architectural Press. 2009. Willen, Bruce and Strals, Nolen. Lettering & Type: Creating Letters and Designing Typefaces. New York, Princeton Architectural Press. 2009. Rivers, Charlotte. Hand Made Type Workshop: Tips, tools & techniques for creating custom typography Cincinnati, OH, HOW Books. 2011. Bringhurst, Robert. The Elements of Typographic Style. Carter, Rob. Typographic Design: Form and Communication, 4th edition. www.fontstruct.com
Posted Interview http://fontstruct.com/news/2011/02/12/ interview-with-uwe/
FontStruct is a free online font-building tool, devised and developed for FontShop International by Rob Meek. The heart of FontStruct is the FontStructor, a web-application that lets anyone quickly and easily build fonts using basic geometric shapes in a grid
Lupton, Ellen. Thinking with Type. Rüder, Emil. Typography As Communication and Form. Rüder, Emil. Typography: a manual of design.
UWE “Communicating with Words” module at The University of the West of England, Bristol, UK. Module lead by Gabriel Solomons and John Paul Dowling.
— just like tiles or bricks. Fonts created
Spiekerman, Erik, and E.M. Ginger. Stop Stealing Sheep & Find Out How Type Works. Weingart, Wolfgang. Typography. Heller, Stephen; Ed. The Education of a Typographer. Müller-Brockmann, Josef. Grid Systems In Graphic Design.
with the FontStructor are called FontStructions. They can be downloaded as TrueType fonts and used in Mac or
Elam, Kimberly. Grid Systems.
Windows applications.
Drucker, Johanna. The Visible Word: Experimental Typography And Modern Art, 1909-1923.
More than a tool, FontStruct is a vibrant online type-design community.
Heller, Steven and Philip B. Meggs, eds. Texts On Type: Critical Writings On Typography.
Type-design enthusiasts from all over the world use the FontStructor to
Lupton, Ellen. Mixing Messages: Graphic Design in Contemporary Culture.
experiment with letter shapes and to design fonts, and who give each other comments online on the FontStruct
Armstrong, Hellen. Graphic Design Theory: Readings From the Field. Princeton Architectural Press, New York, NY. 2009.
website. They are the FontStructors, the soul of FontStruct. For non-FontStructors, FontStruct is a
Lupton, Ellen; Jennifer Cole Phillips. Graphic Design: The New Basics.
source of fresh fonts available under flexible, liberal CreativeCommons
Heller, Stephen; Ed. The Education of a Graphic Designer, 2nd Edition.
licenses.
Kit-of-parts Theory refers to the study and application of object-oriented building techniques, where building components are pre-designed / pre-engineered / pre-fabricated for inclusion in joint-based (linear element), panelbased (planar element), module-based (solid element), and deployable (time element) construction systems. —Wikipedia
Leslie, Jeremy; Blackwell, Lewis. Issues: New Magazine Design. Ginko Press. 2000.
DIGITAL TYPEFACE DESIGN