To Notes

Summary for HCI 201 -- 1/10/06

Take Quiz 1

• Quiz 1 will take place between 1:30pm and 1:50pm.

Review Questions

1. Why should you create a one-page website rather than edit a single standalone web page?
    Ans: Because the website is a folder that contains everything needed for a website. Adding new pages and other items like images to the website will be easy.

2. Write an HTML tag that changes the font to Verdana.
    Ans: <font face=Verdana>.

Installing SSH at Home

• See the document Using SSH for File Upload.

HCI for Web Design

• HCI means Human Computer Interaction.

• The study of HCI seeks to improve these aspects of computers and other electronic devices:
  Safety, Utility, Efficiency, Usability, Appeal.

• Reference is McCracken and Wolfe, User Centered Website Development, Pearson-Prentice Hall, 2004.

User Centered Web Development

• Needs Analysis
  Often a Needs Analysis is nothing more that a paragraph explaining why the website is needed. Example:

  The Shady Woods website will explain the opportunities available to campers in the Pilot Mountain, North Carolina area. It will describe camping accommodations, fishing and other tourist attractions in the surrounding area, including maps and travel information.

  The Needs Analysis can also discuss the mission of the organization, and the goals of the site.

• User and Task Analysis
  Who will be the users of your site, including age, gender, income, proficiency, and learning style?

  What sorts of tasks will the users of your site perform or want to perform on your website?

• Functional Analysis
  Which computer services are needed to perform tasks?

• Usablity Specifications
  How do you measure if your website is good?

• Design
  The design consists of the appearence of individual pages and the navigation links between pages. The more detailed the design, the faster it is to build the website.

• Prototyping
  A prototype is a model of the final website.
  Prototypes can be evolutionary or throwaway.
  Prototypes can be low fidelity or high fidelity.

• Evaluation
  Ask representative users to perform representative tasks on your website.
  Evaluation can be user-based or expert-based.

Human Memory

• Hierarchical Model

• Chunking

• Recognition vs. Recall
  
  Textbox vs. Dropdown Box Example

• Implications for Web Design
  
  A Dropdown Menu Example

Card Sorting for Web Organization

• Card sorting consists of the following steps:
  1. Tear an 8 1/2" by 11" piece of paper into eight pieces.

  2. Number the pieces of paper from 1 to 8.

  3. Write 6 to 8 tasks (objects or actions) on the pieces of paper.

  4. Ask three persons to sort the tasks into groups (about 3 or 4 groups).

  5. Record the groups that each person obtains.

• Example: Sorting the table of contents for the Jost HCI201 Website.

• Example: Amateur Astronomy.
  1. Tear two pieces of paper into eight pieces each.

  2. Number the pieces from 1 to 14.

  3. Write one of these topics on each piece of paper:
     Cameras, Getting Started, Filters, Nebulae, Magazines, Software, Clubs, Tripods, Planets, Galaxies, Telescopes, Binoculars, Books, Meteors

  4. Sort the topics into three or four topics.

• Follow the card sorting steps for your hobby website. Decide whether to express the tasks for your site as objects (nouns) or actions (verbs).

• Complete Exercise Ex3.