Color

Color: Fundamental Hues

Colors have both spatial and vibration or motion illusions.

When the six fundamental hues

yellow, orange, red, violet, blue, and green

are placed next to each other on a black background, the light yellow appears to advance and the violet lurks in the depth of the black background.

If the background color is white, it is the violet that seems to advance while the yellow sinks back into the background. The other colors are in-between in their effect.

It was discovered in 1915 that the depth perception of the six fundamental hues on a black background conform the ratio of the Golden Section in their gradation of depth.

The Golden section of a line can be defined as the proportion given by dividing a line at a point such that the shorter part is in the same proportion (r) to the longer part as the longer part is to the whole:

Golden Section Condition: r = b/a = a/(a+b)

which results in: r*r+r-1=0 and r=.618

For example, the depth perception from yellow to orange relative to orange to red follows the Golden Section.

Primary benefits of color

Designate or emphasize a specific target in a crowded display

Provide a sense of realism or virtual realism

Segment or distinguish an area of the display

Provide warning signals or signify low probability events

Group, categorize, and chunk information

Imply certain physical states

Convey emotional content

Provide an aesthetically pleasing display

Provide information coding

Potential disadvantages of color

Distract the user when inadequately used.

Dependent on viewing and stimulus conditions

Be ineffective for color deficient individuals.

Result in information overload

Unintentionally conflict with cultural conventions

Cause unintended visual effects and discomfort

Color Wheel

A design should work in black, white, and shades of gray before applying color or no color combination will be any good.

The basic tool for a designer is a good color wheel.

The primary colors in a color wheel are: red, blue and yellow.

The secondary colors are: green, orange, purple.

Complementary colors are pairs of colors arranged opposite (a primary and a secondary: red with green). Placed side by side, these cause vibrations.

Observations on Color I
Your screen color is gotten by mixing red, green, and blue light (RGB) and are additive. All three together forms white.

On paper pigment is an opaque substance that absorbs light. Since each pigment takes away color this is a subtractive process. The subtractive primaries are cyan, yellow, and magenta (CYM). All three together produces black.

Colors that sit next to each other in the color wheel are spectral neighbors (blue and green, red and orange, yellow and green). These pairs can be used for shadowing or to suggest dimension, low contrast situations. Avoid these when you need a distin ct visual boundary between touching colors.

Colors opposite one another on the color wheel are far apart visually and if they are fully saturated and placed side by side they will appear to move or vibrate. If two such colors need to touch, one should reduce the saturation of one of them and/or use a thin white or black line to create a boundary between them.

Observations on Color II

A triad is three colors equally spaced around the wheel (use of an equilateral triangle) and they are usually quite pleasing to the eye (blue, red, and yellow; or orange, green, purple).

Any equal sided figure (square, pentagon) will give a set of pleasing colors if inscribed within the color wheel and rotated to any position.

Another rule to determine the harmony of colors is that two or more colors are mutually harmonious if their mixture yields a neutral gray, complementary.

One also obtains harmony by ordering colors in their actual application by hue.

Colors used must be discriminable from each other.

Detectable by users under the lighting conditions that will be used.

Perceptually linear differences in colors by users.

Meaningful color code in terms of user relevance.

Observations on Color III

Consistency of use of coding and no exceptions.

Aesthetically pleasing combinations that do not clash or vibrate.

Coding of linear relationships (interval and quantitative scales) is better accomplished by utilizing saturation and/or luminance since they are linear.

Coding different nominal categories (no linear relationship) is better done by contrasting hues since perception of hues are represented by the color circle and have no beginning or end.

The brightest or lightest element in a dark area will attract the eye first.

Black and white has the highest contrast and it is why we usually have black text on a white background for documents.

Observations on Color IV

On a screen, a pure white background can become too bright and then fatigue may set in. A very light gray would be a better choice than pure white. Reducing contrast is needed for reducing fatigue and incre asing contrast is needed for greater visibility.

The role of the background is to recede, clarify and focus the foreground elements.

Foreground can be represented by lighter shades of gray and background by darker shades of gray.

Transparency can show contrast of background to foreground by both shadow and transparency techniques.

The eye is more sensitive to changes in lighter shades of gray than it is to the same amount of change in darker grays. People can distinguish roughly five shades of gray in addition to the end points of black and white.

Observations on Color V

Avoid color coding small objects. For fine detail one should use black, white, and gray. Surround objects in a neutral color or complementary color.

For applications involving significant non redundant use of color it is important to check the performance of the color monitor and the surrounding lighting conditions.

Seven different forms of color contrast

1.Contrast of hue
2.Light-dark contrast
3.Cold-warm contrast
cold warm shadow sun transparent opaque rare dense airy earthy far near light heavy wet dry sedative stimulant

4. Complementary contrast

Two colors are complementary if their light sources mixed together form white, or if pigments they form neutral gray-black.

They are opposite one another in the color circle.

Complementary colors used in the same proportion give an effect of static fixed images. They tend to convey stability.

5. Simultaneous contrast

Results from the fact that for any given color the eye simultaneously requires the complementary color.

This is an illusion that generates instability and tension. It can be used to convey excitement. The can be gotten by using two non complementary colors together or taking a rich primary color with a gray background.

Example: A red error flag on a gray background with no close green is a great error indicator to shake up the user.

6. Contrast of saturation

Saturated colors are diluted by mixing them with white or black.

The most saturated or pure colors are the "florescent" tones.

The effect of the "dull-vivid" contrast brought about by saturation dilution is a relative effect.

Vivid colors can be used to set off and highlight areas of dull colors in some situations. (marking, boxing)

7. Contrast of extension

One can arrive at relative areas that different colors should take up in order to balance the contrast between the colors. This is contrast by extension.

Goethe estimated a scale using pure colors on a neutral gray background of medium brilliance:

yellow : orange : red : violet : blue : green

9 : 8 : 6 : 3 : 4 : 6

For example, yellow to violet is 9:3 or 3:1. Therefore violet must occupy three times the area that yellow does for the two be in a balanced contrast when they have the same purity. Yellow has three times the strength of violet. (e.g. p ie charts)

Using these proportions provides produce areas that are static and quite.

When one violates these ratios and allows one color to dominate the results can be extremely expressive.

Typography

Type fonts classify themselves into various types:

Roman Serifs:

Oldstyle: Graramond, Caslon

Modern: Bodoni, Scotch Roman

Transitional: Clearface, Bookman

Others:

Traditional: Century, Baskerville

Square serif: Clarendon, Stymie

Sans serif (without serifs): News Gothic, Futura

Script and cursive: Lydian Cursive

Text letters: Old English, Engravers Text

Non Proportional fonts: Courier, Typewriter styles

Decorative types: Comstock, Caslon Openface

Type Structure

Serifs

Serifs at the bottom of letters help the eye visualize the "virtual" base line the type is on.

Serifs at the top help to move the eye along in the scanning process by effectively pointing to the right.

Serifs were originated with Roman stonecutters who wished to give the end of letters carved in stone more strength and crisp definition.

Typefaces without serifs are known as sans (without) Serifs and were developed after 1800.

Sans-serifs were designed as letters not for texts but for captions.

Types with serifs are more legible for reading bodies of text.

Type Characteristics I

The more letters are differentiated from each other, the easier is the reading. There are a number of different types of serifs.

The longer a line is the more important it is to use a good serif type.

The need to concentrate on rather dense type also dictates the use of good serif types.

The types of serifs are:

Bracketed: traditional, safe, and rather staid.

Hairline: graceful and nearly feminine

Wedged: impression of power

Square: exaggerated bulk that is energetic and forceful.

Rounded: familiarity with strength

Calligraphic: freely styled and informal

Type Characteristics II

Counters:

A counter is a hollow space that forms an integral part of a letter. Letters such as a, b, d, and o have closed counters, whereas the letters c, n, and v have counters that are open.

Counters influence the sense of stress or tautness in a type font. There are three types of stress: rounded, vertical, and geometric.

Geometric is considered the no stress situation.

Rounded stress is where the letters are widened so the O and others are wider and flatter than a perfect circle.

Vertical stress is where the letters are squeezed so the O and others are taller and skinner than a perfect circle.

When the O is a perfect circle we have geometric stress. Rounded stress letters are the most legible option.

Vertically and geometrically stressed letters consist of less white space and more mass. Such type fonts are more dazzling and thus more attractive to the eye even if they can not be read as fast.

Type Characteristics III

Serifs or Sans Serifs a major distinction (from stone carvings)

Without serifs more modern look. But needs to be bigger.

Times Roman was designed for newspapers to be able to set legible, compact lines of types. It is too cramped for use as a heading.

For any family of fonts such as Helvetica the type font exists in many versions that differ in weight, proportion, angle, or texture. These changes result in versions that are slanted, lightened, darkened, stretched, widened, or reversed.

Weight is perhaps the most noticeable:

extra light, light, semilight, medium,

semibold, bold, extra bold, and ultrabold

Other classifications of forms:

hairline, outline, inline, roman, italic, and bold italic.

Type Characteristics IV

Certain type fonts are so cleanly designed that they are felt to be transparent to the reader. The families of true Garamonds and Times New Roman are in this category. They are quite good for the body of te xt and for allowing contrast with display fonts for headings and such.

Certain letters composed chiefly of oblique strokes appear rather heavy. This is the case of:

A K M N V W X Y k v w x y

To avoid this heavy appearance, type designers make some of the oblique strokes thinner.

Letters divide up into the following classifications quite naturally:

Straight line letters:

AEFHIKLMNTVXYZ

Curved line letters:

BCDGJOPQRSU

Open letters (lighter):

CDGOQ

Closed letters (darker):

BHRKE

Type Characteristics V

Type Sizing

Type is measure in a system of picas and points developed by Simon Fournier in 1737, and perfected by Firmin Didot in 1785.

There are 12 points to the pica and approximately 6 picas to the inch (six picas are actually .9962 inches). Using a base of 12 rather than 10 allowed easier calculation of alternative formats since 12 is divisible by more factors than 10.

Type size is commonly measured in points beginning around 6 points on up.

In general anything 14 points and under is considered body type for regular text and anything larger is considered display size (e.g., headings and titles).

The spacing between lines is referred to as the "leading" because it was originally done with standardized strips of lead, each one or one and half points in width.

Type Characteristics VI

This spacing affects the "tone" of the text that is the sense of gray and smoothness one gets by holding the text a distance away where the individual lines are not discernible.

Decent sized spacing makes text more readable. Usually the automatic setting is 120 percent of the type size.

Typefaces with tall lowercase letters (x heights) would require more leading than those with small x heights.

As the type size increases the need for letting space does not increase linearly.

The relationship between type size, type of font, line length, open space, and leading requires visual judgment of proportions. A safe start is using 20% of the type size for leading.

Leading should never be more than half the type size unless it is used to separate ideas in bullets or lists.

Type Characteristics VII

Properties of text size and structure

baseline:

The virtual line upon which the type rests. Descenders, such as the lower part of q, p, g, etc., fall below the baseline for lowercase text.

x-height:

The height of the letter x. The ratio of x-height to the body size determines the visual importance of lowercase letters for a given typeface.

Faces with large x-heights tend to be very open, airy, and legible (e.g., Helvetica) and those with small x-heights tend to be more compact and restricted, but take up less space (e.g., Optima).

Given the same size type fonts those with smaller x-heights will look smaller.

Type Characteristics VIII

point size:

The distance from the lowest descender (e.g., p or g) to the highest part of the tallest ascender (e.g., d or b) is the type size.

em and en spaces:

Em is a square space equal to the point size and an en is half that size in width. For example, a 12 point em is 12 points wide and used to be a square blank piece of metal type. An en is half an em.

A single em is considered to be the minimum and default indent for a paragraph so that the indent size is proportional to the type size.

Em and En are also represented by the long and short dashes.

Type Characteristics IX

Line Size

Reading is easiest when a complete thought or sentence occupies one line.

If a line is too short or if sentences are so long they take many lines, then reading for comprehension is difficult, especially if the reader is not an expert on the subject material.

When a person reads the peripheral vision of the left eye is anchored to the left margin of the page. If the line is too wide and the reader looses that anchor then the eye has to use the baseline to find its way back to the beginning of the next line so that scanning and reading speed is lowered.

In general lines should be between 1.5 and 2.5 alphabets long.

Another rule of thumb is lines should be ten to twelve words long.

Once again the higher x-heights allow longer lines and smaller x-heights require shorter line lengths.

Clearly there is point where two columns of text are better than one long line.

Type Characteristics X

Kerning:

This is the process of adjusting the space between certain character pairs to minimize gaps for the best appearance and readability (example 'Ye Te' instead of 'T e Y e').

When a constant letter space is used between words it should be the width of the "i."

When kerning, spacing that is visually proportional the letter's width affords the highest degree of legibility.

Good typography dictates that type be set with minimum letter spacing where possible.

Example letter pairs that are considered to be kerning pairs are:

AC AL AN AO AT AV AW AY

V, V. Va Ve Vo WA Wa We Wh Wi Wo Wr

Certain double and triple letter combinations were set as a separate piece of type to ensure close spacing:

fi, ffi, fl, ffl, ff, ae, ce.

Type Characteristics XI

Whitespace

The Italian Renaissance regarded empty space as background, further back, and encircling the object.

Modern art considers empty space as an equal part of the composition.

Consider the white space inside the D as representing the letter.

The unprinted counterforms can also be enhanced in emphasis by placing letters closer together. Compare the internal form of the space in the D and the O for a number of different fonts.

Also, if you can graphically space letters take a word and move the letters closer and closer together until they overlap. These exercises show the impact of the whitespace.

Modern fonts tend to allow such manipulation and remain legible.

Illusion I

Our visual perception and the associated aesthetic sense are different than the reality of geometric design. Humans see things differently from the real way they are drawn.

The proportions, arrangements, forms, and type fonts that look good to the eye cannot be constructed geometrically by using a straight edge and compass because of the illusions of the human eye.

The eye tends to magnify all horizontal values and diminish vertical ones. The resulting optical illusions are real and must be dealt with as part of the design process.

Illusion II

They are well known in typography but apply equally well to interactive screen and icon design.

1. The geometric square looks greater in width than in height. An optical square must therefore be slightly increased in height to appear to the eye as a square.

2. When a geometric figure is divided transversely, the lower half looks smaller. (consider the design of the letters A and H.)

3. The thick horizontal bar looks fatter than a bar of equal geometrical thickness placed on end. The "force of gravity" active in a form makes it broader. (Consider why we make various parts of letters thicker and thinner.) The thic k bar placed on end looks thinner in the direction of gravity (at the bottom). (Consider the design of pillars in ancient buildings such as the Parthenon.) Note that ascenders in type are usually shorter than descenders.

Illusion III

4. Reducing a black square in size makes it look like a rounded dot.

5. The geometric circle looks wider than its height. Note that the letter O is rarely a perfect circle, at least on the inside, in a type font.

6. Two constructed semi-circles, joined to make an S, cannot form and organic whole. The two movements come to a halt (to the eye) at the point of the union and this break must be smoothed over optically.

7. A circular movement flows into two straight lines. The tendency of the semicircle to close must be prevented by two straight lines. Again there is a break at the points of transition. A U cannot be constructed geometrically.

Illusion IV

8. The same black circle changes in appearance depending on its position on a plane surface. In the upper part of the surface it seems to float (balloon) whereas the lower edge it conveys a sense of weight (wheel). Our visualization of an object is influenced by prior experiences.

9. The triangle placed like a pyramid looks stable; turned upside down the same form looks unstable and irresolute. The same is true of the square sitting flat or turned on end (diamond).

10. A thick bar placed horizontally and vertically. The form looks heavy and weighty when horizontal, but lighter and more mobile when vertical.

11. Given a white square on a black background and a black square of the same size on a white background, the white square radiates beyond its edges against the black background and looks appreciably larger than the black square of e qual size on a white background.

Illusion V

12 Taking a series of parallel lines to make up a square area, the use of horizontal lines make the square look higher than it is; while the vertical lines make the square look wider.

13. Given a square formed by either two horizontal or two vertical lines, the horizontal lines make the surface look wider; the vertical lines increase its height.

14. Two lines of the same length look shorter or longer on a relative basis by the shape of the arrows on the end ( < > or > < ). Serifs on ascenders or descenders can make them look longer or shorter by the shape of t he serifs.

15. The eye creates movement as a result of its scanning process. The dot moves and gives rise to the line, the line moves and gives rise to a plane, and the plane moves and gives rise to a body.

Illusion VI

Tautened

Certain figures and shapes can exhibit stress that is referred to in typology as being "tautened."

A vertical line is tautened and the tautering lies in the direction of gravity. A horizontal line that connects to two vertical supports (H) is tautened from left to right.

If there is sufficient blank space between the line and each side (l - l) the tension is removed and the line appears at rest.

Illusion VII

Tension, Stress and Harmony

Design is a process of choosing a compromise between a degree of tension and a degree of harmony.

A group of lines to create a surface is in harmony with other lines; but a solid surface and line create a tension due to contrast and both the line and the surface is intensified.

The letter L is a combination of a linear form with a slight addition of surface.

Finally there is an illusion of motion. Humans seek to group things together mentally and this causes them to make inferences from objects in close proximity.

Feeling & Rhythm

tolstoy Wa r and Peace

GOING

GOING

GOING

GONE

JazzJazzJazzJazzJazzJazzJazzJazzJazzJazzJazz

JazzJazzJazzJazzJazzJazzJazzJazzJazzJassJazzJazzJazz

"Fury said to a mouse, That he met in the house, 'Let us both go to law: I will prosecute you. Come I'll take no denial; We must have a trial; For really this morning I've nothing to do.' Said the mouse to the cur, 'Such a trial, dear Sir With no jury or judge would be wasting our breath.' 'I'll be judge, I'll be Jury, said cunning old Fury: I'll try the whole cause, and condemn you to death

Lewis Carroll's 'The Mouse's Tale (tail)'

Type Contrast

I T	vertical, passive horizontal, active
I /	straight, static, geometric, symmetry oblique, dynamic, organic, asymmetry
K I	agitated restful
H H	large small
O T	round, soft straight, hard
O X	concentric, closed eccentric, open
A a	upper case, static lower case, dynamic
V A	Unstable Stable

Type Illusions I

No mechanical way of measuring spaces between letters. An optical illusion occurs.

Adding diagonals to lines makes them longer or shorter. ' I ' seems longer than ' J ' but they are the same height.

A line placed in the middle of a space will seem lower than the middle so the lines in H are usually above the middle.

Comparing IL and LI, the IL space seems larger, also YT seems closer than dose JT.

In the combinations HIT, HOT, and HOOK, the H and O have to be closer together than H and I to appear equal. The OO has to be still closer.

The unbalanced appearance of a word is produced in "COFFEE" or in "OGEE" when the open letters are exaggerated or are much wider than the other letters.

Type Illusions II

Some words have distinctive silhouettes: HEN, GOOD, BLOSSOM, ALMA, and COLLEGE.

Lay a piece a paper over a line of capital letters, covering half, and most of the capital letters will be indistinguishable. Do the same with a line of lower case and most of the lower case letters can still be recognized with their bottom half missi ng.

A black square creates a hole in a white space and varying shades of gray create holes to a lesser extent.

The finer the lines of a gray square the more intense and uniform is the gray, even if the relative amount of actual white coverage is the same. Lines of type create a gray surface and what is called the "tone" of the type area.

Type Illusions III

In a book, readable lines are usually considered as ten to twelve words (6 characters on the average for words), while for newspapers it is considered to be five to seven words.

The margins of a page in a book help to increase the size of the line, while in a newspaper there is very narrow white spaces between columns so that lines too long will send the eye scanning to the next column.

When lines become too long it is difficult to pick up the next line.

The longer the line, the more one has to increase the line spacing to ease the linear scanning process and the return of the eye to the beginning of the next line (this is referred to as 'registration').

Margins

The oldest theory about margins is known as the "golden section" (Jan Tschichold, a Bauhaus designer). Observed that many medieval manuscripts used the proportion of 2:3:4:6 for the inner, ou ter, head, and foot margins. One can construct this proportion uniquely using a compass and a straight edge on any two page layout. Other such constructions exist to express alternative versions of a basic 2:3 proportion.

The width of the page should be proportional to its depth by a ratio of 2:3. The 6 by 9 inch book format conforms to this exactly. The ratio of the text to the page area is also 2:3 so that for a 6 by 9 inch book the text is 4 by 6 i nches. Text should be at least as deep as the sheet is wide.

Poster and Screen Design

There is a certain similarity between the art of designing a poster and that of designing an interface screen.

The objective of a poster is to go beyond the mere convenience of an impression and appeal to instincts, emotions, reason, and judgment.

A successful interface screen demands attention, holds it, and crates a desire to interact with it.

Poster design variables:

Simplicity

Unusual or Novel

Suitability

Tone and color

Spacing and proportion

Rhythm

All these are appropriate measures for screen design. Even "novel" is very appropriate for gaming applications or providing strategic screens that will be striking.

Other measures of type quality

Distinctiveness:

The distinguishing characteristics of each letter are strongly marked; for example, the lip on the Q from O; the R and P, the C and G; and within combinations such as LIT.

The more distinctive the letters the easier it is to read the font.

Simplicity:

There are no unnecessary parts as in the Victorian fonts.

Proportion:

No part of a letter is wrongly exaggerated or dwarfed.

Beauty of form:

Each letter is an individual and living whole.

Beauty of Uniformity:

The existence of a family likeness of the different letters so they go well together.

Beauty of the Arrangement

The general fitness in the placing, connecting, and spacing of letters, words, and lines within the space.

Most screen layouts are asymmetric or what is called informal balance.

Informal balance is livelier and holds greater interest than formal balance.

The golden division of a line or the "golden mean," is considered quite pleasing to the eye and is an imbalanced ratio that occurs quite a bit in nature (.618:1 or .382:.618). This ratio is sometimes approximated by 3:5 or 3/8:5/8.

If one is looking at a standard page the optical center is higher than the mathematical center and the Golden Division Line is slightly above the optical center.

Type and Color

Early Reading Speed Tests (Paterson & Tinker, 1940)

	Color Combination	Differences in %
	Black on white	0.0
	Green on white	-3.0
	Blue on white	-3.0
	Black on yellow	-3.8
	Red on yellow	-4.8
	Red on white	-8.9
	Green on red	-10.6
	Orange on Black	-13.5
	Orange on white	-20.9
	Red on green	-39.5
	Black on purple	-51.5

Signs

Semantography.

Approximate 100 abstract images invented by Charles Bliss in 1949 to fit on an IBM typewriter ball.

They could be utilized to compose more complex figures.

There was some limited success in using this pictorial language with handicapped individuals as a communication medium.

Semantography Samples

Semiotics (Signs) I

It is probably Hippocrates who is considered the father of semiotics which is the study of signs.

Icons:

An icon is something that represents something else that is usually static in nature.

The stars in the American flag "icon" represents the states and the stripes represent the original colonies.

The American flag represents the country just as religious icons represent God.

Many of the icons in a tool menu represent a specific menu choice that can be made.

Symbols:

A symbol is somewhat more dynamic in nature and conveys a condition that is not obvious from the actual sign itself.

The American flag at half mast indicates the death of someone important to the country.

Meaning is not represented within the symbol itself but is convey by triggering semantic content in the mind of the viewer.

Many trademarks are really symbols in that the connection between the mark and what it represents has to be learned.

Semiotics (Signs) II

Indexes:

Indexes are the most dynamic use of signs in that they signify a contextual situation.

The American flag on the battlefield may signify the position of the front line.

The flag on a ship signifies what country the ship is registered to.

Example:

In an interface we can conceive of the Hourglass being used in all three ways.

When the cursor turns to an hourglass in windows, it is being used as a symbol that the processor is busy and that the user cannot undertake an action while that symbol is present.

If the computer knew how long it was going to be busy and the actual amount of sand in the hourglass was set to indicate at any instance how much longer the processor would be busy, then the hourglass becomes an index sign.

If the hourglass were on the toolbar and choosing it meant to start a run or execution of a task, then it is the usual icon.

Current use of signs in interfaces have largely focused only on icon usage and there is a great deal of future possibility for using signs as symbols and as indexes.

Semiotics (Signs) III

Other dimensions of signs are:

Image: The sign resembles in appearance that of which it is a likeness.

Diagram: Reveals structure of the depicted fragment of reality.

Metaphor: Emphasizes important properties of the subject it refers to.

Assimilative: Relationship to reality fragment is not obvious and must be learned.

Another factor that applies to signs (as well as words) is whether the meaning is inherent in the sign or the meaning depends upon the context of the communication. Such signs are called "shifters" in linguistics.

The Structural Model of Communications

Pragmatics: Context, Virtual Channels

Semantics: Interprets, Formulates

Syntactics: Encode, Decode

The Structural Model of Communications

In the above model of communications, the virtual channels are the ones that determine the "success" of communications.

A sender has a pre conception of how the receiver will interpret the message, that influences the formulation of the message, and the feedback that will be expected to confirm the interpretation of the message.

The process of modifying the virtual channels is in fact the process of learning.

This is very different than the classical mathematical formulation of Information Theory.

The information content of the above types of messages are dependent upon the relative understandings of senders and receivers. (Transaction Dependent)

Trademarks

Brands for livestock, wood, leather, etc.

Tool marks, Engravings

Some of the earliest signs in western civilization were the "house-marks" which denoted ownership of items by a family. They were carved in the wood owned and harvested, the livestock were branded with it, and tools and other possessions were labeled with the marks.

Mystic Signs (Masonic/Dollar Bill)

Families of Signs (powerful)

Circuit components, flow chart symbols, etc.

In many scientific engineering fields, the signs are standardized.

Signs in an interface situation should be viewed in the context of establishing families of signs. The following medieval set illustrates the power of this approach.

The use of signs in interface design is in a very primitive state considering the dynamic possibilities of animation that can go far beyond the historical use of signs.

TERMINAL MUMPS: Popular and Bizarre Character Names

! exclamation point, exclamation, bang, factorial, excel, ball-bat, smash, shriek, cuss, wow, hey

!? interrobang

" double quote, quote, dirk, literal mark, rabbit ears

# pound sign, number sign, sharp, crunch, mesh, hex, hash, flash, grid, pig-pen, tictactoe, scratchmark, octothorp

$ dollar sign, currency symbol, buck, cash, string, escape, ding, big-money

% percent sign, percent, mod, double-oh-seven

& ampersand, amper, and, address, andpersand

' apostrophe, single quote, quote, prime, tick

Paralinguistic Cues in ASCII

Basic Faces
:-) basic smiley, ha ha, happy, humorous,smiling

:-( boo hoo, frowning, mad, sad, un-smiley

:'-( crying

:'-) crying with happiness

:-* Oops!

:-< frowning, real sad

:-> biting sarcastic face, hey hey

:-@ extremely angry, screaming, swearing
Other Symbols

-/- stirring up trouble

>w nose-thumbing gesture

@= flame, nuclear bomb going off, war started

@>--->---- a rose

@l@ too many hours at terminal

[] hugs

xx kisses

_\\// Vulcan salute

__! enough for now

|-{ Good Grief!

||*( handshake offered

||*) handshake accepted

@%&$%&$\&*@%$#@ obvious

Forms & Proportions

Name	side ratio	diagonal	equal division	inscribed square: resulting rectangle ratio
Square	1:1	1.414 Ö 2	2:1	infinity
square root of two	1.414:1	1.732 Ö 3	1.414:1	2.414:1
square root of three	1.732:1	2.000 Ö 4	1.155:1	1.366:1
double square, or square root of four	2:1	2.236 Ö 5	1:1	1:1
square root of five	2.236:1	2.449 Ö 6	1:1.118	1:1.236
golden rectangle	1.618:1	1.902	1.236:1	1.618:1

Golden Rectangle

Consider the summation series where each succeeding number of the sum of the prior ones:
1-2-3-5-8-13-21-34-55-89 ...

n(i) = n(i-1) + n(i-2)

Consider A:B::B:C, for example: 1:2::2:3 or 2:3::3:5. For this series, the product of the means BB is always 1 greater than the product of the extremes AC.

BB +1 = AC or BB = AC + 1

As the numbers in the series gets larger the error of one becomes very small and the resulting limit is the Golden Rectangle where the product of the means equals the product of the extremes.

BB = AC

Definition of GR: r = B/C = A/B

BB = AC implies BB = A(A+B)

r*r + r - 1 = 0

r = .618 and 1/r = 1.618

Logarithmic spirals found in nature (e.g., pine cones, sunflowers, flower petal arrangements, pineapples, etc.).

Depth

1. Contrast and gradation in size.

2. Converging parallels and diagonal action.

3. Position in the picture plane.

4. Overlapping.

5 Transparency and exposure of hidden lines.

6. Diminishing detail

7. Atmospheric perspective

8. Advancing and receding color.

9. Motion in and out of the plane such as zooming.

Panning in the x and y dimensions

up-down and right-left for panning

forward-backward for depth

in-out for zooming

rotation (aerial views, back views)

distortion (e.g., fish eye)

animation (movement of by themselves objects)

Virtual Reality manipulation (putting ones hand in the screen)

Color & Shapes