These are not really class notes – they parallel the class notes with ideas of things you could blog about for this class. Look back here whenever you need inspiration.

General Principles:

• Examples and applications of any one or combination of ideas and principles you heard today
• Are Cooper’s and Krug’s (and Nielsen’s) principles complementary or contradictory? How so?
• Make choices mindless – be aware of how many tiny choices you make every day as you use computers. Notice when you think about those choices – and how you think about them. If you do sit and think about your choice, this means it’s not mindless, therefore, not well designed. If it’s so quick and natural that you fly through it, it may indicate a good design.
• Rude, inconsiderate behavior – examples abound. Provide examples and think about how you would redesign them.
• Error messages – I challenge you to find examples of good, useful, and helpful error messages (unlike the one below)
  

  click to enlarge

• Provide an example of a system that predicts your behavior – accurately and/or inaccurately. Explain how it does so, and whether the implementation is successful or not.

Visual Interface Design & Design for Scanning

• Analyze the mood or the visceral response a specific software interface triggers. What about its visual design makes you feel that way?
• Try to isolate a building block of visual interface design – for example, shape, or value (color intensity). Examine how it is used in an interface to get attention and communicate function.
• Learn to notice grids in designs. Whenever you look at a Web page, count the columns. Note what the smallest grid unit is and how it is used, both for vertical and horizontal alignment.
• Learn to notice and blog about visual hierarchy. Close your eyes. Look at the screen. Note where your eyes go first, second, third. Then, examine what about the design made your eyes move on the page in that order.

Metaphors & Idioms

• Metaphors are great fall-backs for good/bad design examples. Wherever you look, if you learn to notice them, there are metaphors. Most of them come with both advantages and disadvantages. Note them. Remember that metaphors work because of the similarities between two concepts. If the two concepts are not similar enough, the metaphor breaks down – or it obscures the parts that are different. There are some examples of sites with CRAZY metaphors out there – find them and post some on your blog!
• Good idioms are so intuitive and transparent that we’re not even aware of them. Find examples of idiomatic design elements. Learn to see them. Blog your examples.
• Write a review of the new gestures in Lion OSX in light of the inverted pyramid Jing presented when thinking about idioms. Are the new gestures good idioms? How many atomic elements are there? How can actions be achieved by combining atomic elements?
• Notice and blog about how affordances are communicated through design. When you see a certain object, how do you know what it can do? How can you infer that from the design? If not from the design, then how do you know what it can do? Similarly, notice ambiguity in communicating affordances – Examples when you see a button or a design item and you have no idea what it can do. For example, the floppy disk icon communicates the affordance “Save” – but how does that make sense to someone who has never seen a floppy disk?!

Accessibility

• A common exercise is to try to navigate a site without a mouse – only with the keyboard. See how easy/difficult it is and what functions are/are not accessible
• Note the use of color and contrast on interfaces.
• Play around with this screen reader simulation (or the Web Anywhere simulation) to see what it’s like to get things done online if you’re hearing impaired. What was the experience like?

Resources

• Read an explanation of Law 508 that pertains to Web accessibility, and an explanation of the Americans with Disabilities Act

Homepage

• Examine a homepage (or more) and analyze how it answers the following questions: What is this site? What can I do here? Where should I start? Did the homepage answer all these questions at a quick glance? How was it designed in order to do that?
• Homepages often have to have a lot of content and features, and accommodate several audiences. Pick a homepage and note how it accommodates all that complexity.
• How can homepages accommodate all this complexity on small mobile screens?
• Tag lines are more a matter of marketing and PR, but if they do not make sense to users, they will, obviously, fail. Examine and critique a few tag lines and evaluate their efficiency.
• There is a design trend, pioneered by Google and Apple, that emphasizes minimalist design. How does that work for homepages?

Navigation

• Pick any random, small page – somewhere deep into a website. Analyze how it answers the following questions: Where am I relative to the Web as a whole? Where am I relative to this site?
• Pick any Web page and see how it answers these questions: Where am I? Where have I been? Where can I go from here?
• Analyze a site’s navigation solution and see how it supports both leisurely browsing and focused search.
• Remember the concept of “persistent navigation” and note how it’s implemented on various sites.
• Note and critique how breadcrumb trails are implemented on various sites.