1968
1.
Computer Graphic without a Screen
The term computer graphics was first used in the 1960's by William Fetter, a graphic designer for Boeing Aircraft Co.
Computer images were created from plotting points on a mathematical field without the advantage of a screen.
2.
The Screen
The CRT (Cathode Ray Tube) allowed for visualization of data. At first the screen was one color and display was a very crude bit map image. The first bit maps were vertical, but later square pixels improved screen clarity. All commands were input by keyboard until the advent of the GUI, Graphic User Interface.
3.
GUI & WYSIWYG
The Graphical User Interface (or GUI pronounced "gooey) uses pictures rather than just words to represent the input and output of a program.
A GUI allows the user to control a program via the use of icons, buttons and pointers.
1981 the first consumer GUI was made available and was the inspiration for the Macintosh which followed in 1983 at a cost of $9,950. ($20,000 in 2008 dollars).
WYSIWYG is an acronym for What You See Is What You Get screen content appears very similar to the final product.
4.
Digital Type is Born
In 1965, Dr. Ing. Rudolf Hell introduced the Digiset typesetting system. It was the first device to produce characters on a CRT entirely from digital masters. By the 1970's phototypesetting was replaced by stored information which was set as a series of small dots or closely spaced vertical lines that appeared solid in the finished product. The output speed was 1,000 to 10,000 characters per second.
DigiGrotesk was the first digital type font and was designed in 1968 by the Hell Design Studio and was available in seven weights from light to bold. Hermann Zapf, Gudrun von Hesse and Gerard Unger were early type designers for this new technology.
"By the 1960's a "variety of typesetting machines appeared that could image type directly from a CRT onto photographic film. Images were not generated by photographs of letters; instead mathematical formulas electronically generated the images on the screen. These were the first electronic fonts."
"The Complete Manual of Typography"
A Guide to Setting Perfect Type"
James Felici,
Peachpit Press, 2003.
5.
Bit Map Fonts
Also known as a "raster font," bitmap fonts are built from dots or pixels representing the image of each glyph in each face and size. The first bit map fonts were crude in appearance. Some type designers worked on improving the look, some created fonts that embraced the crudeness.
Currently font studios such as Atomic Media create bit map fonts for Flash, Web and screen-based design.
6.
Original Mac Screen Icons by Susan Kare
"My career in user interface graphic design began when I worked for Apple Computer between 1983 and 1986. My job: icon and font designer for a new computer, the Macintosh. The task: to transform small grids of black and white pixels into a family of symbols that would assist people in operating the computer. The design process involved the search for the strongest metaphors, and the craft of depicting them. My work also focused on developing a set of proportional typefaces for the computer screen; a departure from the monospaced characters typically found on typewriters and earlier computers. With the icon and font work, I hoped to help counter the stereotypical image of computers as cold and intimidating."
NOTE: This section images and content from the excellent "Digital Typography: A Primer"
Shared by permission of
Professor Keith Chi-hang Tam
School of Design
Hong Kong Polytechnic University
Hung Hom, Kowloon
Hong Kong
Outline fonts
Outline fonts use Bézier curves,
(shown above) for
drawing instructions and mathematical formulas to describe each glyph, which make the character outlines scalable to any size. In object-oriented software programs, a bezier curve is one whose shape is defined by anchor points set along its arc.
7.
Post Script Language Type 1
Adobe, 1985
A device independent system that allows the transfer of vector art to any output printing device. The quality of the final output will be determined by the printer. The first versions needed to have several sizes installed to appear sharp on screen, (if not installed the fonts looked jaggy and rough). The release of Adobe Type Manager allowed for the type to be scaled to infinite sizes and was a necessity until Mac OS9.
Post Script is the most frequently used font system despite the fact that it requires 2 files— a bit map suitcase file and a PostScript font file. Files made in this format are limited to 256 characters in a font which is limiting for special small cap or titling fonts and other international language use. To obtain advanced characters such as small caps, ligatures, fractions, etc one is required to buy an "expert" set,
8.
True Type (Late 1980's)
Apple & Microsoft
This rival system to Post Script also used a scalable curve system —this time quadratic curves. True Type fonts only require one suitcase and are often the default system font for macs and pcs. Because True Type fonts have more points for screen hinting, they appear sharper on screen than Post Script fonts. That is why some of the True Type fonts, such as Matthew Carter's Verdana and Georgia are so well suited to web page design. Hopefully you are reading copy in Verdana because I have asked your computer to render Verdana as the face for this text.
Figure 1a. An outline that hasn't been grid-fitted. Note how poorly the outline corresponds to the pixel pattern, and the awkwardness of the bitmapped M.
Figure 1b. The same outline grid-fitted. Now the outline has been adjusted to fit snugly around each pixel, ensuring that the correct pixels are turned on.
The bitmap, outline, and metric data are combined into a single, cross-platform file in an OpenType font, simplifying font management.
Rendering Type on Screen: Font Hinting
At low resolutions, with few pixels available to describe the character shapes, features such as stem weights, crossbar widths and serif details can become irregular, inconsistent or even missed completely. These irregularities detract substantially from the legibility and overall attractiveness of a text setting.
To increase legibility type designers use hinting, a method of defining exactly which pixels are turned on in order to create the best possible character bitmap shape at small sizes and low resolutions. Since it is a glyph's outline that determines which pixels will constitute a character bitmap at a given size, it is often necessary to modify the outline to create a good bitmap image; in effect modifying the outline until the desired combination of pixels is turned on. A hint is a mathematical instruction added to the font to distort a character's outline at particular sizes.
10.
Open Type
Adobe & Microsoft
1990's
Open Type is a cross-platform font useable on Macs and PC's. It utilizes Unicode encoding which allows for 65,000 characters in a single font which can accommodate every language in the world plus all of the small caps, and additional sets of characters to make a complete font
OpenType fonts can be distinguished by the word "Pro." Adobe Pro sets include small caps, swash and alternative characters, ligatures, ordinal numbers and letters, ornaments, fractions and Greek and Cyrillic characters.
11.
Microsoft ClearType and CoolType
2000
ClearType and CoolType are new sub-pixel font rendering technologies developed by Microsoft and Adobe respectively. Different color values at the sub-pixel level are used (instead of simply tints of the font color) to give a crisper image of the character. This technology is built in to the current version of Adobe Acrobat and Microsoft’s e-book Reader, but it only works on LCD displays.
Click this link for a good explanation and examples of sub-pixel rendering.
12.
Bitstream 1981
Founded by traditionally trained type designers, Bitstream was the first type foundry founded solely on digital technology. Founder Mike Parker came from Linotype where he turned the metal to digital designs. Partner Matthew Carter applied his expertise of traditional punch cutting and calligraphy to the new demands of digital typesetting. Carter left to start the digital foundry, Carter and Cone with Cherie Cone in 1991
13.
Macintosh"City" Type 1983
Chicago was one of a series of city-named bitmapped screen fonts designed by Susan Kare for the first Apple Macintosh. Chicago was the most important since it was used for the operating system. Chicago was an original design while the other city fonts were “reasonable facsimiles” of familiar commercial typefaces: New York was derived from Times New Roman; Geneva from Helvetica; and Monaco from Courier. A smoothed TrueType version of Chicago was created by Charles Bigelow and Kris Holmes in 1990. Five years later, Charcoal, designed by David Berlow of The Font Bureau, replaced it as the operating system font for System 8.0. Yet, the original bitmapped Chicago remains one of the quintessential identifiers of Apple computers
14.
Bigelow and Kris Holmes
Bigleow is a native of Michigan, where he attended the Cranbrook school. He was a professor of digital typography at Stanford University for thirteen years, where he taught type design, typography, and the history and theory of writing. He previously taught typography at the Rhode Island School of Design.
Kris Holmes is a calligrapher and lettering artist who has created over 100 typefaces, including the extensive Lucida family co-designed with Charles Bigelow. Lucida font family was one of the first serious attempts to make type look good on low-resolution output. She also designed the popular script faces Isadora, Apple Chancery, and Kolibri.
The couple were teachers and mentors to many type designers including Carol Twombly.
15.
Adobe Type Originals
Many of the first fonts from Adobe were digitized versions of font designs purchased or licensed from traditional type foundries. In the mid-1980's Sumner Stone advised Adobe to instigate an in-house type design program, Adobe Originals to produce high quality versions of important historical fonts. Roger Slimbach's Adobe Garamond and Carol Twombly's Trajan, Lithos and Caslon are but a few of the faces that were created under the purview of a distinguished Type Advisory Board.
"Our objective was to prove to the book world that digital type could be of high quality," says Carol Twombly, one of the type designers hired by Stone. "Back then, digital type had a poor reputation."
16.
Muriel Cooper
Muriel Cooper's first career was as a graphic designer. In 1967 she became the art director for the MIT Press where she produced over 500 books, many of which won awards for design.
She started to explore computer graphics while teaching a course at MIT called Messages and Means which looked at graphics in relation to technology. Ms. Cooper then helped found the Visible Language Workshop at the Media Laboratory where she focused on how computers can enhance the graphic communication process and, inversely, how high-quality graphics can improve computer information systems.
“What is this new medium? In general its outstanding characteristics are dynamic in real time, interactive, incredibly malleable, some capability of learning and adapting to the user, or to information, or to some other set of relationships. Our goal is to make information into some form of communication…Information by itself does not have the level of ‘filtering’that design brings to it.”
MIT Obituary for Muriel Cooper, 1994
17.
Design Before the Internet
Excerpt from Typotheque
Steven Heller, 2003
"In the 1940's architect Knud Lönberg-Holm was hired to bring order to the pages of the Sweet's Catalog. He redefined the problem, identifying a need for clarity and accessibility, and proposed to answer it by using navigational design aids and reductive language-which sounds very much like today's approach to internet wayfinding.
He collaborated with graphic designer Ladislav Sutnar who understood that tabs, icons and symbols could be hot buttons for information retrieval. Sutnar used bold graphic elements and bright primary colors to grab attention and provoke interaction on the part of the user. He developed systems to make cluttered industrial catalogs more useable that can, possibly will, impact today’s web design.
Ladislav Sutnar
And even if they do not, Sutnar’s work should be known by today’s interactive designers: his whole career was built upon the interaction between graphic devices and clear information.
While giving a lecture about "What is New in American Typography" to the Type Directors Club of New York in 1950, almost thirty years before the first designed Internet page, Sutnar defined a “new design synthesis:...[D]esign is evaluated as a process culminating in an entity which intensifies comprehension.” And clients benefited from his unswerving commitment to this idea. He developed quintessential modern systems for a variety of businesses."
(Image from Ellen McFadden's super Flicker site)
(From his bio) In 1989 he invented the World Wide Web, an internet-based hypermedia initiative for global information sharing while at CERN, the European Particle Physics Laboratory. He wrote the first web client and server in 1990. His specifications of URL's, HTTP and HTML were refined as Web technology spread.
A graduate of Oxford University, England, Tim Berners-Lee is the 3COM Founders Professor of Engineering in the School of Engineering, with a joint appointment in the Department of Electrical Engineering and Computer Science at the Laboratory for Computer Science and Artificial Intelligence (CSAIL) at the Massachusetts Institute of Technology (MIT) where he also heads the Decentralized Information Group (DIG). He is co-Director of the new Web Science Research Initiative (WSRI) and is a Professor in the Computer Science Department at the University of Southampton, UK. He directs the World Wide Web Consortium, founded in 1994
Thank you Mr. Berners-Lee.
The Impact of the Computer and Digital Type on Graphic Designers
"As Gerald Lang has wisely observed, the computer is not a tool but it is a simulator of tools. One of the things it simulates is a typesetting machine. With the spread of the personal computer, millions of people have found themselves transformed into simulations of typesetters, whether or not they wished to be so."
A Short History of the Printed Word, Robert Bringhurst & Warren Chappell, Hartley & Marks, 1999.