|
| Assignments, Readings and Grading |
| INFO424 Information Visualization and Aesthetics |
Readings
Grading
Students
Assignments:
Everyone does ten assignments. Put them on your Web page. The list below details the
deliverables for each exercise. Please locate any explanation, defense or critique of your design
on a separate page. If you place a "mailto" link on this page, I will send you comments.
- 1
(1) Design a "better" web page for this course, (2) Explain why yours is a better design.
- 2
(1) For each of the four sets, describe elements of their common aesthetic, (2a) Design a gun association web page
for women and (2b) Explain why your page would attract women, (3a) Design a petroleum web
page for children and (3b) Explain why your page would attract children, and (4a) Design a
web page for fathers who seek computer games for their children, and (4b) Explain why your
page would attract men.
- 3
(1) Create an eyechart with one more character, (2) How is the chevron sign
different from the other signs, (3) Interpret the truck tilting sign and explain how it is different from the
other signs, (4) Create a sign for the Red Square garage and explain your design in terms of the other
warning signs, (5) Create an upper campus UW map that uses the aesthetic of Broadway Boogie Woogie.
- 4
Create a webpage for the poem about the grasshopper (you can type out the poem and place on the webpage
if you like), and on the same webpage add a widget (i.e., button, link, roll-over image) that communicates
"Next", another one that communicates "Previous" and an image of a grasshopper. You are at liberty to
design these widgets in any manner you like. The end result, however, should model the concept of a vertical
axis of stability. Explain how your design achieves stability.
- 5
Create a webpage for Shotgun Weddings PLC. All the text and visual elements must be present on the page.
You can re-arrange the text, manipulate font and colors, etc. Use the country buttons, the decoration and
the image of the couple as is. Arrange all these elements in a balanced design. Explain how your design achieves
stability.
- 6
Create a web page for Le Monde Interactif that is warm, flowery, projects light and evokes Claude Monet, yet
contains the 'polar/gun' content. Try to make the result less gadget heavy. You may use the gadgets on the page,
redesign them or eliminate them. The other content has to stay, but you may redesign it. Explain
the rationale for your design.
- 7
Create a web page for the Long Island Expressway. It has to be a map with color-coded stretches that indicate
the various miles per hours of the vehicles (You can invent all these data). Redesign the East and West travel
time indicators so that they are easily comprehended, and finally add a photo of the Mayor himself.
Since the Mayor gave you the "I Love NY" button,
it would probably be a good thing to add that as well. Explain the strategy of your design, especially your use
of the background page color, foreground colors, color widgets, and the colors used on the maps. The end result
should be instantly comprehensible by someone speeding down a highway at 60 mph.
- 8
Create a web page for Amazon.com. It must have the Amazon logo in the upper left corner and must be structured
using the armature that Benton used for his painting "City Activities." Create or find appropriate material to
reflect the many different kinds of products sold by Amazon and arrange them so that the viewer's eye coils,
rise, slants and dwells. Each dwell should be a anchor to further information on other Web pages (you don't
have to create these pages). Explain how your design has all the design structures of Benton's painting.
- 9
Part one: Design a one-word logo that reads as a word and also illustrates its meaning. Part two:
Design a website with the nonverbal directional icons.
- 10
Write a review or critique of a source discussing some aspect of aesthetics or visualization of
information. If the works listed on the web pages of this course are not to your taste, you may suggest
other readings.
OR
Write a review or critique of a punk-aesthetic web site.
Some Readings:
Andres, Clay, Great Web Architecture. Foster City, CA: IDG Books WorldWide, 1999
The Best Informational Diagrams. Tokyo, Japan: PIE Books, 1999.
Card, Stuart, Mackinlay, Jock and Shneiderman, Ben. Readings in information visualization: Using vision to think. San Francisco, CA: Morgan Kaufman, 1999.
Del Bimbo, Alberto. Visual Information Retrieval. San Francisco, CA: Morgan Kaufmann, 1999.
DiNucci, D., Gindice, M. & Stiles, L. Elements of Web Design. Peachpit Press, 1998.
Dondis, Dondis A. A Primer of Visual Literacy. Cambridge, MA: The MIT Press, 1973.
Fernandes, Tony. Global Interface Design. Boston, MA: AP Professional, 1995.
Fleming, J. Web Navigation: Designing the User Experience. O'Reilly, 1998.
Fry, Benjamin F. Organic Information Design. Thesis, 2000. MIT.
Heller, Steven. Design Literacy (continued): Understanding Graphic Design. New York: Allworth Press, 1999.
James J. Gibson. The Ecological Approach to Visual Perception. Boston, MA: Houghton Mifflin, 1979
Kilian, Axel. Defining Digital Space Through a Visual Language. Thesis, 2000. MIT.
Lynch, Patrick J. and Sarah Horton. Web Style Guide: Basic Design Principles for Creating Web Sites. New Haven, CT: Yale University Press, 1999
Marcus, Aaron. Graphic Design for Electronic Documents and User Interfaces. New York: ACM Press, 1992.
Pretzer, M. Creative Low-budget Publication Design. Cincinnati, OH: North Light Books, 1999.
Roberts, M. M. The Artist's Design: Probing the Hidden Order. Walnut Creek, CA: Fradema Press, 1993.
Schapiro, Meyer. Style. (pp. 81-113). In: Aesthetics Today, readings selected, edited and introduced by Morris Philipson. Cleveland, OH: World Publishing,
Spool, J.M. Web Site Usability. Morgan Kaufmann, 1999.
Stroebel, L., Todd, H. and Zakia, R. Visual concepts for photographers. London, Focal Press, 1980.
Swirnoff, Lois. Dimensional color. Boston: Birkhauser, 1988.
Tufte, Edward T. Visual Explanations: Images and Quantitites, Evidence and Narrative. Cheshire, CT: Graphics Press, 1997
Ware, C. Information Visualization: Perception for design. San Francisco, CA: Morgan Kaufman, 2000.
Wyszecki, G. and Stiles, W.S. Color Science Concepts and Methods, Quantitative Data and Formulae. Wiley, 1982.
Grading:
- Assignments 1 - 9 are each 10% of your total grade [Total: 90%]. They will be graded on these factors:
- Is the assignment complete in all the required parts?
- How brilliantly creative, innovative, unexpected, astonishing and amazingly appropriate is the result.
[Note: I will be the sole judge of these qualities, and I will be guided by the maxim of
Serge Diaghilev: "Etonnez-moi!"] [Further note: Students wanting to know what I consider brilliantly
creative and/or innovative and/or unexpected and/or astonishing and/or amazingly appropriate can attempt to
quiz me on details, but be forewarned that this is probably futile as my judgement of what is brilliantly
creative, etc., etc., changes daily.] [An extended further note: Given my enormous suggestibility, I
anticipate that your critique, judgement and defense of your work will be the most important factor in
convincing me that it is brilliantly creative, etc., etc.] [Moral: The insightful
student will readily surmise that the explanation of a creative work is often more important for its
public acceptance and understanding than the work itself.] [Further moral that could
be generalized into a maxim: The
artist is always misunderstood.]
- Assignment 10 is 10% of your total grade. It will be graded on these factors:
- How insightful and well expressed is your critique.
- How your text is itself an excellent example of formatting text.
Scale:
If you keep track of the grades you receive for each assignment, you can figure out
exactly what grade you'll receive:
| Total Points |
Course Grade |
| 95 - 100 |
4.0 |
| 90 - 94 |
3.9 |
| 85 - 89 |
3.8 |
| 80 - 84 |
3.7 |
| 75 - 79 |
3.6 |
| 70 - 74 |
3.5 |
| 65 - 69 |
3.4 |
| 60 - 64 |
3.3 |
| 55 - 59 |
3.2 |
| 50 - 54 |
3.1 |
| 45 - 49 |
3.0 |
| 40 - 44 |
2.9 |
| 35 - 39 |
2.8 |
| 30 - 34 |
2.7 |
| 25 - 29 |
2.6 |
| 20 - 24 |
2.5 |
| 15 - 19 |
2.4 |
| 10 - 14 |
2.3 |
| etc. |
etc. |
|
|